0
Please check attached screenshot 我已經使用setFill將圖像設置爲svg圖像。一旦圖像被設置,我必須改變寬度,高度或對圖像執行操作。當用戶在畫布上選擇svg時,如何獲得填充圖像對象。在布面上使用織物js縮放圖像
Please check attached screenshot 我已經使用setFill將圖像設置爲svg圖像。一旦圖像被設置,我必須改變寬度,高度或對圖像執行操作。當用戶在畫布上選擇svg時,如何獲得填充圖像對象。在布面上使用織物js縮放圖像
縮放:
image.on('scaling', function (opt) {
var r = canvas.getRetinaScaling();
var sX = Math.abs(this.scaleX) * r;
var sY = Math.abs(this.scaleY) * r;
canvas.setWidth(image.width * sX);
canvas.setHeight(image.height * sY);
canvas.renderAll();
});
$("#save1").click(function() {
var arrFormat = g_filename.split('.');
var arrFilename = g_filename.split('/');
var filename;
var format;
if (arrFormat.length == 1)
format = "image/" + "jpg";
else {
format = "image/" + arrFormat[arrFormat.length - 1];
}
if (arrFilename == 1)
filename = g_filename;
else {
filename = arrFilename[arrFilename.length - 1];
}
var serverUrl = "/Home/UploadImg5";
var imageName = filename;
// 이미지를 첫번째것을 가져온다.
var obj = canvas.item(0);
var width = Math.abs(image.width * image.scaleX);
var height = Math.abs(image.height * image.scaleY);
var dataURL = canvas.toDataURL({ format: format, left: obj.left, top: obj.top, width: width/ratio, height: height/ratio });
canvas.discardActiveObject();
canvas.renderAll();
$.ajax({
type: 'POST',
url: serverUrl,
data: {
title: imageName,
type: "jpg",
image: dataURL // Step 1에서 가져온 데이터
}
}).done(function() {
console.log('saved!');
});