javascript - Firefox 中的 SVG clipPath 渲染错误

Question

首先，看图片：

前：

后：

Circle 是由动态包含的 SVG 制作的。

生成圆形SVG代码：

http://jsfiddle.net/n9nb7/

使用的库：

jQuery, svgweb

---

我所做的：

首先，在页面加载后，我使用 svgweb for IE8 动态创建了内联 SVG。

然后我用它的父 div conteinter 完全删除了它。

然后我重新创建了这个 SVG 代码，我得到了你在第二张图片上看到的内容。

为什么我需要这个：对于完全 AJAX 化的站点。

---

问题：

你在第二张照片上看到它。问题只存在于 Firefox 中。即使在 IE8 中它也可以正常工作。

事实上clipPath停止工作。

---

更新

实时代码http://vseslava.ru/?firefox=1。我的解决方案你可以在这里看到：http: //vseslava.ru/但我需要没有任何超时的解决方案。

Answer 1

只是为了澄清上述内容，我能够使用下划线的defer功能解决问题。

这是一个适用于 Firefox（至少 23 个）的 D3 片段：

var clippedRect = svg.append('rect');

_.defer(函数(){
    clippedRect.attr('clip-path', function(d,i){
        返回 "url(#clippingPath"+i+")";
    });
});