web-dev-qa-db-ja.com

MapboxタイルとLeafletjs

マップにいくつかの追加のタイルレイヤーをロードしようとしていますが、わかりません。私が現在持っているものは、チュートリアルを提供したが、他のタイルオプションが何であるかを言わなかった誰かに感謝しています。誰かがこれで私を助けることができますか?

var mapboxUrl = 'https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}';
var accessToken = 'mySuperSecretToken';

var grayscale = L.tileLayer(mapboxUrl, {id: 'mapbox.light', attribution: '', maxZoom: 20, accessToken: accessToken}),
streets = L.tileLayer(mapboxUrl, {id: 'mapbox.streets', attribution: '', maxZoom: 20, accessToken: accessToken});

追加のレイヤーを取得する方法や、今日メールを受け取った新しいストリートバージョンを使用する方法を理解することはできません。

18
twg_

実際に答えを見つけました。

に更新する必要があるURL文字列

https://api.mapbox.com/styles/v1/mapbox/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}

利用可能なスタイル({id})は

  • streets-v9
  • satellite-streets-v9
  • light-v9
  • dark-v9
  • 屋外-v9
32
twg_

Mapboxの従来のマップIDの完全なリスト、つまりLeafletのリストは、 https://www.mapbox.com/api-documentation/#maps にあります。

執筆時点でのIDは次のとおりです

  • mapbox.streets
  • mapbox.light
  • mapbox.dark
  • mapbox.satellite
  • mapbox.streets-satellite
  • mapbox.wheatpaste
  • mapbox.streets-basic
  • mapbox.comic
  • mapbox.outdoors
  • mapbox.run-bike-hike
  • mapbox.pencil
  • mapbox.pirates
  • mapbox.emerald
  • mapbox.high-contrast
12

実際、Mapboxが参照していた新しいタイルレイヤーの「スタイル」は、ベクタータイルレイヤーでした

Mapbox-GL JSは、リストした(xxx-v9)ベクトル styles を使用します。 (2019年5月現在)

Mapbox JSは、リーフレット(L.tilelayer())および画像であるラスタータイルセットを使用します。 利用可能なベースマップはこちら Mapboxから。

3
CCantey