SVG clipPath与使用Safari中打破时更新链接形状

我有一个看起来像一个SVG：SVG clipPath与使用Safari中打破时更新链接形状

<svg ...> 
    <rect id="clipShape" width="500" height="500"></rect> 

    <g id="content" clip-path="url(#clip)"> 
    <!-- some content --> 
    </g> 

    <clipPath id="clip"> 
    <use xlink:href="#clipShape"></use> 
    </clipPath> 
</svg>

我需要作出调整#clipSource，例如在SVG的生命周期中更改width和height。然而，例如：

d3.select('#clipShape').attr({ height: "200", width: "200" });

将在Safari中打断剪辑。 #content将被完全隐藏，好像clipPath无效。我可以通过在xlink命名空间下设置usehref来强制执行类似的行为。

我在this fiddle中发现了这个问题。我在Chrome，FF，Opera或IE11中看不到这个问题。

问题：

我被粗鲁修改链接形状？
如果couth，这是Safari/WebKit中的一个已知错误吗？
有关解决方法的任何想法？

来源

2015-02-17 joe

您的jsFiddle在我的Mac上正常工作，在Safari 6.1.6（7537.78.2） – meetamit 2015-02-17 21:44:01

谢谢！我在Safari 8.0.3（10600.3.18）上的MBP上失败了， – joe 2015-02-17 21:51:47

据我所知，这是WebKit中的一个错误，小提琴在最近的夜晚（r180500）失败。我有reported the bug。

要解决该问题，我将#clipShape克隆到clipPath - 在需要更改#clipShape的任何属性时根据需要重复此操作。

来源

2015-02-23 23:19:33 joe

SVG clipPath与使用Safari中打破时更新链接形状

回答

相关问题