Wie macht man Fotocollage in Leinwandbild mit Fabric JS?

Question

Ich verwende Fabric JS für die Customizing-Produkte. In diesem Fall möchte ich die Funktion zum Hochladen von Fotocollagen hochladen, indem ich Fabric JS in Canvas verwende. Ich habe keine Ahnung davon.

Unten ist das Bild, das ich wirklich für eine Collage machen möchte. Bitte sagen Sie mir, wie Sie es mithilfe von Fabric JS oder Beispielcode erstellen können.

Bitte folgen Sie diesem Bild:

Answer 1

Sie können mehrere Leinwand versuchen Fotocollage Bild zu erstellen. Auf jeder Leinwand kann jeder Bilder hinzufügen. Das Endergebnis wird als Fotocollage erstellt. Verwenden Sie mehrere Leinwand wie folgt

$(XML).find('view').each(function() { 
    var canvasXMLCnt = 0; 
    var viewType = $(this).find('view_type').text(); 
    var divID = 'dynamicDiv_'+viewType; 
    createDynamicDiv(divID); 
    var aLink = '<a href="javascript:void(0);" id="view_'+viewType+'"> View '+viewType+' </a>'; 
    $("#multipleViewsDiv").append(aLink); 
    $(this).find('canvas').each(function() { 
     canvasXMLCnt++; 
     var canvasID = $(this).find('canvas_id').text(); 
     var variable_DynamicCanvas = 'canvas_'+viewType+'_'+canvasXMLCnt; 
     var dynamicCanvas = document.createElement('canvas'); 
     dynamicCanvas.id = variable_DynamicCanvas; 
     dynamicCanvas.className = 'dynamic-canvases'; 
     var createdDiv = document.getElementById(divID); 
     createdDiv.appendChild(dynamicCanvas); 
     canvasArray.push(variable_DynamicCanvas); 
    }); 
}); 

prüfen diese reference