绿色背景图像已更改并替换为使用绿色的任何效果或其他图像 屏幕算法，也称为色键算法。简而言之，我们正在做的是 将前向图像中的所有绿色像素与其在后向图像中的匹配对应部分交换 背景图片。
此外，我们需要记住，输出图像的大小应与输出图像的大小相匹配 向前图像。在接下来的步骤中，将前向图像中的像素复制到新图像中 图像。使用背景图像的匹配像素，而不是复制绿色像素。
在应用以下内容之前，请不要错过将以下源文件包含到您的 HTML 代码中 代码 -
下面提供了实现该算法所需的 JavaScript 代码。要使用它，您必须创建 自己编写 HTML 代码。
HTML 源代码
您必须将此 HTML 代码添加到 HTML 文档的元素中。
Green Screen Algorithm Implementation using JavaScript with TutorialsPoint
First Image:
Background Image:
CSS源代码
接下来，HTML文档中的CSS代码
JavaScript 源代码
您必须在 HTML 文档的
示例
现在让我们检查以下代码中的完整代码和输出。
YDUI Touch专为移动端打造，在技术实现、交互设计上兼容主流移动设备，保证代码轻、性能高；使用 Flexbox 技术，灵活自如地对齐、收缩、扩展元素，轻松搞定移动页面布局；用 rem 实现强大的屏幕适配布局，等比例适配所有屏幕；自定义Javascript组件、Less文件、Less变量，定制一份属于自己的YDUI。
立即学习“Java免费学习笔记（深入）”；
Implement Green Screen Algorithm using JavaScript - TutorialsPoint Green Screen Algorithm Implementation using JavaScript with TutorialsPoint
First Image:
Background Image:
您将看到此输出屏幕，而无需添加任何图像。
接下来，添加“第一图像”和“背景图像”图像后，您将看到此输出屏幕。
现在您将看到单击“合并图像”按钮后的最终输出。两张图片都是 组合如下图所示。
两张图片作为该算法的输入。第一个是背景为的第一张图像 绿色，第二个是应该用来代替绿色的背景图像 背景。
JavaScript 在接收到两个图像作为输入后将这两个图像组合起来；因此，落后的 图像取代前向图像的绿色背景。为了贯彻落实绿色 筛选算法，上面提供了代码。
