WeChat Open Platform

Mini Programs Documentation

Map Component Control

wx.createMapContext(mapId)

Creates and returns map context mapContext objects

mapContext

mapContext uses a mapId to bind with a <map/> component, using it to operate the corresponding <map/> component.

mapContext object method list

Method Parameter Description
getCenterLocation OBJECT Gets the latitude and longitude of the current map center, returns gcj02 coordinate system that can be used for wx.openLocation
moveToLocation No Moves the map center to the current anchor point, needs to be used in conjunction with show-location in the map component

getCenterLocation OBJECT parameter list

Parameter Type Required Description
success Function No Callback function for successful interface call, res = { longitude: "longitude", latitude: "latitude"}
fail Function No Callback function for failed interface call
complete Function No Callback function for interface call results (will be executed if call succeeds or fails)

Sample code:

<!-- map.wxml -->
<map id="myMap" show-location />

<button type="primary" bindtap="getCenterLocation">Get location</button>
<button type="primary" bindtap="moveToLocation">Move location</button>
// map.js
Page({
  onReady: function (e) {
    // Use wx.createMapContext to get map context 
    this.mapCtx = wx.createMapContext('myMap')
  },
  getCenterLocation: function () {
    this.mapCtx.getCenterLocation({
      success: function(res){
        console.log(res.longitude)
        console.log(res.latitude)
      }
    })
  },
  moveToLocation: function () {
    this.mapCtx.moveToLocation()
  }
})