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

 更新时间:2019年08月05日 16:35:18   转载 作者:dq_095  
这篇文章主要介绍了微信小程序3种位置API的使用方法详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

获取位置

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

wx.getLocation(object)

<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

wx.chooseLocation(object)

<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
    })
   }
  })
 }
})

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

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

wx.openLocation(OBJECT)

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

相关文章

  • js实现图片旋转的三种方法

    js实现图片旋转的三种方法

    这篇文章主要介绍了js实现图片旋转的三种方法,需要的朋友可以参考下
    2014-04-04
  • JS 用6N±1法求素数 实例教程

    JS 用6N±1法求素数 实例教程

    显然,当N≥1时,6N,6N+2,6N+3,6N+4都不是素数,只有形如6N+1和6N+5的自然数有可能是素数。所以,除了2和3之外,所有的素数都可以表示成6N±1的形式(N为自然数)。
    2009-10-10
  • Google Suggest ;-) 基于js的动态下拉菜单

    Google Suggest ;-) 基于js的动态下拉菜单

    Google Suggest ;-) 基于js的动态下拉菜单...
    2006-10-10
  • 利用JS生成博文目录及CSS定制博客

    利用JS生成博文目录及CSS定制博客

    这篇文章主要介绍了利用JS生成博文目录及CSS定制博客的相关资料,需要的朋友可以参考下
    2016-02-02
  • react router4+redux实现路由权限控制的方法

    react router4+redux实现路由权限控制的方法

    本篇文章主要介绍了react router4+redux实现路由权限控制的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-05-05
  • JSON.stringify()方法讲解

    JSON.stringify()方法讲解

    今天小编就为大家分享一篇关于JSON.stringify()方法讲解,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧
    2019-01-01
  • js简单实现点击左右运动的方法

    js简单实现点击左右运动的方法

    这篇文章主要介绍了js简单实现点击左右运动的方法,实例分析了javascript实现左右运动的相关要点与技巧,非常具有实用价值,需要的朋友可以参考下
    2015-04-04
  • javascript数组的使用

    javascript数组的使用

    js Array 对象用于在单个的变量中存储多个值,这里简单的接受下,需要的朋友可以参考下
    2013-03-03
  • 200行HTML+JavaScript实现年会抽奖程序

    200行HTML+JavaScript实现年会抽奖程序

    这篇文章主要为大家详细介绍了HTML+JavaScript实现年会抽奖程序的200行代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-01-01
  • JavaScript观察者模式原理与用法实例详解

    JavaScript观察者模式原理与用法实例详解

    这篇文章主要介绍了JavaScript观察者模式原理与用法,结合实例形式详细分析了JavaScript观察者模式基本概念、原理、用法及操作注意事项,需要的朋友可以参考下
    2020-03-03

最新评论