700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > 前端web用腾讯地图api根据地址获取经纬度

前端web用腾讯地图api根据地址获取经纬度

时间:2021-01-01 08:53:04

相关推荐

前端web用腾讯地图api根据地址获取经纬度

需求:使用腾讯地图,通过输入的地址获取经纬度

1.先引入腾讯地图,参考/l13620804253/article/details/117254651

2.要调用腾讯地图API获取当前位置的经纬度,需要使用腾讯地图位置服务https://apis./ws/geocoder/v1/接口(附上楼梯/service/webService/webServiceGuide/webServiceGeocoder),该接口前端直接正常请求会跨越,需要jsonp来避免报错;

3.引入jsonp:

1)安装vue-jsonp:

npm install vue-jsonp --save

2)在main.js中导入:

import { VueJsonp } from 'vue-jsonp'Vue.use(VueJsonp)

4.定义方法:

// 根据地址获取坐标addrToGetCoordinate(addr) {this.$jsonp('https://apis./ws/geocoder/v1/', {key: 'ZBABZ-S5LKO-AQAWR-SNHUD-V3AQS-MSBMB',output: 'jsonp',address: addr}).then((res) => {console.log(res)if (res.status === 0) {// 处理得到的经纬度this.coordinate.lat = res.result.location.lat.toFixed(6)this.coordinate.lng = res.result.location.lng.toFixed(6)this.postForm.store_longitude = res.result.location.lngthis.postForm.store_latitude = res.result.location.lat// 用获取到的经纬度,修改地图的中心点this.changeCenter(res.result.location.lat.toFixed(6), res.result.location.lng.toFixed(6))}}).catch((e) => {console.log(e)})},

5.然后在对应的地方使用;

以上就是web端腾讯地图,通过地址获取经纬度的方法,记得关注点赞~~摸摸哒

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。