织物js或图像去除图像中的白色
织物js或图像去除图像中的白色
提问于 2013-03-13 08:47:20
我遇到这种情况，我很难在谷歌上搜索并解释。
我们公司在铝上打印照片，我们给我们的客户两个选择。
- 第一种选择是把他们的照片印在铝上，就像他们给我们的一样，所以如果图片有白色背景，就会用白色背景打印出来。就像那样简单。
- 第二个选择是，我们可以不使用白色打印他们的图片。而不是所有的“白色值”(<-我能想出的最好的解释)正在印刷，我们保持它的透明度。
我知道在织物JS中有这个removeWhite过滤器，它可以用透明的区域代替白色的区域。但这不是我需要的。我需要一个Fabric过滤器，ImageMagick的东西或任何其他的PHP或JS解决方案，可以使像素的“白色值”透明。我知道对你们来说这东西听起来很模糊，但让我来解释一下：
- 如果我遇到一个白色像素，我需要使它透明。
- 如果我遇到一个灰色像素，我需要把它从白色和黑色的组合变成透明和黑色的组合。
- 如果我穿过一个彩色像素，我也需要把“白色值”，使它的光变成透明。
下面是我试图实现的过滤器/效果的前后示例：
在此之前：
之后：
如果你不明白我要什么，请不要犹豫。
回答 2
Stack Overflow用户
回答已采纳
发布于 2013-05-21 09:21:52
我让它开始工作了。通过使用来自YUV颜色空间的因素，我可以创建一个Fabric JS图像过滤器。
为了得到我想要的结果，我做了大量的尝试。因此，我没有(详细的)描述这是如何工作的。据我所知，我已经使用YUV的因素，以获得亮度的(RGB)颜色。
for (i = 0; i < iLen; i++) {
for (j = 0; j < jLen; j++) {
index = (i * 4) * jLen + (j * 4);
var yuv = {};
yuv.r = data[index] / 255 * 1 * 0.299;
yuv.g = data[index + 1] / 255 * 1 * 0.587; //we use the yuv formula constants
yuv.b = data[index + 2] / 255 * 1 * 0.114; //to try to catch the Y (brightness)
yuv.y = yuv.r + yuv.g + yuv.b; //you can tweak this
data[index + 3] = 350 - (yuv.y / 1 * 255); //by changing the first number after the "=" on this line!
}
}通过在最后一行中修改350，您可以改变透明度系数。
很抱歉不能解释更多关于这种织物过滤器的工作原理。
Stack Overflow用户
发布于 2016-08-11 22:12:38
因此，在Fabric.js中有一个过滤器，它就是这样做的。
http://fabricjs.com/docs/fabric.Image.filters.RemoveWhite.html
var filter = new fabric.Image.filters.RemoveWhite({
threshold: 40,
distance: 140
});
image.filters.push(filter);
image.applyFilters(canvas.renderAll.bind(canvas));页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15380547
复制相关文章
相似问题
腾讯云开发者
