您现在的位置是:首页 > 文章详情

微信小程序输入地址自动获取经纬度

日期:2018-09-04点击:419

腾讯位置服务官网:http://lbs.qq.com/index.html
SDK下载地址:http://3gimg.qq.com/lightmap/xcx/jssdk/qqmap-wx-jssdk1.0.zip
微信小程序JavaScript SDK文档地址:http://lbs.qq.com/qqmap_wx_jssdk/index.html
地址解析坐标API文档地址:http://lbs.qq.com/qqmap_wx_jssdk/method-geocoder.html

申请密钥(key)这里就不讲了。

1、选择SDK为微信小程序JavaScript SDK


img_958c2d921468094ea60725b49d783848.png
微信小程序JavaScript SDK

2、下载SDK,下载完后解压,把下载的包解压并复制文件到项目文件夹。


img_543bf67b1d497353d52d55a980fa36d9.png
下载SDK

img_061e71a15e0436da3ee7e9318986b7eb.png
制文件到项目文件夹

3、到要使用的页面js引入SDK文件,并实例化API核心类

// 引入SDK核心类 import QQMapWX from 'xxx/qqmap-wx.js'; // 实例化API核心类 let qqMap = new QQMapWX({ key: '开发密钥(key)' // 必填 }); 

4、当用户输入地址完毕后解析坐标

<input type="text" bindblur="atuoGetLocation" /> 
atuoGetLocation(e) { qqMap.geocoder({ address: e.detail.value, //用户输入的地址(注:地址中请包含城市名称,否则会影响解析效果),如:'北京市海淀区彩和坊路海淀西大街74号' complete: res => { console.log(res.result.location); //经纬度对象 } else { console.log('无法定位到该地址,请确认地址信息!'); } } }); } 

API使用详情请参考地址解析坐标API文档地址:http://lbs.qq.com/qqmap_wx_jssdk/method-geocoder.html

原文链接:https://yq.aliyun.com/articles/638386
关注公众号

低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。

持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。

转载内容版权归作者及来源网站所有,本站原创内容转载请注明来源。

文章评论

共有0条评论来说两句吧...

文章二维码

扫描即可查看该文章

点击排行

推荐阅读

最新文章