0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

inkscapeでSVG画像にtransformが入っちゃう!の解決方法

Posted at

はじめまして。ゴリラドットと言います。

inkscape、めっちゃいいですよね。ぼくは主にSVG画像を作るときにinkscapeを使っています。ただ、画像をドラッグするとSVGの中身、XMLにtransformっていうのが勝手に入ってしまって、cssやHTMLにパス値を直に入れ込んだときにtransformの分だけズレて表示されてしまいます。

これは困った。

ということで今回はそんなinkscapeとSVG画像に関する解決方法を。

XMLエディターでドラッグ!

inkscapeにはXMLエディターなるものが標準でついています(編集→XMLエディター)。
このXMLエディターを使えば簡単にtransformついちゃう問題を解決できます。

image.png
↓これをこう!
image.png

こんな風にlayer1の上にドラッグするだけ。
これでXMLに自動追加されちゃうtransformがきれいさっぱり消えます。

というかlayerに対してtransformがついてる

というかinkscapeでは画像をドラッグしたタイミングでlayerが移動して、んでその移動量に応じてtransformが入っちゃうんです。layerに対して。

だからlayerの外に画像を出してあげればSVG画像を出力してもtransformがつかなくなるんです。

まとめ

inkscapeでSVG画像、HTMLの幅が広がってすっごいいい!ですよね。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?