在小程序中使用腾讯地图定位 - 文章教程

在小程序中使用腾讯地图定位

发布于 2018-02-28 字数 1972 浏览 3834 评论 0

小程序提供了获取用户地理位置的能力,只不过需要用户授权,一般用户都会同意的,但是获取到的只是经纬度,我们还需要调用其他的地图 API 把经纬度转换为地名,这篇文章给大家介绍在小程序中使用腾讯地图定位。

在小程序中使用腾讯地图定位

腾讯地图针对小程序开发了一个 SDK ,地址:http://lbs.qq.com/qqmap_wx_jssdk/index.html

腾讯位置服务为微信小程序提供了基础的标点能力、线和圆的绘制接口等地图组件和位置展示、地图选点等地图API位置服务能力支持,使得开发者可以自由地实现自己的微信小程序产品。

在此基础上,腾讯位置服务微信小程序JavaScript SDK是专为小程序开发者提供的LBS数据服务工具包,可以在小程序中调用腾讯位置服务的POI检索、关键词输入提示、地址解析、逆地址解析、行政区划和距离计算等数据服务,让您的小程序更强大!

使用方法

引入相关的 JS 文件

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

在页面加载完成的时候,获取用户的经纬度

var athis = this;
var userLocation = wx.getStorageSync('userLocation');
if (userLocation){
 wx.getLocation({
 success: function (res) {
 wx.setStorageSync('userLocation', res);
 }
 })
}

调用 SDK 将经纬度转换为具体的地名

qqmapsdk = new QQMapWX({
 key: 'ZISBZ-EL236-LZQSW-M3ZYR-YBMXV-3CFZP'
});
var userLocation = wx.getStorageSync('userLocation');
qqmapsdk.reverseGeocoder({
 location: {
 latitude: userLocation.latitude,
 longitude: userLocation.longitude
 },
 success: function (res) {
 console.log(res.result.address_component.street);
 athis.setData({
 userLocationVal: res.result.address_component.street
 })
 },
 fail: function (res) {
 console.log(res);
 },
 complete: function (res) {
 //console.log(res);
 }
});

如果你对这篇文章有疑问,欢迎到本站 社区 发帖提问或使用手Q扫描下方二维码加群参与讨论,获取更多帮助。

扫码加入群聊

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

目前还没有任何评论,快来抢沙发吧!

关于作者

JSmiles

生命进入颠沛而奔忙的本质状态,并将以不断告别和相遇的陈旧方式继续下去。

2891 文章
评论
84935 人气
更多

推荐作者

时光倒影

文章 0 评论

qq_YyjhCs

文章 0 评论

三人与歌

文章 0 评论

┼──瘾||

文章 1 评论