2012-04-12 12 views
4

私は、与えられたsvgグラフィックのすべての変換行列を適用する可能性のある高速な方法を探しています。換言すれば、アルゴリズムはすべての「変換」属性を除去し、グラフィックのすべての座標を絶対座標に変換するべきである。すべての変換行列を適用する

これを行うためのライブラリはありますか、それをサポートするSVGDomInterfaceメソッドはありますか?

EDIT ::

私はこのような統合メソッドを呼び出す場合:

$.each(svg.find('path'), function(i){ 
     this.transform.animVal.consolidate(); 
}); 

私はこのエラーを取得:

$.each(svg.find('path'), function(i){ 
     this.transform.baseVal.consolidate(); 
}); 

何も私はこのようにそれを呼び出す場合、起こりません

error

どのように私はそれを呼び出す必要がありますか、私は "統合"メソッドを使用する必要がありますか?

挨拶 フィリップ

+0

座標を削除する目的は何ですか? "ブラウザで"実行している場合は、SVGコンテナのviewBoxを移動しようとしているか、そうでなければSVGの2つの部分の相対位置/サイズを見つけようとしていると仮定します –

答えて

6

統合方法は、単一の行列に行列のリストを軽減します。 animValの例で得られるエラーは、アニメーション化された値を変更することができないためです(統合して破壊的に変換リストを変更します)。

あなたの質問に答えるために、パスなどの値を変更することによって変換を適用する既存の方法はありません。Inkscape(およびIllustratorでもIIRC)のような変換を適用するオプションがあります。

これを行うライブラリまたはユーティリティをお探しの場合は、SVG Cleanerをお試しください。

6

SVGクリーナーは私にはすべての変換を適用していないようですが、Inkscapeはそうしています。ここで私は1を適用する必要があるときに私が使用するコマンドラインです:あなたは「トランスフォーム - >店舗変換」を持っていると仮定すると、

inkscape copy-of-file.svg --select=id-of-node \ 
     --verb=EditCut --verb=EditPaste \ 
     --verb=FileSave --verb=FileClose 

(私はそれがデフォルトでオンになって信じる)のInkscapeの環境設定で「最適化」に設定し、この意志をそれを適用し、望ましい結果を生み出す。元のファイルに置き換えられるので、入力ファイルのコピーを操作してください!

あなたがMac上でこれを実行している場合は、あなたが最初にあなたのシェルでこれを実行することもできますが:

alias inkscape=/Applications/Inkscape.app/Contents/Resources/bin/inkscape 
6

ここで焼く(Raphaël.jsのに一部基づいて)いくつかのJavaScriptライブラリのコードでjsFiddleですすべてのパスのデータへの変換:

http://jsfiddle.net/ecmanaut/2Wez8/

(ただし、ここまでのオペラと何わからない、それはSVGにクラスで、通常は最高だ、私は他のブラウザでは詳細寛容ないくつかの方法でつまずくことができます。 。)

0

の代わりにEditPasteInPlace EditPasteを使用します。 編集ペーストマウスの位置にペーストします。これはノードの位置ではありません。

0

他の親のDOMノード(SVGルートコンテナなど)との相対パスを取得するには、ここでその手法を使用できます。

SVGツリー上の親ノードとあるノードの間の変換を計算するSVG.getTransformToElementを使用します。返されるオブジェクトには、変換などの逆を返すメソッドが含まれており、実際の処理を行います。

How to determine size of Raphael object after scaling & rotating it?

私はあなたが達成しようとしている正確に何を知らないが、これはそれを行うための力を持っています。

関連する問題