svg - 多个 SVG 径向渐变

Question

如何将多个 SVG 径向渐变添加到 SVG 元素。我为此http://jsfiddle.net/4p9CK/创建的小提琴。

我尝试了以下选项，但没有成功。

 - <rect x="20" y="20" width="100" height="100" style="fill:
   url(#center_origin),url(#center_origin2); stroke: black;"/>

 - <rect x="20" y="20" width="100" height="100" style="fill:
   url(#center_origin, #center_origin2); stroke: black;"/>

Answer 1

不，SVG 不支持在一个元素上使用多个绘制服务器（“绘制服务器”是渐变、图案等）。您需要使用多个元素并通过使用不透明度或过滤器来模拟您想要的效果 - 或者通过几何分割您的形状。