什么是css过滤器色调旋转的“真实”算法?

时间:2015-09-17 10:00:00

标签: ruby svg webkit hue svg-filters

我目前正在尝试复制css过滤器“hue-rotate”,它在服务器上产生与跨越浏览器的svg feColorMatrix“hueRotate”相同的效果。我查看了规范,firefox实现和webkit实现。 我将每个算法移植到ruby,但结果仍然与我在浏览器中看到的结果不同。

我已经提出了一点jsfiddle来查看示例图片的差异。

<body>
<p>Original image:</p>
<div class="image"></div>
<p>Browser filtered image: (<- I need this generated on the server!</p>
<div class="image hue-90" ></div>
<p>Webkit/spec algorithm image:</p>
<div class="webkit-algorithm-result"></div>
</body>

这是转换图像的简单ruby-code

问题是:秘密成分是什么?为什么生成的图像仍然不同?

PS: 尽管firefox和webkit的算法略有不同,但结果却是一样的。 我尝试了图像magick和gimp,它们产生相同的结果,但又与浏览器结果不同,与上面假设的算法不同。 Phantomjs还有其他错误。

Firefox Implementation

Webkit Implementation

Spec

1 个答案:

答案 0 :(得分:2)

您是否需要以正确的顺序拥有参数?

  

def calculate_hue_webkit(r,b,g,angle)

...

  

result = calculate_hue_webkit(r,g,b,90)