小程序在获取当前位置信息在地图上显示

小程序在获取当前位置信息在地图上显示api:https://developers.weixin.qq.com/miniprogram/dev/api/wx.getLocation.html

主要方法:

wx.getLocation({
  type: 'wgs84',
  success(res) {
    const latitude = res.latitude
    const longitude = res.longitude
  }
})

这一步的时候,会出现在这样的提示:


5640239-9dbd114aa252d280.png

所以要进入app.json配置以下
参考API:
https://developers.weixin.qq.com/miniprogram/dev/framework/config.html#permission

配置授权信息的代码

{
  "pages": ["pages/index/index"],
  "permission": {
    "scope.userLocation": {
      "desc": "你的位置信息将用于小程序位置接口的效果展示"
    }
  }
}
5640239-93f497ae1d2b0555.png
图片.png
5640239-7215c0e11e15e40b.png
5640239-b4626ecaa77c6434.png

OK,具体代码也贴一下:

index.wxml

 <view bindtap="getLocation">获取当前位置信息</view>

index.js

var app = getApp()
Page({
  data: {  
  },
  onLoad: function (options) {
  },

  getLocation:function(){
    wx.getLocation({
      type: 'wgs84',
      success(res) {
        const latitude = res.latitude
        const longitude = res.longitude
        wx.openLocation({
          latitude:latitude,
          longitude:longitude,
        })
      }
    })
  },
})

**

原文作者:祈澈姑娘 技术博客:https://www.jianshu.com/u/05f416aefbe1
90后前端妹子,爱编程,爱运营,文艺与代码齐飞,魅力与智慧共存的程序媛一枚。
坚持总结工作中遇到的技术问题,坚持记录工作中所所思所见,对于博客上面有不会的问题,可以加入qq技术交流群聊:649040560。

猜你喜欢

转载自blog.csdn.net/qq_36538012/article/details/88373766