腾讯地图API
若要使用getLocation方法必须在app.json中声明permission关键字
腾讯地图api地址:https://lbs.qq.com/
复制生成的keyid
代码实现:
app.json
"permission": {
"scope.userLocation": {
"desc": "你的位置信息将用于小程序位置接口的效果展示"
}
},
**
1.location.js
**
//引入./utils/util.js中的$parseVars2Str方法 此方法是拼接传入的数组数据
import {
$parseVars2Str
} from '../utils/util.js'
//引入MAP_KEY变量 此变量是腾讯滴入接口中的keyid
import {
MAP_KEY
} from '../config/index.js'
//引入requestbasic.js文件中的$get方法 此方法是wx.resquest的封装
import {
$get
} from '../utils/requestbasic.js'
//此方法为获取当前的位置的经纬度
export function $getLocation() {
return new Promise((resolve, reject) => {
wx.getLocation({
type: 'gcj02',
altitude: 'altitude',
complete: (res) => {},
fail: (res) => {},
highAccuracyExpireTime: 0,
isHighAccuracy: true,
success: ({
//longitude:lng, 给longitude变量取别名为lng
longitude: lng,
latitude: la
}) => {
resolve({
lat,
lng
})
},
})
})
}
//此方法将经纬度转换为地名
export function $convertLocationToAdress({lat , lng}) {
return new Promise(async (resolve, reject) => {
//使用腾讯地图获取当前地址
//调用对wx..request方法封装好的方法$get()方法 参数为url接口地址和data参数
let {result} = await $get('https://apis.map.qq.com/ws/geocoder/v1/' , {
location: $parseVars2Str(lat, lng),//两个参数为经纬度
key: MAP_KEY
})
resolve(result)
})
}
//此方法为将地名转换为位置信息,经纬度
export function $convertAdressToLocation(address) {
return new Promise(async (resolve, reject) => {
//使用腾讯地图获取当前地址
let {result} = await $get('https://apis.map.qq.com/ws/geocoder/v1/' , {
address,
key: MAP_KEY
})
resolve(result.location)
})
}
2.requestbasic.js
//引入/config/index.js'中的BasicUrl常量
import {
BasicUrl
} from '../config/index.js';
//封装wx.request方法
//传入参数为url接口地址 , method请求方法 , data数据
function $res(url, method , data) {
wx.showLoading({
title: '加载中...',
})
return new Promise((resolve, reject) => {
wx.request({
url: url.startsWith("http") ? url : BasicUrl + url, // url.startsWith("http")判断是否为http开头 , 若是则不拼接BasicUrl 若不是则拼接BasicUrl
method,
data,
success: (res => {
resolve(res.data)
}),
fail(e) {
reject(e)
},
complete(){
wx.hideLoading()
}
})
})
}
//封装get方式请求的wx.request方法
export function $get(url , data) {
return $res(url, 'Get' , data)
// pro.then(res => {
// console.log(res)
// })
}
//封装post方式请求的wx.request方法
export function $post(url , data) {
return $request(url, 'POST' , data)
let pro = $request(url, 'POST')
pro.then(res => {
console.log(res)
})
}
3.util.js
//$parseVars2Str方法用逗号拼接传入的数据
//传入参数为可变参数 ,传入参数个数不确定
export function $parseVars2Str(...args) {
// return Array.prototype.join.call(arguments , ',');
return args.join(",")
}
4.config.js
export const BasicUrl = '接口地址'
export const MAP_KEY = '腾讯地图的接口keyid的值'
5.使用此工具方法
导入location.js中的这三个方法
import {
$convertLocationToAdress,
$convertAdressToLocation,
$getLocation
} from '../../utils/location.js'
Page({
//data:数据变量声明一个location变量
data: {
location
},
async getlocation() {
//获取当前位置
// let {
// lat,
// lng
// } = await $getLocation()
//将获取到的当前位置的经纬度传入convertLocationToAdress()函数中获取当前位置对应的地名
// let res = await $convertLocationToAdress({lat , lng})
// this.setData({
// location: res.address
// })
//传入经纬度的值 , 获取传入的经纬度对应的地名
let res = await $convertLocationToAdress({lat:28 , lng:40})
this.setData({
location: res.address
})
//传入参数为字符串 , 传入一个地名 , 返回地址信息即经纬度信息
let location = await $convertAdressToLocation('地名')
console.log(location)
},
})