rest/pages/map/map.js

// pages/map/map.js
//腾讯地图SDK
var QQMapWX = require('../../libs/qqmap-wx-jssdk')
Page({
  qqmapsdk: new QQMapWX ({
    key: '2Y2BZ-ABTA7-5UMXN-HCB7R-XZIWO-FGB3C'
  }),
  /**
   * 页面的初始数据
   */
  data: {
    mapw: '100%',  //地图宽度
    maph: '0',
    scale: '18',
    longitude: null,
    latitude: null,
    markers: null
  },
  markIndex: 0,
  mapCtx: null,

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function() {
    this.mapCtx = wx.createMapContext('map')
    //获取窗口的宽度和高度
    wx.getSystemInfo({
      success: res => {
        var mapw = res.windowWidth
        var maph = res.windowHeight
        this.setData({
          maph: maph + 'px',
          //设置控件显示
          controle: [{
            id: 1, 
            iconPath: '/images/banner.png',
            position: {left: 0, top: 10, width: mapw, height: 74},
            clickable: true
          },  {
            id: 2, 
            iconPath: '/images/gps.png',
            position: {left: 10, top: maph-50, width: 40, height: 40},
            clickable: true
          }, {
            id: 3,
            iconPath: '/images/gift.png',
            position: {left: mapw-60, top: maph-120, width: 40, height: 40},
            clickable: true
          }, {
            id: 4,
            iconPath: '/images/cost.png',
            position: {left: mapw-60, top: maph-60, width: 40, height: 40},
            clickable: true
          }]
        })
      }
    })
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */

   //获取当前位置（经纬度）
  onReady: function() {
    wx.getLocation({
      type: 'gcj02',
      success: res => {
        this.setData({
          longitude: res.longitude,
          latitude: res.latitude
        })
      }
    })
  },
  getFood: function(longitude, latitude) {
    //调用接口
    this.qqmapsdk.search({
      keyword: '餐厅',
      location: {
        longitude: longitude,
        latiude: latitude
      },
      success: res => {
        console.log(res.data)
        var mark = []
        //返回查找结果
        for (let i in res.data) {
          mark.push({
            iconPath: '/images/food.png',
            id: i,
            latitude: res.data[i].location.lat,
            longitude: res.data[i].location.lng
          })
        }
        mark.push({
          iconPath: '/images/center.png',
          id: res.data.length,
          latitude: latitude,
          longitude: longitude
        })
        //将搜索结果显示在地图上
        this.setData({
          markers: mark
        })
      }
    })
  },

  //单击控件，id=2返回中心位置，id=1跳转优惠券页面
bindControlTap: function(e) {
  var id = e.controlId
  if (id === 1) {
    wx.navigateTo({
      url: '/pages/coupon/coupon',
    })
  } else if (id === 2){
      //将地图中心移动到当前定位
      this.mapCtx.moveToLocation()
  }
},

//事业变化获取中心点坐标
bindRegionChange: function(e) {
  if (e.type === 'end') {
    this.mapCtx.getCenterLocation({
      success: res => {
        this.getFood(res.longitude, res.latitude)
      }
    })
  }
}
})