小白的mapbox学习之路-显示地图

时间:2023-12-11 20:12:20

刚接触mapbox,只是简单记下自己的学习之路,如有错误,欢迎大神指正

1-头部引入链接

2-body中定义一个div块,用来显示地图

3-在script中创建一个map对象,并设置相关参数

mapboxgl.accessToken = 'pk.eyJ1IjoiYWx5c3NhLTE5OTciLCJhIjoiY2tiajRmNG96MGxxNjJxbWJ1MXBnZzIwbiJ9.SRp4xEaZP7rHmStuLyuugA';

var map = new mapboxgl.Map({

container: 'map',

style: 'mapbox://styles/mapbox/streets-v11', // stylesheet location

center: [116.20, 39.56], // starting position [lng, lat]

zoom: 9, // starting zoom

});

官网链接参考https://www.mapbox.cn/mapbox-gl-js/api/

`

Document


body{
margin: 0;
padding: 0;
}
#map{
position: absolute;
top: 0;
bottom: 0;
width: 100%;
}

`