微信小程序如何实现地图多点标注

1.首先使用微信小程序自带<map>标签，并且设置好宽高让地图显示，用longitude和latitude表示中心点。

<map id="myMap" longitude="113.324520" latitude="23.099994" markers="{{markers}}" show-location></map>

Page({
  data: {
    markers: [
      {
        id: 1,
        latitude: 23.099994,
        longitude: 113.324520,
        title: 'Marker 1',
        iconPath: '/images/marker.png',
        width: 30,
        height: 30
      },
      {
        id: 2,
        latitude: 23.097330,
        longitude: 113.327420,
        title: 'Marker 2',
        iconPath: '/images/marker.png',
        width: 30,
        height: 30
      }
    ]
  }
});

 

定义一个 markers 数组，其中每个元素表示一个标记点，包含了标记点的经纬度、标题、图标路径以及图标的宽度和高度等信息。

通过将 markers 数组绑定到地图组件的 markers 属性上，即可在地图上显示对应的标记点。

需要注意的是，每个标记点对象中必须包含 id、latitude、longitude 这三个属性，分别表示标记点的唯一标识、纬度和经度。