【问题标题】:Decimals in SVG filtersSVG 过滤器中的小数
【发布时间】:2019-02-06 12:05:50
【问题描述】:

我无法让 Chrome(和 Opera)使用半径为十进制值的 SVG 过滤器。

转到http://oreillymedia.github.io/svg-essentials-examples/ch11/fe_morphology.html 并尝试在半径字段中输入 0 或 0.5。在 Chrome 中没有变化,但在 Firefox 中,侵蚀有效。

我有一个带十进制逗号的语言环境,这会起作用吗?使用逗号,它会被解释为 x,y。

这是一个已知问题吗?有什么解决方法吗?

【问题讨论】:

    标签: svg svg-filters blink


    【解决方案1】:

    零不是radius 属性的有效值。引用规范:

    radius = "number-optional-number"

    操作的半径(或半径)。如果提供了两个数字,则第一个数字表示 x 半径,第二个值表示 y 半径。如果提供了一个数字,则该值用于 X 和 Y。这些值位于由“filter”元素上的属性“primitiveUnits”建立的坐标系中。 负值是错误(请参阅错误处理)。零值禁用给定过滤器基元的效果(即,结果是透明的黑色图像)。 如果未指定属性,则效果如同指定了值 0。

    半径值决定了用于处理图像的卷积矩阵的大小。根据定义,矩阵必须具有整数个列和行。但是,规范并不清楚分数应该向上还是向下舍入。

    似乎 Firefox 总是向上取整,而 Chrome/Webkit 总是向下取整。

    在任何情况下,小数值都是没有意义的,所以你应该总是使用整数。

    【讨论】:

    • 我同意,这似乎是一个四舍五入的问题。
    • 但是为什么要四舍五入呢?规范还说; <number> Real numbers are specified in one of two ways. 我在 SVG 上有一个 100x100 的视图框,宽度可以为 10000 像素。我已经尝试将primitiveUnits 设置为任何一个可能的值。
    • 它们需要四舍五入,因为这些值用于确定矩阵的大小。你不能有 0.3 个矩阵单元。 “数字”可以是整数或实数。它可以在规范中定义为整数,但未完成的原因之一是人们经常想要插入/动画属性。实数对此更有效。
    • 我明白了,这很糟糕。我不必担心它是用卷积矩阵实现的,特别是因为规范没有指定这一点。无论如何,谢谢您的回答。
    猜你喜欢
    • 2019-06-04
    • 2011-02-20
    • 2015-09-17
    • 2013-10-03
    • 2013-01-30
    • 2012-11-25
    • 2012-06-29
    • 2017-02-06
    • 1970-01-01
    相关资源
    最近更新 更多