版权声明:菜鸟老五 https://blog.csdn.net/qq_35695041/article/details/83187148
第一步--申请开发者密钥(key):申请密钥[https://lbs.qq.com/console/key.html]
第二步--下载微信小程序JavaScriptSDK
[下载地址http://3gimg.qq.com/lightmap/xcx/jssdk/qqmap-wx-jssdk1.0.zip]
第三步---安全域名设置,在“设置” -> “开发设置”中设置request合法域名,添加 https://apis.map.qq.com
第四步--- WXML
<view>
<!--citys当前城市----titles当前城市完整信息 -->
{{citys}}--{{titles}}
<!--button获取经纬度 -->
<button bindtap='btn_sub'>9999</button>
</view>
第五步----JS
//index.js
//获取应用实例
const app = getApp()
// 引入SDK核心类
const QQMapWX = require(
'../../libs/qqmap-wx-jssdk.js'
)
Page({
data: {
citys: "默认北京市",
},
onLoad: function (options) {
// onload中加入一个新函数
this.qqmapsdk = new QQMapWX({
key: '你申请的key'
})
wx.getLocation({
success: res => {
console.log(res);
//调用接口
this.qqmapsdk.reverseGeocoder({
location: {
latitude: res.latitude,
longitude: res.longitude
},
success: res => {
console.log("获取当前城市", res.result.address_component.city);
console.log("获取当前城市完整信息", res.result.address);
//调用网络数据
this.setData({
citys: res.result.address_component.city, //城市为获取的城市
titles: res.result.address //当前城市完整信息
})
}
})
}
})
},
//获取经纬度
btn_sub:function(){
wx.getLocation({
type: 'wgs84',
success: function (res) {
console.log(res);
var latitude = res.latitude
var longitude = res.longitude
var speed = res.speed
var accuracy = res.accuracy
}
})
}
})