こんにちは、ベクトルタイルアドベントカレンダー2021 の2日目担当の大橋直記です。
普段は、株式会社 Geolonia でスタイルの開発を担当しています。また UNVT のメンバーとして Charites にコントリビュートもしています。
前回の @hfu さんの なぜ地図に関わり続けるのか の記事に引き続き書いていきます。
先日、あるプロジェクトをやっている時に 絵文字をスプライトに使えれば良いよねという話になりました。
なので、絵文字（Twemoji）を地図アイコン(Mapbox GL JS)として配信しているアイコン用のサーバーを作ってみました。
デモ
 |
|---|
デモURL
https://naogify.github.io/emoji-style/
レポジトリ
https://github.com/naogify/twemoji-sprites
使い方
以下 URL を style.json の sprite の値にセットしてください。
https://naogify.github.io/twemoji-sprites/icons
次に、style 内でアイコンを指定する場合は指定したい絵文字を icon-image に指定してください。
例
🚌 をアイコンとして使用する。
icon-image: 🚌
実際にスタイルとして実装しているレポジトリもあるのでご参考ください。
https://github.com/naogify/emoji-style
使用可能な絵文字一覧
使用可能な絵文字一覧はこちらをご参考ください。
顔文字や、人、記号系のアイコン及び、上記のURLを開き 豆腐文字になっている文字はご使用いただけません。ご了承ください。
Windows 環境では使用できる絵文字がかなり制限されてしまいます。（Macで指定した絵文字アイコンの閲覧は可能ですが、Windows で指定できる絵文字に制限があります）申し訳ありません。
不具合があれば Issue にてご報告頂けると助かります。
課題
- Windows環境ユーザーが使用可能な絵文字の種類が少ない。
絵文字を直接指定できるようにではなく CodePoint 例: 26f1 ⛱ 等も検討していたのですが、指定方法が直感的でないので、絵文字を直接指定する方法にしました。もし CodePoint 指定の方が良いなどフィードバックがあればお聞かせください。
感想
自画自賛でなんですが、icon-image: 🎁のように絵文字を直接指定できるの 便利すぎない ですか？(Macユーザーにとっては) GIS界隈の方だけでなく、Webの方にも普段使っている絵文字が地図のデザインに使えるようになったので、地図開発参入のハードルが下がったと思います。ぜひお試しください！
貢献
プルリクエストや Issue はいつでも歓迎です！
https://github.com/naogify/twemoji-sprites
おわりに
次は @T-ubu さんが「ArcGIS onlineで地理院地図Vector（仮称）のベクトルタイル（ArcGISサーバー以外から供給されているもの）を表示してみる」について書いてくれるそうです。楽しみです!