Html 为什么svg不透明度会改变RGB值

我试图理解svg不透明度是如何应用的，这样我就可以添加透明度，然后删除它，并获得原始图像

我开发了以下测试用例，其中有256个单元的红色强度增加

原稿没有不透明度 然后，我使用脚本直接在每个svg单元上添加不透明度 然后，我使用一个过滤器通过移除alpha通道来移除不透明度

第三个图像应该与第一个图像相同。没有。当您查看第一个和第三个框时，在移除Alpha通道的图像中，明显存在分辨率损失

这发生在Chrome和Edge中，如下图所示

是否有可能在不改变原始图像的情况下，将任意Alpha通道添加到图像并通过过滤器移除

var svgns=”http://www.w3.org/2000/svg";
var svg=document.getElementById（“colormap”）；
var-cellSize=10；
var colCount=16
for（设r=0；r<256；r++）{
var cell=document.createElements（svgns，“rect”）；
变量x=（r%colCount）
变量y=数学特鲁克（r/colCount）
cell.setAttributeNS（null，“x”，x*cellSize）；
cell.setAttributeNS（空，“y”，y*单元格大小）；
cell.setAttributeNS（空，“宽度”，cellSize）；
cell.setAttributeNS（空，“高度”，cellSize）；
设Alpha=（r+1）/256
让hexColor=“#”+r.toString（16）.padStart（2，“0”）+“0000”；
cell.setAttributeNS（空，“填充不透明度”，Alpha）；
cell.setAttributeNS（空，“填充”，hexColor）；
appendChild（cell）；
}
var svg=document.getElementById（“colormapNoAlpha”）；
for（设r=0；r<256；r++）{
var cell=document.createElements（svgns，“rect”）；
变量x=（r%colCount）
变量y=数学特鲁克（r/colCount）
cell.setAttributeNS（null，“x”，x*cellSize）；
cell.setAttributeNS（空，“y”，y*单元格大小）；
cell.setAttributeNS（空，“宽度”，cellSize）；
cell.setAttributeNS（空，“高度”，cellSize）；
hexColor=“#”+r.toString（16）.padStart（2，“0”）+“0000”；
cell.setAttributeNS（空，“填充”，hexColor）；
cell.setAttributeNS（null，“填充不透明度”，1）；
appendChild（cell）；
}

阿尔法层
起初的
原始阿尔法
移除阿尔法
只有阿尔法

我可以确认您对Firefox/Linux的测试结果。这显然是由于sRGB和linearRGB颜色空间之间的转换而导致的舍入值问题。这发生在两个操作中：计算过滤器值，以及将颜色合成到其背景中。问题是，即使在玩了三个小时的

颜色插值

和

颜色插值过滤器

属性之后，我还没有找到发生这种情况的地方。。。