获取当前位置附近的小吃店功能

获取当前位置附近的小吃店功能：

**
源码：https://blog.csdn.net/BOY017/article/details/105891141

1、注册腾讯地图服务：申请秘钥

https://lbs.qq.com/dev/console/key/manage

2、下载qqmap-wx-jssdk文件并引入

var QQMapWX = require('../../utils/qqmap-wx-jssdk.js');
var qqmapsdk;

3、添加合法域名：

“ https://apis.map.qq.com ”
微信服务平台设置：添加到request域名下

注意：手机真机测试时，报错：request:fail url not in domain list ( 请求:失败url不在域列表中).需要多刷新几遍项目配置的域名信息

4、实例：

data: {statusBarHeight: app.globalData.statusBarHeight,page: 1,pois: [],result: [],latitude: '',longitude: ''   }, onLoad: function () {qqmapsdk = new QQMapWX({key: '秘钥'})   }, onShow: function () {let vm = this;vm.getUserLocation();   },  //授权位置信息   getUserLocation: function () {let vm = this;wx.getSetting({success: (res) => {if (res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true) {wx.showModal({title: '请求授权当前位置',content: '需要获取您的地理位置，请确认授权',success: function (res) {if (res.cancel) {wx.showToast({title: '拒绝授权',icon: 'none',duration: 1000})// vm.BackTap2()} else if (res.confirm) {wx.openSetting({success: function (dataAu) {if (dataAu.authSetting["scope.userLocation"] == true) {wx.showToast({title: '授权成功',icon: 'success',duration: 1000})//再次授权，调用wx.getLocation的APIvm.getLocation();} else {wx.showToast({title: '授权失败',icon: 'none',duration: 1000})// vm.BackTap2()}}})}}})} else if (res.authSetting['scope.userLocation'] == undefined) {//调用wx.getLocation的APIvm.getLocation();}else {//调用wx.getLocation的APIvm.getLocation();}}})   },//微信获得经纬度
getLocation: function () {let vm = this;wx.getLocation({type: 'wgs84',success: function (res) {console.log('获得经纬度:',JSON.stringify(res))var latitude = res.latitudevar longitude = res.longitudevm.setData({latitude: latitude,longitude: longitude})vm.getLocal(latitude, longitude)},fail: function (res) {//  vm.BackTap2()}})   },//获取当前地理位置   getLocal: function (latitude, longitude) {let that = this;wx.showLoading({title: '加载中',duration: 3000})//获取当前位置信息qqmapsdk.reverseGeocoder({location: {latitude: latitude,longitude: longitude,},success:function (params) {console.log('params',params)that.setData({result:params.result})}}),//获取附近商家列表qqmapsdk.search({location: {latitude: latitude,longitude: longitude,},keyword:'小吃',page_size:10,page_index:that.data.page,header: {'content-type': 'application/json' // 默认值},success: function (res) {console.log('地理位置:',res);wx.hideLoading()let pois = res.datathat.setData({pois: that.data.pois.concat(pois),})},fail: function (res) {console.log(res);},complete: function (res) {// console.log(res);}});   },//点击进入地图  turn_map:function (e) {console.log('e',e)wx.openLocation({latitude: e.currentTarget.dataset.index.lat,longitude: e.currentTarget.dataset.index.lng,scale: 10,   //缩放比例，范围5~18name:e.currentTarget.dataset.name,address:e.currentTarget.dataset.address,})console.log('e',e)   },//下拉获取数据页数    onReachBottom:function(){let vm = this;vm.setData({page:vm.data.page+1})vm.getLocal(vm.data.latitude, vm.data.longitude)   }

获取当前位置附近的小吃店功能相关推荐

Adobe Edge Animate –获取鼠标位置及跟随鼠标功能实现
Adobe Edge Animate –获取鼠标位置及跟随鼠标功能实现版权声明: 本文版权属于北京联友天下科技发展有限公司. 转载的时候请注明版权和原文地址. 在网络上浏览有关Edge相关问题的时 ...
微信小程序获取当前位置及地图选点功能
标题小程序获取当前位置----逆地址解析----地图选点实现功能:小程序首页定位当前城市类似于某宝: 某团: 获取当前位置: 在小程序首页创建getLocation函数并在onLoad调用首先需 ...
百度地图API获取当前位置
异步加载获取当前位置 //百度地图API功能function loadJScript() {var script = document.createElement("script" ...
uniapp开发获取用户位置信息功能解析
uniapp开发获取用户位置信息功能解析问题描述 uniapp相关接口 1.uni.authorize 提前向用户发起授权请求. 接口描述及demo演示 2.uni.getLocation 获取当前 ...
android网络获取经纬,Android中透过GPS或NetWork获取当前位置的经纬度
Android中通过GPS或NetWork获取当前位置的经纬度 private double latitude=0.0; private double longitude =0.0; Location ...
地图篇-01.获取用户位置
地图篇-01.获取用户位置今天把地图整理了一下,共享出来和大家一起分享,希望帮助到不了解的朋友,当然很精通的朋友希望指正小生的不足. 1.说到地图,首先要接触一个framework -CoreLoc ...
微信小程序开发——小程序API获取用户位置及异常流处理完整示例
前言: 小程序需要添加一个定位功能,主要的就是获取用户位置的经纬度,然后根据用户经纬度进行一些判断操作. 在小程序提供的Api中,获取用户定位信息的主要Api是 wx.getLocation(obj) ...
html5获取当前坐标,HTML5教程如何获取当前位置的经纬度
本篇教程探讨了HTML5教程如何获取当前位置的经纬度,希望阅读本篇文章以后大家有所收获,帮助大家HTML5+CSS3从入门到精通 . < 是想让地图的定位用户位置更准确一些. 查看了介绍: h ...
vue 获取当前位置高德_vue高德地图获取当前位置
一:安装依赖 npm install vue-amap --save 二:main.js中的配置 import VueAMap from 'vue-amap'; Vue.use(VueAMap); V ...