ข้อมูลอ้างอิงHTML

HTML โดยตัวอักษร HTML ตามหมวดหมู่ รองรับ HTML Browser แอตทริบิวต์ HTML HTML Global Attributes เหตุการณ์ HTML HTML สี HTML Canvas HTML เสียง/วิดีโอ ชุดอักขระ HTML HTML Doctypes การเข้ารหัส URL HTML รหัสภาษา HTML รหัสประเทศ HTML ข้อความ HTTP วิธี HTTP ตัวแปลง PX เป็น EM แป้นพิมพ์ลัด


ผ้าใบ HTML putImageData ()เมธอด

❮ การอ้างอิงผ้าใบ 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 Syntax

ไวยากรณ์ 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