将 MapBox 底图更改为 Natural Earth II？

Question

抱歉，如果这是基本问题，我已经尝试找到答案...

显然要添加底图，我需要更改 "style"，如下所示：

style: 'mapbox://styles/mapbox/satellite-v9',

但是我该如何添加这个 mapbox 底图 (Natural Earth II)？ https://a.tiles.mapbox.com/v3/mapbox.natural-earth-2.html

...以及如何更改此处显示的少数底图之外的底图？ https://www.mapbox.com/mapbox-gl-js/example/setstyle/

Answer 1

您必须创建自己的源，因为 Mapbox 没有此图块集的 public 样式。

var map = new mapboxgl.Map({ 
  container: 'map', 
  style: 'mapbox://styles/mapbox/light-v9', 
  hash: true, 
  center: [-93.6135, 42.0256], 
  zoom: 15, 
  pitchWithRotate: false
});

map.on('load', () =>{
    map.addLayer({
      id: 'naturalearth',
      source: {
        type: 'raster',
        tiles: ['https://a.tiles.mapbox.com/v3/mapbox.natural-earth-2/{z}/{x}/{y}.png']
      },
      type: 'raster'
    })
})

将 MapBox 底图更改为 Natural Earth II？

Change MapBox Basemap to Natural Earth II?

mapbox

mapbox-gl

mapbox-gl-js