طريقة putImageData () قماشية HTML

❮ مرجع قماش HTML

مثال

ينسخ الكود أدناه بيانات البكسل لمستطيل محدد على اللوحة القماشية باستخدام 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);
}

دعم المتصفح

تحدد الأرقام الواردة في الجدول إصدار المتصفح الأول الذي يدعم الطريقة بالكامل.

Method
putImageData() Yes 9.0 Yes Yes Yes

التعريف والاستخدام

طريقة putImageData () تعيد بيانات الصورة (من كائن ImageData محدد) إلى اللوحة القماشية.

نصيحة: اقرأ عن طريقة getImageData () التي تنسخ بيانات البكسل لمستطيل محدد على لوحة قماشية.

تلميح: اقرأ عن طريقة createImageData () التي تنشئ كائن ImageData جديدًا وفارغًا.


بناء جملة JavaScript

بناء جملة JavaScript: السياق .putImageData ( imgData، x، y، dirtyX، dirtyY، dirtyWidth، dirtyHeight

قيمه المعامل

Parameter Description
imgData Specifies the ImageData object to put back onto the canvas
x The x-coordinate, in pixels, of the upper-left corner of the ImageData object
y The y-coordinate, in pixels, of the upper-left corner of the ImageData object
dirtyX Optional. The horizontal (x) value, in pixels, where to place the image on the canvas
dirtyY Optional. The vertical (y) value, in pixels, where to place the image on the canvas
dirtyWidth Optional. The width to use to draw the image on the canvas
dirtyHeight Optional. The height to use to draw the image on the canvas

❮ مرجع قماش HTML