1.创建标签
<div id="container"></div>
2.添加样式
html{height:100%}
body{height:100%;margin:0px;padding:0px}
#container{height:100%}
3.引入script
<script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&type=webgl&ak=你的百度密钥">
4.在script中创建百度地图实列及属性
var map = new BMapGL.Map("container");
// 创建地图实例
var point = new BMapGL.Point(116.404, 39.915);
// 创建点坐标
map.centerAndZoom(point, 15);
// 初始化地图,设置中心点坐标和地图级别
5.是否开启百度地图滚轮缩放
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
6.获取当前的位置及标记
var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function (r) {
if (this.getStatus() == BMAP_STATUS_SUCCESS) {
var mk = new BMap.Marker(r.point);
map.addOverlay(mk);
map.panTo(r.point);
console.log('您的位置:' + r.point.lng + ',' + r.point.lat);
}
else {
alert('failed' + this.getStatus());
}
});
点赞支持下谢谢🙂