由于没有后台数据就随机生成点来模拟了。具体代码如下。
componentDidMount = () => { const { BMap, BMAP_STATUS_SUCCESS } = window let map = new BMap.Map("container") let poi let geolocation = new BMap.Geolocation() geolocation.getCurrentPosition(function (r) { if (this.getStatus() == BMAP_STATUS_SUCCESS) { poi = new BMap.Point(r.longitude, r.latitude) map.centerAndZoom(poi, 15) function addMarker(point, index) { let myIcon = new BMap.Icon(businessl, new BMap.Size(20, 20), { anchor: new BMap.Size(0, 0), imageOffset: new BMap.Size(0, 0 + index - index), imageSize: new BMap.Size(20, 20), infoWindowAnchor: new BMap.Size(0, 0) }) let marker = new BMap.Marker(point, { icon: myIcon }) map.addOverlay(marker) marker.addEventListener("click", function () { let opts = { width: 200, height: 100, title: String(index) } let infoWindow = new BMap.InfoWindow(String(index), opts) marker.openInfoWindow(infoWindow) }) } let bounds = map.getBounds() console.log(bounds) let lngSpan = bounds.He - bounds.Le let latSpan = bounds.Vd - bounds.Xd for (let i = 0; i < 10; i++) { let point = new BMap.Point(bounds.Le + lngSpan * (Math.random() * 0.7 + 0.15), bounds.Xd + latSpan * (Math.random() * 0.7 + 0.15)) addMarker(point, i) } } }) };