Geolonia Maps または Maplibre でアイコンを表示させるためにスプライトシートを作るテンプレート
Geolonia Maps の標準アイコンセットはこちらのテンプレートを利用しているので、使い方にご参照にしてください。 GitHub プレビュー
こちらのレポジトリをテンプレートとして、新しいレポジトリを作成してください。その後、
- スプライトシートに追加したいアイコンを
iconsディレクトリに追加 - GitHub Pages を GitHub Actions からデプロイするように設定する( Settings → Pages → Source を GitHub Actions に変更)
- この README を編集
_site/index.htmlの<title>h1タグ等を適切に編集します。
ローカルで編集する場合は、 npm install 後に npm run start をすると、ローカルのサーバーが起動され、GitHubにプッシュする前に確認できます。
うまく行けば、スプライトシートが https://<GitHub username>.github.io/<repository name>/sprite.png でホスティングされます。MapLibre対応の .png / .json / @2x.png / @2x.json の合計4ファイルが作成されます。MapLibreに複数スプライトシートを読み込ませる方法は、 公式ドキュメンテーション を参照にしてください。