Javascript 画布-背景图像，而不是色度图像下的透明背景 我需要用我自己的背景图像替换绿色背景（x，y定位）。

此时，我刚刚从with.js库中删除了绿色背景

#帆布{
边框：2倍实心#000；
}
让图像=新图像（）；
image.crossOrigin='匿名'；
image.src=https://s14.postimg.org/x9hmont5d/image.jpg';
让我们认真地=新的认真地（）；
让canvas=severy.target（“#canvas”）；
让色度=严重。效果（“色度”）；
色度源=严重源（图像）；
canvas.source=色度；
说真的，去吧；

查看SeriouslyJS库，可以使用blend插件添加背景图像。您需要在chroma脚本标记旁边包含以下内容：

<script src="https://cdn.jsdelivr.net/gh/brianchirls/Seriously.js@r2015-09-08/effects/seriously.blend.js"></script>

最后，替换“canvas.source”：

我希望我没有错过什么。您可以在代码段中签出并运行整个脚本：

let image=new image（）；
image.crossOrigin='匿名'；
image.src=https://s14.postimg.org/x9hmont5d/image.jpg';
设bgImage=newimage（）；
bgImage.crossOrigin='anonymous'；
bgImage.src=https://picsum.photos/800/600?random';
让我们认真地=新的认真地（）；
让canvas=severy.target（“#canvas”）；
让色度=严重。效果（“色度”）；
色度源=严重源（图像）；
让blend=严重。效果（“blend”）；
blend.top=色度；
blend.bottom=严重的.source（bgImage）；
canvas.source=混合；
说真的，去吧

#帆布{
边框：2倍实心#000；
}
不错！但我如何在底部或顶部定位图像？（x，y）填充物等。啊，我忘了。我现在解决了。首先，认真地包含
.layers.js
。然后用'let transform=severy.transform（'2d'）完成混合代码；transform.translateX=canvas.width/2；transform.translateY=canvas.height/4；transform.source=严重的.source（bgImage）；让layers=severy.effect（'layers'，{count:2}）；layers.source0=转换；layers.source1=色度；canvas.source=层；`Transform是内置的core，不需要包含在内。如果使用替代解决方案，只需在CSS规则#myBg中添加类似
left:400px；底部：-150px我无法通过CSS执行此操作，因为我需要将结果导出为JPEG。
<script src="https://cdn.jsdelivr.net/gh/brianchirls/Seriously.js@r2015-09-08/effects/seriously.blend.js"></script>

let bgImage = new Image();
bgImage.crossOrigin = 'anonymous';
bgImage.src = 'https://picsum.photos/800/600?random'; 

let blend = seriously.effect('blend');
blend.top = chroma;
blend.bottom = seriously.source(bgImage);  

canvas.source = blend;