GetImageData与多幅图像

Question

如何在js中使用getImageData()，当图像被绘制到画布上时？(我需要每幅图像的数据。)

Answer 1

有一种方法：

// get the imageData for the second image

context.drawImage(secondImage,0,0);
var imageData2=context.getImageData(0,0,canvas.width,canvas.height);
context.clearRect(0,0,canvas.width,canvas.height);

// get the imageData for the first image

context.drawImage(firstImage,0,0);
var imageData1=context.getImageData(0,0,canvas.width,canvas.height);

// and now redraw the second image back on the canvas

context.drawImage(secondImage,0,0);

Answer 2

或者简单地为每个图像创建一个画布对象。他们将正确的视觉层，但你可以独立处理图像。如果您不处理z索引，它们将按照添加画布对象的顺序呈现。