北京华网天下

2位置获取方法此方法路径：目录中.js文件

2021-04-23

来源：网络整理

本文主要分为四部分：

1、腾讯定位服务的注册和使用
2、小程序的整体框架结构介绍
3、小程序集成腾讯定位服务开发说明
4、源码下载

一、腾讯定位服务的注册和使用

第一步注册

【点击】腾讯位置服务链接进行注册，如果注册过，也可点下面链接进行登录使用

https://lbs.qq.com?lbs_invite=ATLEFLA

1 点击最右上角注册或登录

2 输入手机号获取验证码进行注册即可

第二步创建一个key

不要被注册后酷炫的页面所迷惑！如下图所示操作！

第三步保存创建好的key ，切莫泄露给其他人！

这是我创建好的，供各位大佬鉴赏！就是这个模样

记住创建好的key，不要告诉任何人，以免别人拿你的key干坏事！

二、小程序的整体框架结构介绍

1、开发工具及开发环境

如下所示：: Tomcat 7; JDK7+; Eclipse; Mysql 5.6+; 微信小程序开发工具

2、Java后端代码结构

说明如下：

controller 控制层
dao 数据处理
interfa 接口
service 服务层
utils 公共方法

3、小程序结构

3、小程序功能展示

主要功能：
1 可以创建团队，新建成员
2 对团队中人员进行管理（这里人员都是小程序使用用户）
3 考勤设置这里是对考勤地址的设置
4 考勤审批，主要针对打开时间不正确、或者定位不准等情况

三、小程序集成腾讯定位服务开发说明

1 开发注意事项
需要引入地图脚本：qqmap-wx-jssdk.js （本文引入放在utils中）
需要具体js中Page最上面引入js

//index.js var QQMapWX = require('../../utils/qqmap-wx-jssdk.js') //引入获得地址的js文件 var qqmapsdk;

2如何获取位置

此方法的路径：目录中的.js文件

getLocation() { var that = this wx.getLocation({ //调用API得到经纬度 type: 'wgs84', success: function(res) { var speed = res.speed var accuracy = res.accuracy var latitude = res.latitude var longitude = res.longitude that.setData({ latitude: res.latitude, longitude: res.longitude, markers: [{ latitude: latitude, longitude: longitude, iconPath: '/images/icon_mark.png', title: '定位地点！', width: 30, height: 30 }] }) //地址解析 var demo = new QQMapWX({ // 这个KEY的获取方式在上面链接 //腾讯位置服务的开发文档中有详细的申请密钥步骤 key: 'YUVBZ-XXXXX-XXXXX-XXXXX-XXXXX-DTB4E' }); demo.reverseGeocoder({ //地址解析 location: { latitude: latitude, longitude: longitude }, success: function(res) { console.log(res); //获得地址 that.setData({ address: res.result.address }) }, fail: function(res) { console.log(res); }, complete: function(res) { console.log(res); } }); } }) },

此代码段是目录中的.js文件

getLocation: function (e) { console.log(e) var that = this wx.getLocation({ type: 'wgs84', // 默认为 wgs84 返回 gps 坐标，gcj02 返回可用于 wx.openLocation 的坐标 success: function (res) { console.log(res) that.setData({ longitude: res.longitude, latitude: res.latitude }) } 　}) }