比如页面里存在2个canvas的话,要如何使他们合成为1个canvas?
通过getImageData取两个canvas的imageData。iamgeData每4个步长代表一个像素点的数据,分别对应rgba中的四个值。
合并肯定需要一个策略,比如取每个点的rgba值得平均值,根据这个策略得到每个像素点如何计算得出合并后的像素点的数据。得到一个合并的iamgeData,
然后通过putImage方法弄到合并后的canvas中去。
也可以3个的啊
取出不同canvas生成base64,再进行合并 ,可以参考我的文章:http://cuihuan.net/?p=253
不确定你是想要达到什么效果。我的回答是针对如下我对问题的理解:两个canvas的图像按顺序绘制(合并)成新的图像。有点像大头贴,canvas1是头像,canvas2是前景,合并的过程就是先绘制头像,再绘制前景;效果就是一张大头贴。
我的解决方案是:
将canvas图像内容转成img
然后先后调用drawImage绘制img内容
效果参考我做的大头贴demo:http://jackgit.github.io/ImageEditor/app/demo.html