مثال
رمز أدناه نسخ البيانات بيكسل للمستطيل المحددة على قماش مع getImageData() ، ومن ثم وضع بيانات الصورة مرة أخرى على قماش مع putImageData() :
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="red";
ctx.fillRect(10,10,50,50);
function copy()
{
var imgData=ctx.getImageData(10,10,50,50);
ctx.putImageData(imgData,10,70);
} انها محاولة لنفسك » دعم المتصفح
الأرقام في الجدول تحدد أول نسخة مستعرض يعتمد الأسلوب بشكل كامل.
| طريقة | |||||
|---|---|---|---|---|---|
| putImageData() | نعم فعلا | تسعة | نعم فعلا | نعم فعلا | نعم فعلا |
تعريف واستخدام
و putImageData() أسلوب يضع بيانات الصورة (من كائن ImageData المحدد) مرة أخرى على قماش.
نصيحة: اقرأ عن getImageData() الأسلوب الذي ينسخ البيانات بيكسل للمستطيل المحدد على قماش.
نصيحة: اقرأ عن createImageData() الأسلوب الذي يخلق، وجوه ImageData فارغ جديد.
جافا سكريبت بناء الجملة
| جافا سكريبت بناء الجملة: | context.putImageData(imgData,x,y,dirtyX,dirtyY,dirtyWidth,dirtyHeight ); |
|---|
قيم معلمة
| معامل | وصف |
|---|---|
| imgData | يحدد الكائن ImageData إلى ضعه من جديد على قماش |
| x | الإحداثي س، بالبكسل، من الزاوية العلوية اليسرى من وجوه ImageData |
| y | الإحداثي ص، بالبكسل، من الزاوية العلوية اليسرى من وجوه ImageData |
| dirtyX | اختياري. قيمة الأفقي (س)، في بكسل، حيث لوضع الصورة على قماش |
| dirtyY | اختياري. قيمة العمودي (ص)، في بكسل، حيث لوضع الصورة على قماش |
| dirtyWidth | اختياري. عرض لاستخدامها لرسم الصورة على قماش |
| dirtyHeight | اختياري. الارتفاع إلى استخدامها لرسم الصورة على قماش |