svg

Unity

[Unity 2021]SVGを使用(Package Managerを使用しないでインストール)

やりたいことUnityでSVGを使用します。調べるとPackage Managerを使用してVector Graphicsをインストールすると出てきますが、私の環境（2021.3.4411 Personal）ではVector GraphicsがPackage Managerが表示されませんでした。この記事ではPackage Managerを使用せずにVector Graphicsをインストールする方法とCanvasで使用する方法を紹介します。インストールUnityのプロジェクト内のPackages/manifest.jsonを開きます。dependenciesのブロックに以下の行を追加します。...
2025.07.30
Unity
Inkscape

[bat]一括でinkscapeのSVGをプレーンにする

やりたいことinkscapeではSVGを作成できますが、inkscape専用のデータが含まれており通常のSVGよりもファイルサイズが大きいです。またファイルの絶対パスが含まれていてユーザ名などが含まれる場合もあります。作業中はinkscape用のSVGの方が便利なのですが、リリース時には削除したほうがいいです。この記事ではフォルダの中のSVGの中からinkscape専用データを削除するbatを紹介します。作業効率のために元のファイルを上書きするようにしています。必ずバックアップなどして元ファイルに戻せるようにしてください。バッチ以下の内容でsvg.batを作成して変換したいsvgが保存されてい...
2025.06.23
Inkscape
JavaScript

【有料】SVGをJavaScriptでインラインにする

やりたいことSVGファイルをJavaScriptで操作するにはSVGファイルをHTMLに埋め込む（インラインにする）必要があります。しかしSVGファイルを更新した際に毎回、HTMLを更新するのは手間であり、ミスを誘発します。ここではJavaScriptでSVGファイルを読み込み、HTMLに埋め込む方法を紹介します。具体例以下のHTMLファイルにSVGをインラインで埋め込みます。<!doctype html><html lang="en"><head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-wid...
2025.04.15
JavaScript
Synfig Studio

Synfig StudioでInkscapeのグループ情報を引き継ぐ

やりたいこと下の記事にあるようにInkscapeでsifファイルを保存して、Synfig Studioで開くとグループの情報が失われます。しかしグループの情報がないと必要なオブジェクトを探したり操作することが難しいです。そのためこの記事ではグループ情報をSynfig Studioに引き継ぐ方法を紹介します。レイヤーの保存結論から言ってしまうとグループではなくレイヤーにすることで、Synfig Studioでレイヤーはグループとして扱われます。グループからレイヤーに変換”レイヤーとオブジェクト”タブから変換するグループを右クリックします。表示されるメニューから”グループをレイヤーに”を選択します...
2024.11.19
Synfig Studio
Inkscape

Inkscapeで円が弧（扇形）になったときの対処

やりたいことInkscapeで円を描いた後に右側のハンドルをドラッグすると下のように円（楕円）が弧（扇形）になります。厄介なことに再度ドラッグして、元に戻そうとしても横線が残ってしまいます。さらに厄介なことに円（弧）を削除し、新しい円を書いても前回の同じ弧が描かれます。そのため弧で描かれたオブジェクトを円に戻す必要があります。完全な円にする円ツールを選択した状態で、円に戻したい弧を選択します。画面上部に以下のGUIが表示されるので右端の赤い丸アイコン（シェイプを弧や扇形でなく完全な円に）をクリックします。結果弧（扇形）を切れ目のない楕円に戻すことができました。気が付くと簡単なのですが、結構な時...
2024.11.18
Inkscape
Synfig Studio

Synfig StudioでSVGを読み込む

やりたいことInkscapeなどで作成したSVGをSynfig StudioでSVGを読み込みたい。なぜ必要なのか？Synfig Studioにはメニュー　ファイル　→　インポートからSVGファイルがインポートできます。しかし以下のようにSynfig Studioでは境界線（ほかにも曲線、Z orderなど）が正しく読み込めません。Inkscape上の表示Edge上の表示Synfig Studio上の表示この記事で紹介する方法で、見た目はInkscapeとSynfig Studioで近くなります。しかし以下の情報は復元できません。-　グラデーションまたグループ化の情報は失われます。グループ情報...
2024.07.15
Synfig Studio