Computer >> คอมพิวเตอร์ >  >> การเขียนโปรแกรม >> Javascript

ครอบตัดผ้าใบ / ส่งออกผ้าใบ HTML5 ด้วยความกว้างและความสูงที่แน่นอน


สำหรับสิ่งนี้ ให้สร้างแคนวาสชั่วคราวสำหรับวาดภาพบนแคนวาสปัจจุบัน หลังจากนั้นใช้เมธอด toDataUrl() บนแคนวาสชั่วคราว -

var c = document.getElementsByTagName("canvas");
var ctx = c[0].getContext("2d");
var data = ctx.getImageData(0, 0, c[0].width, c[0].height);
var compositeOperation = ctx.globalCompositeOperation;

ctx.globalCompositeOperation = "destination-over";
ctx.fillStyle = "#800000";
ctx.fillRect(0,0,c[0].width,c[0].height);

var tempCanvas = document.createElement("canvas"),
tCtx = tempCanvas.getContext("2d");
tempCanvas.width = 550;
tempCanvas.height = 280;
tCtx.drawImage(canvas[0],0,0);