مثال
رمز أدناه نسخ البيانات بيكسل للمستطيل المحددة على قماش مع 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() | 4.0 | تسعة | 3.6 | 4.0 | 10.1 |
تعريف والاستخدام
و putImageData() أسلوب يضع بيانات الصورة (from a specified ImageData object) مرة أخرى على قماش.
Tip: اقرأ عن getImageData() الأسلوب الذي ينسخ البيانات بيكسل للمستطيل المحدد على قماش.
Tip: اقرأ عن createImageData() الأسلوب الذي يخلق، وجوه ImageData فارغ جديد.
جافا سكريبت بناء الجملة
| جافا سكريبت بناء الجملة: | context . putImageData( imgData,x,y, dirtyX,dirtyY,dirtyWidth,dirtyHeight ) . |
|---|
قيم معلمة
| معامل | وصف |
|---|---|
| imgData | يحدد الكائن ImageData لوضع مرة أخرى على قماش |
| x | الإحداثي س، في بكسل، من الزاوية العلوية اليسرى من وجوه ImageData |
| y | الإحداثي ص بالبكسل، من الزاوية العلوية اليسرى من وجوه ImageData |
| dirtyX | اختياري. الأفقي (x) قيمة بالبكسل، حيث لوضع الصورة على قماش |
| dirtyY | اختياري. العمودي (y) قيمة بالبكسل، حيث لوضع الصورة على قماش |
| dirtyWidth | اختياري. عرض لاستخدام لرسم الصورة على قماش |
| dirtyHeight | اختياري. الارتفاع إلى استخدام لرسم الصورة على قماش |
<كائن قماش