1

im ブラウザで SVG を操作しようとしています。そして次の問題があります!私はいくつかのsvg要素でjquery clone()を使用しています。それをウィンドウに追加します。次に、クローン要素を削除してみてください。

サンプルコード

 window.makeClone = function (){
     var cloneSVG = $('svg').clone();
     cloneSVG.appendTo('body');
 }
 window.removeClone = function (){
     $('svg:last').remove();
 }

そして、何か神秘的なことが起こりました。私はフィルターを使用します。そして2番目のクローンの後->メインのsvgを削除すると、フィルターが失われます。簡単な例があります: http://jsfiddle.net/4vK47/1/

これを修正する方法がわからない(

4

2 に答える 2

2

正確な原因はわかりませんが、おそらく問題の一部は、クローンの後に 2 つの #f1 があることです。<svg>複製しない単一のフィルターを定義し、複製されたものにそれを参照させる方がうまくいくかもしれません<svg>

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height=0px width=0px id="defs">
  <defs>
    <filter id="f1" x="0" y="0">
      <feGaussianBlur in="SourceGraphic" stdDeviation="15" />
    </filter>
  </defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height=100px width=100px id="rect">
  <rect width="90" height="90" stroke="green" stroke-width="3"
  fill="yellow" filter="url(#f1)" />
</svg>

この更新フィドルを参照してください。

于 2013-09-27T03:40:45.233 に答える