SVGファイルの変換の削除


155

私はしばらくこれに苦労しており、どこでも(うまくいく)答えを見つけることができないようです。次のようなSVGファイルがあります。

<svg

   xmlns:dc="http://purl.org/dc/elements/1.1/"
   ...
   width="72.9375"
   height="58.21875"
   ...>
   ...
   <g
     ...
     transform="translate(10.75,-308.96875)"
     style="...">
     <path
       inkscape:connector-curvature="0"
       d="m -10.254587,345.43597 c 0,-1.41732 0.17692,-2.85384 0.5312502,-3.5625 0.70866,-1.41733 2.14518,-2.82259 3.5625,-3.53125 1.41733,-0.70866 2.11392,-0.70867 3.53125,0 1.41732,0.70866 ... z"
       ... />
  </g>
</svg>

transform="..."行を削除したいのですが、(InkScapeで)配置した場所に画像が残っています。変換を手動で削除すると、画像は画面の別の部分に(予想どおり)圧縮されますが、変換を完全に削除すると同時に、画像を希望する場所に正確に留める必要があります。変換をパス座標自体に削除/平坦化する方法はありますか?(私が処理しなければならない唯一の変換は、行列ではなく、変換とスケーリングです。)



回答:


149

Inkscapeで変換を削除する方法

  1. Inkscapeでsvgファイルを開く
  2. [編集]-> [XMLエディター]に移動します
  3. レイヤーの「変換」属性を見つけて削除する

別の変換属性を作成せずにすべてのオブジェクトをまとめて移動する方法

  1. [編集]-> [すべてのレイヤーのすべてを選択]に移動します
  2. オブジェクトに移動->変換

    変形パネル

  3. 相対移動のチェックを外してチェック、各オブジェクトに個別に適用をします

  4. 必要に応じて水平値と垂直値を設定し、[ 適用 ]をクリックします

16
私のために働いた。パスの実際の座標が更新されるように、オブジェクトを変換する前にグループ化を解除する必要があります。
Rupert Angermeier、2015

8
それを0に設定して[適用]をクリックすると、XMLエディターに再び表示されます。
escapeccat 2015

7
これを機能させるには、オブジェクトのグループ化を解除する必要があります。ありがとうございます!
Hai Zhang

1
私のために働いていませんでした。変換属性を平坦化して葉に移動します(実際にはすべてがグループ解除後に葉になります)が、変換属性は削除されず、ジオメトリを適用してポイントジオメトリに適用されません。
SzczepanHołyszewski2017

2
重要:上記で説明したコメントのように、これを正しく機能させるには、オブジェクトをグループ解除する必要があります。そうしないと、変換属性が自動的に再び設定されます
シャドウ

52

私は何が問題なのかを考え出した。私はそれがうまくいくことを確認してうれしいが、ロバートの答えに頼る必要がないことを望んでいた!結局、Duopixelの答えは実際には最も近いものでしたが、別のことが起こっていたことがわかりました。

Inkscapeドキュメントでさまざまなパスを使用している場合、デフォルトの動作では、パスを<svg:g.../>タグでグループ化することになります。グループのパスを変更すると、Inkscapeは自動的にグループに変換を追加して、これらの変更を表します。ただし、XMLエディターを開いてパスを<svg:g.../>タグの外にドラッグし、独自の<svg:path.../>タグにすると、Inkscapeは自由に個々のポイントを編集できます。結局、私がたった1つのパスで作業していても、グループ化の問題であることが判明しました。これが同様の状況で他の人を助けることを願っています。


7
驚くばかり!ありがとうございました!それはまさにそれがやっていたことでした。内部のコンテンツを残してグループタグを削除し、保存して、inkscapeで再び開きました。もちろん画像はビューボックス(またはそれが何と呼ばれていても)の外側にありますが、x、yを設定するだけで修正されます。なんて痛みだ。これを共有してくれてありがとう!
johntrepreneur 2013

1
私の場合、私はこの回答のアプローチをその回答の別のアプローチと組み合わせました。
quaiyoke 2016年

これは賛成票を投じて最上位にする必要があります。これは問題をエレガントに解決し、私のために働きました。また、グラフィックがキャンバスの外に配置されていない場合でも、いつでもサイズを変更できます([編集]> [ページを選択範囲にサイズ変更])
マンダリン

48

ここに画像の説明を入力してください

  1. Method Draw http://editor.method.acに SVGをロードします([ファイル]> [イメージを開く])
  2. 要素のグループ化を解除する([オブジェクト]> [要素のグループ化解除])。これを複数回行う必要がある場合があります。
  3. パスを選択してください
  4. パスの方向を変更します([オブジェクト]> [パスの方向を変更])。
  5. 画像を保存します([ファイル]> [画像を保存])。新しいウィンドウに表示された場合は、右クリックして[名前を付けて画像を保存...]を選択できます。

1
オブジェクト>パスの方向変更はありません。どのバージョンを参照していますか?
0__ 2014年

1
@ 0__このメニュー項目が無効になっている場合は、パスがまだグループ内にあることを意味します。再度グループ解除します。
methodofaction 2014年

37

トランスフォーム適用してパスを再計算するApply Transformsと呼ばれるinkscape拡張機能があります。これはまさに私が探していたものです。

インストール後、メニューの[拡張機能 ] > [パスの変更 ] > [変換の適用 ]にあります。


クレジット:Inkscapeフォーラム> インプレースを維持しながらすべての変換を削除


この拡張機能は更新されており、少なくとも私のテストでは、rectsでも機能します。
sil

もちろんです。この小さなプラグインがもたらすパワーは計り知れません!
ブレット

23

グループの場合、再グループ化することで作業をすばやく実行できます。グループを選択し、Ctrl + Shift + G(グループ解除)を押してから、Ctrl + G(グループ)を押します。

スパイラルやスターなどの同様の問題があるオブジェクトの場合、簡単な方法はCtrl + Alt + C(パスにストローク)を押すことです。ただし、これによりオブジェクトが純粋なパスに変換され、すべての追加属性が削除されます。 sodipodi:cx、sodipodi:revolutionsなど。


23

Inkscapeで svgを開きます。

  • 取り除く必要のあるすべての変換を含むグループ選択します
  • CTRL+ U(グループ解除)を押します
  • CTRL+ G(もう一度グループ化)を押します

このようにして、グループに適用された変換を削除し、このグループに含まれているパスに転送されます。


1
パーフェクト!これはInkscape 1.0
Wizard of Ogz

14

私の経験では、Inkscapeを使用している場合、パス要素を少し(カーソルキーなどで)移動するだけで十分です。Inkscapeは変換属性を削除し、それに応じてパスデータを調整します。(もしあなたが実際に変換属性を保持したいのならうんざりします。)

したがって、パスを選択し(それがパスであり、周囲のグループではないことを確認して)、左右のカーソルキーを押すだけで完了です。


1
これは<g>要素では機能しないようです。変換属性を削除しようとしています。
Max Spring

5
最初にグループ化を解除し、後で再グループ化してみてください。
トーマスW

1
うわー、魅力のように働いた!これは受け入れられる答えになるはずです。追加のツールは必要なく、複雑なステップもありません。パスが変換にネストされていて、変換<g>をに保持したい場合、他の回答は機能しません<g>
tomekwi 2015年

サークルツールで作成されたパスでも機能しません
sdaau

1
最良の答え。たぶん混乱の原因の1つは、[設定]> [変換]> [変換の保存]オプションです。「最適化」に設定する必要があります。次に、グループ化解除、移動、再グループ化、および変換の変換が削除されます。
Mr5o1 2016年

13

私はInkscapeを好みますが、アフィニティデザイナー(〜40ドル/ Mac)は、Android Vector Drawableを扱う際の時間の節約になりました。

SVGを開き、[ファイル]-> [エクスポート]-> [SVG]-> [その他]-> [ 変換のフラット化]がうまく機能しました。

アフィニティデザイナー


12

SVGOは、このための優れたオープンソースのコマンドラインツールであり、他にも多数の最適化があります。同様に優れたオンラインWeb UIがあり、SVGOMGます。

この場合、関連するオプションがあるmoveGroupAttrsToElems:(SVGOMG Move group attrs to elements移動する)transformパス要素にグループから属性を、プラスconvertPathData(SVGOMG: Round/rewrite paths)平坦にするtransformd


1
SVGOはすごいです。これは本当に受け入れられる答えになるはずです。特に、stackoverflowはプログラマーの観点からのものであり、SVGを含むサイトを開発するプログラマーにとってこれは断然最良のソリューションです。これをデプロイメントパイプラインに置くことは、変換を手動で削除するようにアーティストに教える(または自分で行う)必要がなく、忘れるたびにバグレポートを取得するよりもはるかに優れています
UTF_or_Death

3
これ以外は機能しません。私はそれが一度うまく機能したことを覚えていますが、SVGOのこの正確な機能github.com/svg/svgo/issues/624についてこの問題を参照してください
morewry

9

設定には「最適化」モードがあることを言及する必要があります:

Inkscape設定>変換>ストア変換>最適化

これは、transform属性の出現を可能な限り最小限に抑えることになっています(ただし、そうではありません)。

とにかく、これはデフォルトでオンになっているようです。

議論によるとこの最適化モードが熱心に欠ける1つの例は、ページのサイズが変更されたときです。これによりtranslate、レイヤー<g>要素に変換が適用されます。現時点では、子供を別の層に避難させることが最善の解決策のようです。


2
translateすべてのレイヤーで迷惑な変換を作成せずにページのサイズを変更するに.svgは、テキストエディターでファイルを開いて、上部に表示される高さと幅の属性を操作してみてください。
februaryInk 2015年

7

Inkscapeには、変換データをクリアするオプションがありますが、オブジェクトの値は変更されません。

Inkscapeで、オブジェクトを選択し、[パス]メニューの[簡略化]をクリックします。これで、変換が削除されます。


16
ただし、パスの輪郭が変更され、複雑な形状の頂点の数が減ります。
チャーリー

1
これにより、変換前よりもマークアップが大きくなることがよくあります。
チャーリー

6

この場合、各子のm値に変換を追加するだけで、-10.254587 + 10.75 = -0.504587および-308.96875 + 345.43597 = 36.46722になります。

例のすべての用語は相対的(つまり、小文字)なので、これですべてです。MやCなどの絶対的なもの(大文字)がある場合は、それらも調整する必要があります。

スケールについては、基本的にすべての子の値にスケールを掛けます。


私はそうしましたが、Inkspace XMLエディター(または他のエディター)では、変換がまだ追加されています。変だ。
escapeccat

1
たとえば、M 8.0 12.0 C 11.3 13.1 14.9 13.55 16.0 13.0 C 2.4 9.8 2.8 10.2 8.0 12.0 C 7.6 7.8 7.6 8.1 5.0 9.0およびM 3.0 5.0 C 2.4 5.5 3.3 6.4 5.0 7.0あなたは一つの道に変身したいですか?
設定

@Antonは、既存の回答ではカバーされていない質問がある場合は、[ 質問する ]ボタンを使用します。利用できるフォーマットが非常に限られているため、コメントで質問したり答えたりするのは困難です。
Robert Longson

2
@RobertLongsonよくカバーしました。私が望んでいるのは、「MやCのように絶対的なもの(大文字)がある場合は、それらも調整する必要があるだろう」ということを詳しく説明してください。
セットアップ

6
  1. 問題の要素を選択してください
  2. オブジェクト>グループ解除(すべてがグループ解除されるまで繰り返します。ネストされたノードのXMLエディターを参照してください)
  3. パス>オブジェクトからパス(ポリゴンをパスに変換)
  4. オブジェクト>変形>相対移動のチェックを外す>適用

Inkscape 0.91では動作しないようです。それがあったと同じように属性滞在。また、私のオブジェクト(ここの質問に示されているものと同じ)は既にパスです。<g>transform
またはMapper

SVGへのリンクを貼り付けることはできますか?
チャーリー

5

gInkscapeの要素(グループ)から変換属性を削除するには、グループを最終的な場所に移動し、グループ化を解除してから、すべての要素を再グループ化します。これで新しいグループが作成されました。再度移動しないと、グループに変換属性がアタッチされません。


4

Sketch 3でこれを行うための解決策を探して誰かがここに着いた場合、レイヤーを選択してから、[レイヤー]-> [パス]-> [フラット]をクリックします。


3

それを見つけた:

  • ご希望のページサイズを設定してください*
  • 現在のレイヤーに変換がある場合(XMLエディターで確認してください。これはSVG要素の下の最上位グループです)、新しいレイヤーを作成し、すべてのオブジェクトをそのレイヤーに移動します
  • グループのグループ化を解除します(これは不要な場合があります、YMMV)。
  • Storeトランスフォーメーションを使用しているときにすべてのオブジェクトを選択し、nullトランスフォーム(100%100%のスケーリング、右矢印+左矢印など)を適用します。
  • グループを元に戻す必要があった場合は、グループを再グループ化できます
  • コピーを最適化されたSVGとして保存し、必要な数値精度を設定します

*:または、少なくともページの左上隅を基準にして、オブジェクトを必要な場所に配置します。SVG座標が左上隅を参照しているのは残念ですが、Inkscapeは左下を基準にページのサイズを変更します!


プッシュダウンしたい変換がレイヤーの<g>にあったため、「別のレイヤーに移動」するトリックが必要でした。Inkscapeの座標系は非常に迷惑です。
ミュータントボブ

3

matrix(...)パスを長方形と組み合わせ、長方形のノードを削除することで、(ミラーリングにより)変換を取り除くことができました。translate(...)一部はかかわらとどまりました。


これも私が見つけた唯一の解決策です。新しいクリーンパスと組み合わせて、不要な部分を削除します。
マートンタマシュ

2

私の場合、最適化されたSVGとして保存すると問題が解決しました。したがって、Inkscapeでは次のように使用します。

ファイル->名前を付けて保存...->最適化されたSVG。


ところであなたの問題は何でしたか?私はすべてを試してからここに来ました。しかし、問題はまだ解決しません。
Sahu V Kumar

@VishalKumarSahu transform属性がAndroid Studioでサポートされていないため、Androidアプリアイコン(SVG)をアセットとしてインポートできませんでした。
のMichałStochmal

うん、それはウェブでも同じです。変換は出力に問題を引き起こしますが、グループとしてオブジェクトを配置するときに非常に役立ちます。目的を解決するために計算をしなければなりません。
Sahu V Kumar

2

これは、Inkscapeを使用している場合に機能します。

  1. すべてを選択してグループを解除
  2. 「最適化されたSvg(* .svg)」として保存

私が試したすべてのケースで、これにより変換属性が削除されました。より複雑なSVGで機能するかどうかはわかりません。


1

ここに投稿された解決策を試しました。つまり、SVGファイルのグループタグを削除して、Inkscapeで再び開きます(私の場合は0.48.3.1)。残念ながら、選択および変換モード(F1)を使用してパスを再度変換して保存した後、グループタグが再表示されました。Inkscapeは、パスに適用されたすべての変換を周囲のグループ要素に保存します。パスノード選択ツール(F2)を使用しない限り、Ctrl + Aを押して、パスのノードを適切な場所に移動します。この変換をパスモデルに直接適用したため、代わりにこれを実行して保存した後、Inkscapeはグループタグを追加しませんでした。お役に立てれば。



0

私の特定の問題は、ページの外で定義されたシンボルに関連していたため、ページに変換を表示する必要がありました。

変換を必要とせずにシンボルをページに移動するには、Inkscapeで次の手順を実行する必要がありました。

  1. シンボルウィンドウを開きます(Shift + Ctrl + Y)
  2. ドキュメントライブラリからシンボルを削除します。(ウィンドウにはそのためのボタンがあります。)
  3. これで、グラフィックがドキュメントのページ境界の外側に表示されます。
  4. グラフィックをグループ解除します。(これは重要なステップです!)
  5. ページ境界内にグラフィックを移動します。
  6. グラフィックをシンボルライブラリに追加します。

0

これはランダムに見えますが、私が試みた他のことは何もしなかったので、ここでランダムに他の人に行きます。一部のパスには、パスの周りにマージンがあり、選択したときにしか見えません(例)。これは、別のinkscapeファイルからレイヤーを貼り付け、90度回転したときに作成されたと思います。これにより、形状にパターンの塗りつぶしが行われ、別の変換が行われます(線の間隔がさらに離れています)。また、alignオブジェクトが期待どおりに機能しなくなりました。@Piotr_czで言及されているApply Transformを使用すると、変換の問題が修正されましたが、奇妙なマージンが残っていました。ストロークのぼかしを任意の値に変更し、ゼロに戻すことで、誤ってそれを取り除きました。


0

どういうわけか、私はどのアプローチにも運がありませんでした。<defs>svgにセクションがあり、次のように使用されている場合:

<g transform="matrix( *** ) "><use xlink:href="#***"/></g>

すべての使用法を削除し、defsセクションからすべてを削除する必要がある場合があります。次に、inkscapeを使用してすべてを正しい方法で配置し、前述のプラグインを使用して変換を適用できます。それが誰かを助けることを願っています。


0

私は何年もこの問題を抱えてきました。解決策は、インクスケープで「修正」されない場合、ブラウザーで変換を動的に再生できることです。

InkscapeフォーラムのユーザーMcがこの解決策をくれた

ソリューションは、SVG要素とそのSVGルート要素の間の現在の変換を構築し、変換の合計に基づいてBBox情報の完全なセットを返します。

同じSVGファイルの2つの部分間でブラウザーの作業を行いたい場合は、計算の基準となる要素を簡単に変更することもできます。

最後に、実際にパンするSVGビューポートを設定できます。


0

Inkscape 1.0 on Kubuntu 20.04

このスレッドはかなり古いですが、私の経験/解決策を投稿したいと思います。FreeCADのTechDrawingワークベンチ用のテンプレートを作成しようとしたときに、この問題に遭遇しました。これらのテンプレートには変換を含めないでください。

私の場合、外部の.svgファイルから会社のロゴを追加する必要がありました(完全にInkscapeで作成)。そのロゴにはグラフィックとテキスト要素が含まれています。そのロゴをテンプレートにコピーすると、変換が作成され、テンプレートがFreeCADで正しく機能しなくなりました。

  • まず、www.freecadweb.org / ...で提案されているこのソリューションは、私には機能しません。それが私がウェブを検索してこの議論を見つけた理由です。

  • 第二に、上記で提案された解決策はどれも私にとってうまくいきませんでしたが、それらは私を正しい軌道に乗せました。チャーリーの答えは近づきましたが、オブジェクト>変形>相対移動のチェックを解除>適用は違いを示しませんでした。

私のために働いたのは:

  1. 他の人が述べたように、すべてをグループ解除します。
  2. テキストオブジェクトをパスに変換します。これは、私の場合は必須のようです。
  3. xml-Editorで既存の変換をすべて削除し、関連オブジェクトで何が起こるかを観察します。私の場合、対応する要素の位置が変わりました。
  4. これらの変更を手動で修正しますが、何もグループ化しないでください。
  5. 通常のsvgとして保存(通常=最適化やその他の特別な設定は使用されていません)

FreeCADでそのテンプレートを使用すると問題なく動作します。


奇妙な詳細の1つ:私の解決策は、テキスト要素が私の場合の問題であることを暗示していますが、それはそれほど簡単ではありません。実際、ベースドキュメント(ロゴをコピーしたドキュメント)には多くのテキスト要素が含まれており、それらのいずれも変換していません。したがって、「外部ソース」テキスト要素の組み合わせである可能性があります。この詳細は、関連する問題を抱えている可能性がある他の人へのヒントとして投稿するだけです。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.