位置信息API

本文编辑: JeremyLu JeremyLu浏览 4202 版权所有,严禁转载

接口说明:

wx.createMapContext(mapId)

创建并返回 map 上下文 mapContext 对象,通过 mapId 跟一个 组件绑定,通过它可以操作对应的 组件。

方法 说明
getCenterLocation 获取当前地图中心的经纬度,返回的是 gcj02 坐标系,可以用于 wx.openLocation
moveToLocation 将地图中心移动到当前定位点,需要配合map组件的show-location使用

接口用法:


wxml

<view class="container">
  <map id="map" longitude="{{longitude}}" latitude="{{latitude}}" show-location scale="12" style="width: 100%; height: 300px;"></map>
  <button bindtap="getCenterPoint">获取地图中心点</button>

  <text>中心点经度:{{longitude}}</text>
  <text>中心点纬度:{{latitude}}</text>

  <button bindtap="setCenterPoint">移动到当前位置</button>
</view>

js

//index.js
//获取应用实例
var app = getApp()
Page({
  data: {
    latitude: 30.4919168,
    longitude: 114.3061654
  },
  onReady: function(e){
    //关联<map />组件
    this.mapCtx = wx.createMapContext('map')
  },
  //获取地图中心点
  getCenterPoint: function(e){
    var $this = this;
    this.mapCtx.getCenterLocation({
      success: function(res){
        $this.setData({
          latitude: res.latitude,
          longitude: res.longitude
        })
      }
    })
  },
  //将地图中心点移动到当前位置
  setCenterPoint: function(e){
     this.mapCtx.moveToLocation()
  }
})
如有技术问题或对本文有反馈,请加入QQ群:
微信小程序实战5营: 微信小程序Club实战5营