附近 elong ati ces chan 根據 add title open

最近在做小程序的時候有一個類似共享單車顯示附近單車的需求。查了查微信api發現api裏多點定位描述的不清晰，試了試也不可以。靜下心踩了幾個坑後寫了幾個方法。分享一下??
附上代碼

html結構：

<map id="map"  scale="{{scale}}" bindcontroltap="controltap" markers="{{markers}}" bindmarkertap="markertap" 
latitude="{{latitude}}"
longitude ="{{longitude}}"
controls="{{controls}}" show-location bindregionchange="regionchange" style="width: 100%; height: {{view.Height}}px;"></map>

javascript：

var app = getApp();
Page({ data: { url:‘‘, listData: [ { "id": 1, "placeName": "中關村廣場", "placeImageUrl": "", "placeOpenTime": 1505854800, "placeCloseTime": 1505919600, "placeAddress": "北京市海澱區中關廣場", "placeLongitude": "116.303900", "placeLatitude": "39.976460" }, { "id": 2, "placeName": "虎丘的廣場", "placeImageUrl": "", "placeOpenTime": 1506286800, "placeCloseTime": 1506258000, "placeAddress": "江蘇省蘇州虎丘", "placeLongitude": "120.410770", "placeLatitude": "31.325370" }, ], scale:‘15‘, //縮放 Height:‘0‘, controls:‘40‘,//中心點 latitude:‘‘, longitude:‘‘, markers: [], }, onReady: function (e) { // 使用 wx.createMapContext 獲取 map 上下文 this.mapCtx = wx.createMapContext(‘myMap‘) }, onLoad: function () { var that = this;
that.setData({ url: app.globalData.url// 顯示圖片url }) wx.getLocation({ type: ‘wgs84‘, //返回可以用於wx.openLocation的經緯度 success: (res) => { that.setData({ markers: that.getSchoolMarkers(), scale: 12, longitude: res.longitude, latitude: res.latitude }) } }); wx.getSystemInfo({ success: function (res) { //設置map高度，根據當前設備寬高滿屏顯示 that.setData({ view: { Height: res.windowHeight },
}) } }) }, controltap(e) { this.moveToLocation() }, getSchoolMarkers() { var market = []; for (let item of this.data.listData) {
let marker1 = this.createMarker(item);
market.push(marker1) } return market; }, moveToLocation: function () { this.mapCtx.moveToLocation() }, strSub:function(a){ var str = a.split(".")[1]; str = str.substring(0, str.length - 1) return a.split(".")[0] + ‘.‘ + str; }, createMarker(point) { let latitude = this.strSub(point.placeLatitude); let longitude = point.placeLongitude; let marker = { iconPath: "../../image/banner5.jpeg", id: point.id || 0, name: point.placeName || ‘‘, title: point.placeName || ‘‘, latitude: latitude, longitude: longitude, label:{ x:-24, y:-26, content: point.placeName }, width: 30, height: 30 }; return marker; } })

小程序map多點定位顯示