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

Question

我有一个看起来像一个SVG：

<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中看不到这个问题。

问题：

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

Answer 1

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

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