福野泰介の一日一創

もう少し日本列島っぽい表示方法として「世界を六角形で表したい - cucumber flesh」を発見。都道府県ページ内リンクで飛べる、HTML拡張タグ化しました。「ヘクス地図」という名前どうでしょう？

<script type="module" src="https://code4fukui.github.io/select-pref-hex/select-pref-hex.js"></script> <select-pref-hex></select-pref-hex> 2行加えるだけで、六角形表現された日本地図が右下に表示されます！

「select-pref-hex demo」 src on GitHub
六角形はSVGのポリゴンをsvgutil.jsと共に作成。位置は「世界を六角形で表したい - cucumber flesh」で紹介されていたコードをJavaScriptで加工して作成（making on GitHub）。

dummy-textコンポーネントを使った、都道府県別ダミーテキスト付きの表示で実験もできます。

links
- カラム地図