小编nov*_*ice的帖子

这是我第一次使用 html5 画布，我还不知道它是如何工作的。

我的问题是，我必须修改画布中图像的颜色。如果只有一张图片，这很容易。但是，我会有不止一个，换句话说，重叠的图像。

为了进一步理解我的问题，我创建了一个插图。只有 2 个图像文件，图像 1 和图像 2：

这是我当前的代码（这里也有小提琴）：

HTML：

<canvas id="canvas1" width="600" height="600"></canvas>

JS：

var can = document.getElementById('canvas1');
var ctx = can.getContext('2d');
var ctx2 = can.getContext('2d');


ctx.fillStyle = 'yellow'; // background color. box in the middle is transparent. try changing this to see the effect
ctx.fillRect(40,0,250,300); // not sure if there's other way to fill in the tranparent area. but I created a box behind the image

var img = new Image();
img.onload = function() …