微信小程序3種位置API的使用方法詳解

<view class="container">
 <button bindtap='getLocation'>獲取位置</button>
 <view wx:if="{{latitude !=''}}">
  <view>緯度:{{latitude}}</view>
  <view>經(jīng)度:{{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
    })
   }
  })
 }
})

<view class="container">
 <button bindtap='getLocation'>打開地圖選擇位置</button>
 <view wx:if="{{address !=''}}">
  <view>位置名稱:{{name}}</view>
  <view>詳細地址:{{address}}</view>
  <view>緯度:{{latitude}}</view>
  <view>經(jīng)度:{{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
    })
   }
  })
 }
})