2021-09-23 最全的百度地图API使用基础JS

最全的百度地图使用基础

1.引入百度地图

<script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=你的密钥(在百度地图官网申请)"></script>

2.html(设置宽高)

<div id="container"></div>

3.创建地图

const BMapGL = window.BMap;
    var mp = new BMapGL.Map("container");
    mp.centerAndZoom(new BMapGL.Point(116.404, 39.915), 14); // 中心点经纬度
    mp.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
    // var scaleCtrl = new BMapGL.ScaleControl();  // 添加比例尺控件
    // mp.addControl(scaleCtrl);
    // var zoomCtrl = new BMapGL.ZoomControl();  // 添加比例尺控件
    // mp.addControl(zoomCtrl);

4.添加覆盖物

// 引入图片到页面
const unSelectIcon = require("../assets/person.png");
const selectIcon = require("../assets/photo.png");

var marker;
 var myIcon = new BMapGL.Icon(unSelectIcon, new BMapGL