如何使用Fabric JS在画布图像中制作照片拼贴？

Question

我正在使用Fabric JS来定制产品。在这种情况下，我想在画布上使用Fabric JS制作照片拼贴图像上传功能。我对此一无所知。

下面是我真正想要制作拼贴画的图像。请有人告诉我如何使用Fabric JS或示例代码来完成此任务。

请按照此图片：

Answer 1

你可以尝试多个画布来创建照片拼贴图像。在每个画布上，任何人都可以添加图像。最终结果将产生照片拼贴。     使用多个画布，如下所示，

$(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);
    });
});

选中此reference