小程序map地圖點擊makert放大效果和點擊放大地圖

WXML文件和JS文件代碼在下方

<view class='map'>
  <map
  id="map"
  longitude="{{location.lng}}"
  latitude="{{location.lat}}"
  scale="{{scaleCount}}"
  markers="{{markers}}"
  bindmarkertap="markertap"
></map>
</view>

Page({

  /**
   * 頁面的初始數據
   */
  data: {
    scaleCount:12,
    markers: [],
    location: "",
  },

 markertap: function (e) { 
    var _this = this;
    var markerId = e.markerId;
   
    var model =  _this.data.mapData.filter( t=> t.pileMapId == markerId)[0];
    var markerIndex =  _this.data.markers.findIndex( t=> t.id == markerId);

    //這里本人設置了最大不能超過14的縮放
    if (_this.data.scaleCount >= 12 && _this.data.scaleCount < 14) {
      var location = {lat:model.latitude,lng:model.longitude};
      _this.setData({
        location:location
      }); //這里是設置點擊makert的坐標，定到這里去
      _this.setData({
        scaleCount:_this.data.scaleCount+1 //每次縮放+1 
      })
      return;//如果超過就return
    }
    //這里是設置點擊makert點擊圖片變大突出效果
    var markersWidth= `markers[${markerIndex}].width`;
    var markersHeight= `markers[${markerIndex}].height`;
    _this.setData({
      [markersWidth]: 38,
      [markersHeight]: 38
    })
 
    // wx.showToast({title: '正在獲取信息', icon: 'loading', duration: 10000});
    // wx.hideToast();
  },

})

 

這個是自己工作上的東西，做個記錄，希望可以幫助有需要的人