微信小程序API 之 位置API wx.getLocation(OBJECT)、wx.chooseLocation(OBJECT)、wx.openLocation(OBJECT)

获取位置

获取当前的地理位置、速度。当用户离开小程序后,此接口无法调用;当用户点击“显示在聊天顶部”时,此接口可继续调用。

微信小程序API 之 位置API wx.getLocation(OBJECT)、wx.chooseLocation(OBJECT)、wx.openLocation(OBJECT)_第1张图片微信小程序API 之 位置API wx.getLocation(OBJECT)、wx.chooseLocation(OBJECT)、wx.openLocation(OBJECT)_第2张图片

wx.getLocation(object)

微信小程序API 之 位置API wx.getLocation(OBJECT)、wx.chooseLocation(OBJECT)、wx.openLocation(OBJECT)_第3张图片
微信小程序API 之 位置API wx.getLocation(OBJECT)、wx.chooseLocation(OBJECT)、wx.openLocation(OBJECT)_第4张图片

<view class="container">
  <button bindtap='getLocation'>获取位置button>
  <view wx:if="{{latitude !=''}}">
    <view>纬度:{{latitude}}view>
    <view>经度:{{longitude}}view>
    <view>速度:{{speed}}view>
    <view>位置的精确度:{{accuracy}}view>
    <view>高度:{{altitude}}view>
    <view>垂直精度:{{accuracy}}view>
    <view>水平精度:{{accuracy}}view>
  view>
view>
//index.js
//获取应用实例
const app = getApp()

Page({
  data: {
    latitude: '',
    longitude: '',
    speed: '',
    accuracy: '',
    altitude:'',
    verticalAccuracy: '',
    horizontalAccuracy:''
  },

  onLoad: function () {

  },

  getLocation:function(){
    var _this=this;
    wx.getLocation({
      type: 'wgs84',
      success: function (res) {
        var latitude = res.latitude
        var longitude = res.longitude
        var speed = res.speed
        var accuracy = res.accuracy
        var altitude = res.altitude
        var verticalAccuracy = res.verticalAccuracy
        var horizontalAccuracy = res.horizontalAccuracy
        _this.setData({
          latitude: latitude,
          longitude: longitude,
          speed: speed,
          accuracy: accuracy,
          altitude: altitude,
          verticalAccuracy: verticalAccuracy,
          horizontalAccuracy: horizontalAccuracy
        })
      }
    })
  }
})

打开地图选择位置

wx.chooseLocation(OBJECT)

打开地图选择位置。
需要用户授权 scope.userLocation

微信小程序API 之 位置API wx.getLocation(OBJECT)、wx.chooseLocation(OBJECT)、wx.openLocation(OBJECT)_第5张图片微信小程序API 之 位置API wx.getLocation(OBJECT)、wx.chooseLocation(OBJECT)、wx.openLocation(OBJECT)_第6张图片
微信小程序API 之 位置API wx.getLocation(OBJECT)、wx.chooseLocation(OBJECT)、wx.openLocation(OBJECT)_第7张图片微信小程序API 之 位置API wx.getLocation(OBJECT)、wx.chooseLocation(OBJECT)、wx.openLocation(OBJECT)_第8张图片

wx.chooseLocation(object)

微信小程序API 之 位置API wx.getLocation(OBJECT)、wx.chooseLocation(OBJECT)、wx.openLocation(OBJECT)_第9张图片
微信小程序API 之 位置API wx.getLocation(OBJECT)、wx.chooseLocation(OBJECT)、wx.openLocation(OBJECT)_第10张图片

<view class="container">
  <button bindtap='getLocation'>打开地图选择位置button>
  <view wx:if="{{address !=''}}">
    <view>位置名称:{{name}}view>
    <view>详细地址:{{address}}view>
    <view>纬度:{{latitude}}view>
    <view>经度:{{longitude}}view>
  view>
view>
//index.js
//获取应用实例
const app = getApp()

Page({
  data: {
    name: '',
    address: '',
    latitude: '',
    longitude: ''
  },

  onLoad: function () {

  },

  getLocation:function(){
    var _this=this;
    wx.chooseLocation({
      success: function (res) {
        var name = res.name
        var address = res.address
        var latitude = res.latitude
        var longitude = res.longitude
        _this.setData({
          name: name,
          address: address,
          latitude: latitude,
          longitude: longitude
        })
      }
    })
  }
})

​使用微信内置地图查看位置

​使用微信内置地图查看位置。

微信小程序API 之 位置API wx.getLocation(OBJECT)、wx.chooseLocation(OBJECT)、wx.openLocation(OBJECT)_第11张图片微信小程序API 之 位置API wx.getLocation(OBJECT)、wx.chooseLocation(OBJECT)、wx.openLocation(OBJECT)_第12张图片

wx.openLocation(OBJECT)
微信小程序API 之 位置API wx.getLocation(OBJECT)、wx.chooseLocation(OBJECT)、wx.openLocation(OBJECT)_第13张图片

你可能感兴趣的:(微信小程序)