füllen Sie zusätzlichen Bereich mit benutzerdefinierten Farbe beim Zuschneiden mit Cropper.js

Question

Ich benutze Cropper.js-Bibliothek, um Zuschneide-Koordinaten und Breite und Höhe ein Bild auf Client-Seite und Intervention in Laravel 4, um es tatsächlich in Server-Seite mit der Corp Corp. Daten.

JavaScript-Funktion:

$('#image').cropper({ 
      aspectRatio: 16/9, 
      crop: function (e) { 
       // To send cop data to server 
       x = e.x; 
       y = e.y; 
       width = e.width; 
       height = e.height; 
       rotate = e.rotate; 
       scaleX = e.scaleX; 
       scaleY = e.scaleY; 
       $('#x').val(x); 
       $('#y').val(y); 
       $('#width').val(width); 
       $('#height').val(height); 
       $('#rotate').val(rotate); 
       $('#scaleX').val(scaleX); 
       $('#scaleY').val(scaleY); 
      } 
     }); 

PHP/Laravel Funktion:

$img->crop($width, $height, $x, $y); 

Wenn Bereich abgeschnitten aus Bild, diese zusätzliche Fläche wird automatisch mit schwarzer Farbe gefüllt. Ich möchte, dass es stattdessen mit weißer Farbe gefüllt wird.

Dies erzeugt dieses Bild

ich die schwarze Farbe auf Weiß ändern möchten.

Answer 1

Sie eine Kombination von Befehlen in Eingriff benötigen:

1. Leinwand erstellen in der richtigen Größe
2. mit einer Farbe mit Füllung Füllen Sie es()
3. Verwendung insert() Ihr Bild zu platzieren

So würden Sie so etwas wie dieses (nicht getestet)

$destination = Image::canvas($width, $height); 
$destination->fill('#ffffff'); 
$destination->insert($img, $x, $y);