スプライト
スプライトとは、スタイルに含まれるすべてのアイコンを含む1つの画像のことです。たくさんの小さな画像を1つの画像(スプライト)にまとめることで、すべての画像を取得するのに必要なリクエストの数を減らすことができ、パフォーマンスが向上し、マップの読み込みが早くなります。
SVGアイコンをMapboxスタジオにアップロードすると、スタイルのスプライトに自動的に追加されます。同様に、すべてのMapboxテンプレートスタイルには、与えられたスタイルで使用できるアイコンで満たされた独自のスプライトが付属しています。
スプライトは多くのアイコンを1つの画像にまとめたものです。
すべてのスプライトには、アイコンのサイズやスプライト内の位置など、スプライト内の各アイコンを定義した無料のJSONファイルが用意されています。
"airport-15": {
"width": 42,
"height": 42,
"x": 76,
"y": 300,
"pixelRatio": 2,
"visible": true
}
つまり、スプライト内の特定のアイコンを airport-15
のような名前で参照すると、マップレンダラーはJSON ファイルを参照してアイコンに関するデータを取得し、大きなスプライト内の特定のアイコンのみを表示します。
スプライトは、MapboxスタイルAPI エンドポイントを使って、JSONドキュメントまたはPNGファイルとして取得できますが、スタイルのスプライト内の画像は、どのスタイルコンポーネントがアクティブであるかによって変わる可能性があるため、スプライト内の特定のアイコンやアイコン名に依存するような方法で構築しないことをおすすめします。
関連ページ(英語)