ارسم الصور
var image = new image () ؛
Image.src = "http://img4.duitang.com/uploads/item/201406/25/20140625182321_4mtau.thumb.700_0.jpeg" ؛
image.onload = function () {}
context.drawImage (Image ، x ، y) ؛
context.drawImage (Image ، X ، Y ، W ، H) ؛
context.drawiamge (Image ، SX ، SY ، SW ، SH ، DX ، DY ، DW ، DH) ؛
تبليط الصورة
var pat = context.createpattern (صورة ، "كرر") ؛
context.fillStyle = pat ؛
Context.FillRect (0،0،400،300) ؛
زراعة الصورة
ارسم المسار أولاً
context.clip () ؛
<html> <head> <meta charset = "utf-8"> <title> ارسم الصور </title> <meta name = "viewport" content = "width = width device ، inials-scale = 1 ، minimit-scale = 1 ، maximum-scale = 1 ، user-scalable = no"/> </head> <body> type = "text/javaScript"> var ocanvas = document.getElementById ("canvas") ؛ var context = ocanvas.getContext ("2d") ؛ context.fillStyle = "#ededed" ؛ context.fillRect (0 ، 0 ، 500 ، 500) ؛ // ارسم الصورة var img = new image () ؛ // إنشاء img.src = "img/01.jpg" ؛ // عنوان الصورة img.onload = function () {// اكتشاف جميع صفحة تحميل معلومات الصورة context.drawImage (img ، 0 ، 0) ؛ // كائن IMG ؛ 0،0: IMG تنسيق نقطة البداية} ؛ </script> </body> </html>