canvas - html5画布像素操作和转换

Question

由于 putImageData 不受变换的影响，我如何操作图像中的像素然后对结果使用变换？例如，我想让图片中的红色更亮，然后将图片旋转 36 度。

使用 putImageData 似乎不是答案，因为我无法旋转它。我尝试放在一个新的画布上并使用 drawImage(newCanvas,0,0) 但这甚至根本没有绘制图像。

我难住了。

Answer 1

使用新的画布就可以了。您只需要先提取图像。像这样的东西会起作用：

Image img = new Image();
img.src = newCanvas.toDataURL();
canvas.drawImage(img, x, y); // img is drawn with current transformation

调用toDataURL()获取画布内容的快照；调用后对内容的更改newCanvas不会出现在图像中。