web-dev-qa-db-ja.com

SVGファイルの変換を削除する

私はしばらくこれに苦労してきましたが、どこにも答えが(うまくいく)見つけられないようです。次のような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で)配置した場所に残したままにします。手動で変換を削除すると、イメージは画面の別の部分に圧縮されます(予想どおり)が、変換を完全に削除すると同時に、イメージを希望する場所に正確に保持する必要があります。変換をパス座標自体に削除/平坦化する方法はありますか? (対処しなければならない変換は、マトリックスではなく、変換とスケールのみです。)

133
Ephemera

Inkscapeでtransformsを削除する方法

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

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

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

    変換パネル内

  3. チェック解除相対移動およびチェック各オブジェクトに個別に適用

  4. 必要に応じてHorizo​​ntalおよびVertical値を設定し、適用
116
Serge Seletskyy

私は問題が何であるかを解決しました。私はロバートの答えに頼る必要がないことを望んでいましたが、うまくいくことを確認できて嬉しいです!結局、Duopixelの答えは実際には最も近いものでしたが、他の何かが起こっていたことが判明しました。

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

48
Ephemera

enter image description here

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

Apply Transformsという名前のインクスケープ拡張機能があります。これは、パスを変換で再計算します。これはまさに私が探していたものです。

インストール後、Extensions> Modify Path> Apply Transformの下にメニューがあります。


クレジット:Inkscapeフォーラム> インプレースのままですべての変換を削除

22
piotr_cz

グループの場合、再グループ化により仕事を迅速に行うことができます。グループを選択し、Ctrl + Shift + G(グループ解除)を押し、次にCtrl + G(グループ)を押します。

同様の問題を抱える一部のオブジェクト(例:らせんと星)の場合、簡単な方法はCtrl + Alt + C(パスへのストローク)を押すことです-ただし、これはオブジェクトを純粋なパスに変換し、余分な属性をすべて削除します。 sodipodi:cx、sodipodi:revolutionsなど。

21
UTF_or_Death

Inkscapeでsvgを開きます:

  • グループを選択削除したいすべての変換を含む
  • 押す CTRL + U (グループ解除)
  • 押す CTRL + G (再びグループ化)

この方法では、グループに適用された変換を取り除き、このグループ内に含まれるパスに転送されます。

14
rmartrenado

私の経験では、Inkscapeを使用している場合、パス要素をわずかに移動するだけで十分です(たとえば、カーソルキーで)、Inkscapeはトランスフォーム属性を削除し、それに応じてパスデータを調整します。 (実際に変換属性を保持したい場合は迷惑です。)

そのため、単純にパスを選択し(周囲のグループではなくパスであることを確認してください)、左右のカーソルキーを押すだけで完了です。

13
Thomas W

私はInkscapeを好みますが、 Affinity Designer (〜$ 40/Mac)を使用してAndroid Vector Drawablesを操作する時間を節約できました。

SVGを開き、ファイル->エクスポート-> SVG->その他->平坦化変換はうまく機能しました。

Affinity Designer

11
snodnipper

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

この場合の関連オプションは、moveGroupAttrsToElems(SVGOMG:Move group attrs to elements)からtransform属性をグループからパス要素に移動し、さらにconvertPathData(SVGOMG:Round/rewrite paths)です。 transformdにフラット化します。

10
Rob Hogan

設定に「最適化」モードがあることに注意してください。

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

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

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

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

8
Evgeni Sergeev

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

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

7
Kumar

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

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

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

5
Robert Longson

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

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

Sketch 3でこれを行うためのソリューションを探している人がここに着いた場合は、レイヤーを選択してから、[レイヤー]、[パス]、[フラット化]の順にクリックします。

4
Joel Worsham

それを見つけた:

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

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

3
Tobia

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

3
Emily L.

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

1
Skadi2k3

私の場合、グループは実際にはレイヤーが原因です。ドキュメント内のすべてのレイヤーを削除すると、グループとトランスフォームが削除されました(オブジェクトのグループ化を解除し、 SVGファイル内のトランスフォームの削除 (上記の@Charlieからのanswer-35490189)

1
Jamie Pate

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

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

1

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

0
Jim

私は長年この問題を抱えてきました。解決策は、もしそれがinkscapeで「修正」されないのであれば、ブラウザの変換で動的に遊ぶことができることは明らかです。

InkscapeフォーラムのユーザーMcは、私に この解決策 をくれました。

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

同じSVGファイルの2つの部分の間でブラウザ作業を行う場合、計算がどの要素に関連するかを簡単に変更することもできます。

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

0
Jay Day Zee

どういうわけか、私はどのアプローチにも運がなかった。 svgに<defs>セクションがあり、次のような使用法がある場合:

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

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

0
k102

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

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

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