mieki256's diary

Inkscape 1.4.3/1.4.4で以下のsvgを作成。

_girl1.svg (520KB, 元ラスター画像込み)
_girl1_plane.svg (108KB, ベクターデータのみ)

手作業で一本一本トレスした…。

元にしたラスター画像は Stable Diffusion web UI + SDXL (モデルデータ A-mix) で作成。モデルデータのライセンス的に出力画像の商用利用はできないだろうけど、今回は実験用画像としての利用だし、このくらいならええやろ、許してくれ、と…。

この svg を OpenToonz に読み込めるかテスト。「レベルを読み込み」で読み込む。もしくはエクスプローラー等からドラッグアンドドロップ。


一応、インポートできた。

vtracer で、ラスターからベクターに変換した svg を読み込ませたときは OpenToonz がフリーズしたけれど、人間がチマチマと手作業で線を引いて作った svg ならちゃんと読み込めるらしい。

しかし、サイズが小さい…。線の太さもおかしい…。おそらくだけど、OpenToonz は120dpiでアレコレを管理してるのに対して、Inkscape は96dpiで管理してるので、そのせいでサイズや線の太さがおかしくなるのかなと…。いや、それにしちゃサイズが違い過ぎる気もするけど…。

でもまあ、ベクターデータなので、拡大したり、線の太さを調整すれば、どうにかなりそうではある。

• 拡大は、ベクターレベル上で選択ツールを使って絵の全体を選択して、左上や右下の小さい四角を、Shiftキーを押しながらドラッグすれば縦横比そのままで拡大縮小できる。
• 線幅変更は、選択ツールで、モードを「同じスタイル」にして、線幅を変更したい線をクリック。その色を使ってる全ての線が選択されるので、選択ツールのオプション内の線幅入力欄に、指定したい線幅を入力すれば変更できる。
• 主線は線幅を 0.5 ぐらいに。色の塗り分け線は線幅を 0 に。線幅 0 の線は、レンダリング時に線として表示されない状態になる。

ここまで作業して、妙な点に気づいた。

一見上手くいったように見えたけれど、よく見てみると、それぞれの線がなんだかガクガクしているように思えてきた。

一部を拡大してみた。


これはおかしい。ベジェ曲線の接線ハンドルが直線になってない。これじゃあちこちガクガクしてるように見えて当然。


Inkscape上ではこうなってる。ちゃんと直線になってる。



まさか Inkscape がイイ感じに勝手に補正してくれているのでは？ 不安になったので、Affinity Studio 3.2.1 で svg を開いてみた。これも Inkscape と同じような接線ハンドルになっている。



ちなみに、LibreOffice Draw 26.2.3.2 でも該当svgを開いてみたけれど…。LibreOffice Draw 上でsvgの各曲線の接線ハンドルを表示させる方法が分からなかったものの、一応見た感じではちゃんと滑らかな曲線になっていた。ガクガクしてるように見えます？ 滑らかですよね？



つまり、OpenToonz だけがおかしい…。滑らかなベジェ曲線をガクガクした状態にしてインポートしてしまう…。こんなことをするのは OpenToonz だけ…。他のアプリはちゃんとsvgの見た目を再現できる…。

塗りはともかくとして、線画だけでも OpenToonz に svg をインポートして作業できたらいいのになと期待してたけれど、おそらく線画だけをインポートしてもこんな感じでガクガクしちゃうのではなかろうか。これではちょっと使えない…。

もっとも、レンダリングしてラスター画像化してしまえば、このくらいのガクガクぶりは視認しづらくなるので、実質的には問題ないやろ細かいことはキニスンナ大丈夫大丈夫と頑張って思い込むのもアリかもだけど…。

でも、どうしてこんなことになるのだろう。OpenToonzの内部では一体どういう処理をしているのか。svg内の接線ハンドルの方向を忠実に再現できない理由でもあるのか。他のアプリはできていることが、何故 OpenToonz ではできないのか。

※ 2026/05/18追記。OpenToonz から forkした Tahoma2D 1.6.1 でも試してみたけれど、同じようにガクガクしていた…。svg インポート処理はそのままらしい。

今回は Inkscape 上でどうにか頑張って塗り作業までやってみたけれど、そのためには影やハイライトの塗り分け線を閉曲線/閉じた図形にしなければいけないあたりがかなり面倒で…。

この塗り方では、塗りの部分が主線を隠してしまうから、主線が一定の線幅にならない…。せっかくそこに「主線」という「線」が存在しているのに、色の塗り分け線としては利用できないものだから、仕方なく主線の一部をトレスするように色の塗り分け線を引き直すのだけど、その塗り分け線はどうしたって主線と微妙にずれてしまうので、塗りが主線のあちこちを微妙に隠してしまう状態になってしまう。



Inkscapeだけで作業を終わらせても良いなら ―― svgだけで作業を完結して良いなら、一々閉曲線を作らなくてもいい。主線を引いた後、閉曲線になってない塗り分け線を引いて、Inkscapeのバケツツールで影にしたい部分をクリックすれば、その領域を塗り潰すような新規パスが自動で作成される。バケツツールがイイ感じに処理してくれる。



しかし、OpenToonz に持っていく svg を作ろうとするなら、そういうわけにはいかない…。

svg では線画だけを描いて、塗りは OpenToonz で行ってしまったほうがいいのかもと思ったけれど、その svg 線画すらガクガクした状態でインポートしてしまうのでは…。

「OpenToonzでsvgはインポートできない」
「できたように見えても実は形を再現できてない」
「線を引く段階からOpenToonz上でやったほうがいい…？」
「svgを利用してOpenToonzと他のアプリを連携するのは諦めたほうがヨサゲ」

そう思っておいたほうがいいのかもしれない。

そもそも、OpenToonz はラスター画像に色を塗ったりして使うソフトで、ベクターデータの扱いは妙な部分があるから避けるべし。と思っておくのもアリなのかも。ラスター画像に塗る分には今のところ問題なさそうな印象だし…。

こういうアレコレを考えると…。Adobe Flash (Adobe Animate)ってよく出来てるよなあ…。