画像しか無い地図を、Illustratorデータに再現！

弊社が運営している神楽坂タイレストランの案内地図です。お店のサイトに載せているこの1枚、元のIllustratorデータが手元にありません。作った当時のデータが行方不明という、よくある状態です。

手元にあるのは画像だけ。この状態だと、

• 拡大するとぼやけるので、チラシや看板には使えない
• 文字を打ち直せないので、周辺の店名がひとつ変わっただけで作り直し
• 線の太さも色も変えられないので、印刷用のCMYKで指定値を出せない

と、何をするにも詰みます。

まず画像トレースをかけてみた

Illustratorには「画像トレース」という機能が最初から入っています。追加費用はかかりません。まずこれを試すのが筋なので、同じ画像に「16色変換」でかけてみました。

見た目は悪くありません。ぼやけなくなったので、拡大にも耐えます。

ただ、開いてみると使えませんでした。

文字が0本です。 トレースでは文字がすべてアウトライン、つまりただの図形になります。「1a出口」を「2番出口」に直したくても、打ち直せません。フォントを変えることも、1文字足すこともできない。元画像のときと、この点は何も変わっていません。

線も線ではありません。 トレースすると線は「細長い塗り」になるので、太さを変えられません。破線は破線でなくなります。

色は64色に増えていました。 もとは5色で作られた地図です。アンチエイリアスでできた中間色をひとつずつ拾うので、色数が膨らみます。CMYKの指定値で刷りたいときに困ります。

アンカー（パスの点）は2,750個。 道路を1本ずらしたいだけでも、絡まった点の塊を相手にすることになります。線をつまんで動かす、が成立しません。

拡大には耐えるようになりました。でも「直せない」という肝心の問題は、解けていません。

そこで、画像からデータを起こした

弊社では、画像1枚から編集できるIllustratorデータを起こす仕組みを用意しています。やっていることは、輪郭をなぞる作業ではありません。どう作られたかを推定して、同じ部品で組み直す作業です。

1. 画像の色を分解して、もとが何色で塗られていたかを割り出す
2. 道路や枠を、線は線・面は面として形に当てはめる
3. 文字は書体を特定して、テキストとして置き直す
4. できたデータを画像に書き出し、元画像と1画素ずつ照合する
5. ずれたところを直して、また照合する

肝は4と5を繰り返すところです。目で見て「合ってるな」と思っても、機械で当てると0.5pxずれていたりします。人の目では気づけない差を、ここで潰していきます。

出てきたデータが、こうなります。

どこまで合っているか

左が元画像、中央が起こしたデータ、右が差分です。

色の一致は96.44%。 合っていない残りは、そのほとんどが文字の輪郭のアンチエイリアスでした。それを除いた実質的な差は22画素、全体の0.011%です。

差分画像で白く光っているのが文字の縁ばかりなのは、そういう理由です。形と色そのものは、ほぼずれていません。

「元データが無い」は、だいたい何とかなります

今回は自社の地図なので遠慮なく数字を出しましたが、同じことは印刷物全般に言えます。

• 制作会社が変わって、データを引き継げなかった
• 何年も前の販促物を、少しだけ直して刷り直したい
• 支給されたのが画像だけで、入稿データが作れない

こういうご相談は珍しくありません。多くの現場では「作り直さずに、その部分だけ画像で上から貼って逃げる」という手当てがとられます。その場はしのげますが、次の改訂でまた同じことをやる羽目になります。

編集できるデータそのものをお返しすれば、次からは自分で直せます。

いまお手元にあるものだけで結構です。PDFでも、写真でも、印刷物のスキャンでも。データを拝見して、できる／できない・どのくらいで済むかをお答えします。