我有一个画布,用户可以使用div他们点击的另一个图像创建一个设计,将它发送到Fabric.js画布,在那里它被移动,依此类推.由于画布的大小width="270"和height="519",比成品是什么时,我需要的是有大小画布重建它width="1001"和height="1920",然后截图,以便我得到这一切在1个图像.我该怎么做呢?
这是我的代码到目前为止的样子:
HTML
<div id="CanvasContainer">
<canvas id="Canvas" width="270" height="519"></canvas>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS
#CanvasContainer {
width: 270px;
height: 519px;
margin-left: 15px;
}
#Canvas {
overflow: hidden;
}
Run Code Online (Sandbox Code Playgroud)
JAVASCRIPT
//Defining Canvas and object array
var canvas = new fabric.Canvas('Canvas');
//When clicked
$(document).ready(function () {
$("#Backgrounds img").click(function () {
var getId = $(this).attr("id");
//adding all clicked images
var imgElement = document.getElementById(getId);
var imgInstance = new fabric.Image(imgElement, {
left: 135,
top: 259,
width: 270,
height: …Run Code Online (Sandbox Code Playgroud)