2

当页面被简单地加载(打开)时,我使用 SVGweb 没有问题。

如何重新初始化 SVGweb 以重绘页面上的所有 SVG?

换句话说,我需要 SVGweb 重新扫描和重新渲染页面上的所有内容。

来源(来自此):

<script type="image/svg+xml">
  <svg>
    ...
  </svg>
</script>

对此(就像 SVGweb si 在打开页面时那样做):

<svg>
...
</svg>

我需要这个,因为我使用 ajax 更改了 SVG 图形并且需要在页面上重新呈现它。

4

2 回答 2

2

我需要相同的功能,并想出了如何在不修改 svgweb 源或_onDOMContentLoaded()手动调用处理程序的情况下正确执行此操作。事实上,它是原生支持的。

诀窍是将您的 SVG 元素(重新)附加到 DOMwindow.svgweb.appendChild()上,这会导致节点由 svgweb 处理,如svgweb 手册中所述

例如,使用 jQuery:

// Iterate over all script elements whose type attribute has a value of "image/svg+xml".
jQuery('body').find('script[type="image/svg+xml"]').each(function () {
    // Wrap "this" (script DOM node) in a jQuery object.
    var $this = jQuery(this);
    // Now we use svgweb's appendChild method. The first argument is our new SVG element
    //  we create with jQuery from the inner text of the script element. The second
    //  argument is the parent node we are attaching to -- in this case we want to attach
    //  to the script element's parent, making it a sibling.
    window.svgweb.appendChild(jQuery($this.text())[0], $this.parent()[0]);
    // Now we can remove the script element from the DOM and destroy it.
    $this.remove();
});

为了使其正常工作,我建议使用专用 div 包装所有 SVG 脚本标签,以便在附加 SVG 元素时将其附加到不包含其他节点的父元素。这消除了在此过程中无意中重新排序节点的可能性。

于 2013-09-26T05:20:28.943 回答
0

使用新的 SVGweb 代码(通过 Ajax)更改 DOM 后

<script type="image/svg+xml">
  <svg>
    ...
  </svg>
</script>

需要执行这个:svgweb._onDOMContentLoaded();

但是之前需要在svg-uncompressed.js或者svg.js的核心源码中注释一行

svg-uncompressed.js 来自

    if (arguments.callee.done) {
      return;
    }

    if (arguments.callee.done) {
      //return;
    }

svg.js:找到并删除这个:

arguments.callee.done=true;

或替换为

arguments.callee.done=false;

编辑

另一个适用于 IE9 的修复:

对于 svg.js

var a=document.getElementById("__ie__svg__onload");if(a){a.parentNode.removeChild(a);a.onreadystatechange=null}

var IEv=parseFloat(navigator.appVersion.split("MSIE")[1]);if(IEv<9){var a=document.getElementById("__ie__svg__onload");if(a){a.parentNode.removeChild(a);a.onreadystatechange=null;a=null;}}

对于 svg-uncompressed.js

    // cleanup onDOMContentLoaded handler to prevent memory leaks on IE
    var listener = document.getElementById('__ie__svg__onload');
    if (listener) {
      listener.parentNode.removeChild(listener);
      listener.onreadystatechange = null;
      listener = null;
    }

    // cleanup onDOMContentLoaded handler to prevent memory leaks on IE
    var IEv=parseFloat(navigator.appVersion.split("MSIE")[1]);
    if (IEv<9) {
        var listener = document.getElementById('__ie__svg__onload');
        if (listener) {
          listener.parentNode.removeChild(listener);
          listener.onreadystatechange = null;
          listener = null;
        }
    }
于 2013-03-19T13:26:04.447 回答