2

ページが単純に読み込まれる (開かれる) 場合は、SVGweb を使用しても問題ありません。

ページ上のすべての SVG を再描画するために SVGweb を再初期化するにはどうすればよいですか?

別の言い方をすれば、ページ上のすべてを再スキャンして再レンダリングするには、SVGweb が必要です。

ソース（から）：

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

これに（SVGweb siが単にページを開いたときにそれを行うように）：

<svg>
...
</svg>

ajax を使用して SVG グラフィックを変更し、ページ上で再レンダリングする必要があるため、これが必要です。

4

2 に答える 2

2

私は同じ機能を必要とし、svgweb ソースを変更したり_onDOMContentLoaded()ハンドラーを手動で呼び出したりせずにこれを適切に行う方法を見つけました。実際、ネイティブでサポートされています。

トリックは、SVG 要素を DOM に (再) 接続することです。これにより、svgweb マニュアルに記載window.svgweb.appendChild()されているように、ノードが 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();
});

これが適切に機能するためには、すべての SVG スクリプト タグを専用の div でラップすることをお勧めします。これにより、SVG 要素をアタッチするときに、他のノードを含まない親要素にアタッチされます。これにより、プロセス中にノードを誤って並べ替える可能性がなくなります。

于 2013-09-26T05:20:28.943 に答える
0

DOM が新しい SVGweb コード (Ajax 経由) で変更された後

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

これを実行する必要があります: svgweb._onDOMContentLoaded();

ただし、SVGweb 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 で動作するもう 1 つの修正:

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 に答える