uniapp使用高德地图定位(兼容app)
1.获取Key
需要:应用包名和SHA1()
2.配置manifest.json
3.设置安全通讯域名
登录,在 "设置"->"开发设置" 中设置 request 合法域名,将 https://restapi.amap.com 中添加进去
在创建的项目中,新建一个名为 libs 目录,将 amap-wx.js 文件拷贝到 libs 的本地目录下,完成安装。
5.在项目中使用
import amap from ../../../libs/amap-wx.130.js; // 导入插件 ... amapPlugin: any = null; onLoad(option: any) { // 使用高德SDK // #ifdef APP-PLUS switch (uni.getSystemInfoSync().platform) { case android: (this as any).amapPlugin = new amap.AMapWX({ key: ANDROID_KEY }); break; } // #endif // #ifndef APP-PLUS (this as any).amapPlugin = new amap.AMapWX({ key: WX_KEY }); // #endif } onShow() { // 获取当前定位 this.get_location(); } get_location() { //高德地图定位 uni.showLoading({ title: 获取信息中 }); this.amapPlugin.getRegeo({ success: data => { // 获取当前地址 this.addressContent = data[0].name; console.log( 当前位置的经度: + data[0].longitude, 当前位置的纬度: + data[0].latitude ); }, fail(res) { //解析经纬度地址 uni.showModal({ title: 提示, content: 如果您拒绝授权地址,将无法获取周围的店铺,是否打开位置授权?, success(res) { if (res.confirm) { console.log(用户点击确定); that.openSetting(); } else if (res.cancel) { console.log(用户点击取消); // 拒绝授权返回上一页 that.$Router.back(1); } } }); } }); }
上一篇:
uniapp开发微信小程序-2.页面制作
下一篇:
微信小程序如何上传图片