使い方
- ファイルを選択を押すか、画像を枠にドロップします。写真は端末の中で読み込まれます。
- 色の数を選びます。6から10色がほとんどの写真に合います。色を増やすと細部が増えますが、買う絵の具も増えます。
- 最も小さい領域を選び、下絵を作るを押します。大きな写真は1分ほどかかることがあります。
- パレットを読み、輪郭線をダウンロード(PNG)で印刷用の輪郭線を保存するか、色のプレビューを別のボタンで保存します。
下絵の作り方
各画素は、CIE L*a*b* 上のk平均法(k-meansクラスタリング)で、似た色の他の画素とまとめられます。この色空間では、距離が目で見た違いと一致します。開始のグループは、固定の乱数種を使う k-means++ の方法で選ばれるため、同じ写真は常に同じ下絵になります。
次に、小さな領域は、最も長い境界を共有する隣の領域に統合されます。そのため、下絵には塗るには小さすぎる点がありません。同じ色のつながった1つの領域が1つの領域です。色は使われる量が多い順に番号が付けられ、各領域はその色の番号を受け取ります。輪郭線は領域の縁に沿って描かれます。
色:選んだ色の数で、CIE L*a*b* のk平均法
小さな領域:最も長い共有境界を持つ隣の領域に統合
番号の位置:その領域のどの縁からも最も遠い画素
- 下絵は、長辺が最大800画素のコピーから作られます。輪郭線はその2倍の大きさで描かれるため、印刷してもきれいです。
- 各領域の番号は距離変換で置かれます。これは、各画素から最も近い縁までの距離を示すもので、番号はその距離が最も大きい場所に置かれます。
印刷と塗り方
輪郭線を印刷し、各領域を番号の絵の具で塗ります。1番は最も多く使われる色で、最も広い面積を覆います。次の色が隣に触れる前に、各色を乾かしてください。
番号を入れるには狭すぎる領域には、番号が付きません。より多くの領域に番号を付けるには、最も小さい領域を大きくするか、色を減らしてください。より多くの細部を残すには、細かい設定を選び、狭い領域が増えることを受け入れてください。
計算例:赤の半分と青の半分
20 × 10画素の画像で、左が赤、右が青、色の数は2なら、それぞれ100画素の2つの領域になります。輪郭線は中央を通る1本の線で、各行に1画素、合計10画素です。
各領域は、最も広い場所に番号が置かれます。赤の半分では、最も広い点は各縁から4画素の位置(4, 4)、青の半分では(14, 4)で、こちらも縁から4画素です。
| 項目 | 結果 |
|---|---|
| 領域 | 2 |
| 輪郭線の画素 | 10(各行に1つ) |
| 番号の位置 | (4, 4) と (14, 4) |
| パレット | #FF0000と #0000FF、それぞれ100画素 |
よくある質問
なぜ一部の領域に番号がないのですか?
番号より狭い領域には番号を入れられないため、下絵では番号なしのままになります。各領域が番号を入れられる幅になるように、最も小さい領域を大きくするか、色を減らしてください。
なぜ毎回結果が同じになるのですか?
色は固定の開始点からまとめられるため、同じ写真、色の数、最も小さい領域では、いつも同じ下絵とパレットになります。
色の数はいくつにすべきですか?
6から10色がほとんどの写真に合い、下絵も読みやすく保てます。子ども用の下絵なら少なく、細かい絵なら多くしてください。各色は買わなければならない絵の具であることを忘れないでください。
写真はアップロードされますか?
いいえ。写真はブラウザで読み込まれ、下絵は端末の中のワーカースクリプトで作られます。何も送信されず、1分を超えると処理は止まります。
最も小さい領域の設定とは何ですか?
写真に対する割合で、独立した領域として残す最も小さい面積です。より小さい領域は隣の領域に統合されるため、下絵は塗りやすくなります。
出典
- Wikipedia(英語): 距離変換(各画素から最も近い縁までの距離)
- Wikipedia(英語): k-means++(Arthur と Vassilvitskii、2007年、k平均法の慎重な初期化)
- Wikipedia(英語): CIELAB色空間(L*a*b*、色のまとめに使用)
数値と文章の最終確認日:2026年11月10日火曜日。