小程序 map地图多点定位，导航

html

  <map id="myMap" latitude="{{latitude}}" 
  longitude="{{longitude}}" 
  markers="{{markers}}" 
  show-location 
  bindmarkertap="selectMarket"
  include-points="{{markers}}"></map>
复制代码

js

var app = getApp();
Page({
  data: {
    latitude: 22.15792,  // latitude	纬度
    longitude: 113.564344, // longitude	经度
    markers:
    [
  {
    id: 0,
    latitude: 22.15792,
    longitude: 113.564344,
    name: '酒店1',
    callout: {
      content: " 酒店1 \n 230元/晚",
      padding: 10,
      display: 'ALWAYS',
      textAlign: 'center',
      borderRadius: 10,
      borderWidth: 1,
    }
  },
  {
    id: 1,
    latitude: 22.164866,
    longitude: 113.570039,
    name: '酒店2',
    callout: {
      content: "酒店2",
      padding: 10,
      display: 'ALWAYS',
      textAlign: 'center',
      borderRadius: 10,
      borderWidth: 1,
    }
  },
  {
    id: 2,
    latitude: 22.162828,
    longitude: 113.567883,
    name: '酒店3',
    callout: {
      content: " 酒店3",
      padding: 10,
      display: 'ALWAYS',
      textAlign: 'center',
      borderRadius: 10,
      borderWidth: 1,
    }
  },
]
  },
  selectMarket: function (e) {
    console.log(e)
    var id = e.markerId
    console.log(id)
    wx.openLocation({
      latitude: this.data.markers[id].latitude,
      longitude: this.data.markers[id].longitude,
      name: this.data.markers[id].name,
    })
  },
  onLoad: function (options) {
    // 这里请求接口
  },
});
复制代码

最后

转载于:https://juejin.im/post/5b92369bf265da0a9e52ecb6