การวาดภาพจาก URL ข้อมูลไปยังผ้าใบ HTML5

หากคุณมี URL ข้อมูล คุณสามารถสร้างรูปภาพลงในผ้าใบได้ ซึ่งสามารถทำได้ตามที่แสดงในข้อมูลโค้ดต่อไปนี้ -

var myImg = new Image;
myImg.src = strDataURI;

วิธี drawImage() วาดภาพ แคนวาส หรือวิดีโอลงบนผืนผ้าใบ วิธี drawImage() ยังสามารถวาดส่วนต่างๆ ของรูปภาพ และ/หรือเพิ่ม/ลดขนาดรูปภาพได้

โค้ดที่ให้ไว้ด้านล่างนี้ก็เหมาะสมกับลำดับเช่นกัน - สร้างภาพ ตั้งค่า onload เพื่อใช้ภาพใหม่ จากนั้นตั้งค่า src -

// load image from data url
Var Obj = new Image();
Obj.onload = function() {
   context.drawImage(myImg, 0, 0);
};
Obj.src = dataURL;