微信小程序3种位置API的使用方法详解

获取位置

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

微信小程序3种位置API的使用方法详解_第1张图片

微信小程序3种位置API的使用方法详解_第2张图片

wx.getLocation(object)

微信小程序3种位置API的使用方法详解_第3张图片

微信小程序3种位置API的使用方法详解_第4张图片


 
 
  纬度:{{latitude}}
  经度:{{longitude}}
  速度:{{speed}}
  位置的精确度:{{accuracy}}
  高度:{{altitude}}
  垂直精度:{{accuracy}}
  水平精度:{{accuracy}}
 
//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

微信小程序3种位置API的使用方法详解_第5张图片

微信小程序3种位置API的使用方法详解_第6张图片

微信小程序3种位置API的使用方法详解_第7张图片

微信小程序3种位置API的使用方法详解_第8张图片

wx.chooseLocation(object)

微信小程序3种位置API的使用方法详解_第9张图片

微信小程序3种位置API的使用方法详解_第10张图片


 
 
  位置名称:{{name}}
  详细地址:{{address}}
  纬度:{{latitude}}
  经度:{{longitude}}
 
//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
    })
   }
  })
 }
})

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

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

微信小程序3种位置API的使用方法详解_第11张图片

微信小程序3种位置API的使用方法详解_第12张图片

wx.openLocation(OBJECT)

微信小程序3种位置API的使用方法详解_第13张图片

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

你可能感兴趣的:(微信小程序3种位置API的使用方法详解)