MapBox加载不同风格

news2024/11/25 20:18:18

初始化MapBox地图：

	var map = new mapboxgl.Map({
          container: 'map',
          zoom: 3,
          center: [105, 34],
          
		  //此处更改地图风格
          style: 'mapbox://styles/mapbox/satellite-v9',
          hash: false,
      });

1.户外地图（mapbox://styles/mapbox/basic-v9）新版：（mapbox://styles/mapbox/outdoors-v12）支持三维地图
在这里插入图片描述

2.街道地图（mapbox://styles/mapbox/streets-v9）新版：（mapbox://styles/mapbox/streets-v12）支持三维地图
在这里插入图片描述
3.浅色地图（mapbox://styles/mapbox/light-v9）新版：（mapbox://styles/mapbox/light-v11）支持三维地图

4.深色地图（mapbox://styles/mapbox/dark-v9）新版：（mapbox://styles/mapbox/dark-v11）支持三维地图

5.鲜艳地图（mapbox://styles/mapbox/bright-v9）
在这里插入图片描述
6.影像地图（mapbox://styles/mapbox/satellite-v9）

7.导航地图+实时交通路况+白天（mapbox://styles/mapbox/navigation-preview-day-v2）

8.导航地图+实时交通路况+夜晚（mapbox://styles/mapbox/navigation-preview-night-v2）

9.导航地图+白天
（mapbox://styles/mapbox/navigation-guidance-day-v2）
在这里插入图片描述