微信小程序开发获取地理位置教程

由于小程序只提供了我们一个获取地理位置、速度的api，并没有获取的相关地位位置的信息等，我们利用百度地图的api来获取地位位置。官方提供的文档介绍

申请ak

下载百度地图的api，PS：由于小程序项目文件大小限制为1M，建议使用压缩版的js文件！

引入JS模块

放在utils下

在所需的js文件内导入js

// 引用百度地图，注意：require传入一个相对路径

var bmap = require('../../utils/bmap-wx/bmap-wx.js');

5.编辑代码

.js代码为：

var bmap = requir('../../utils/bmap-wx/bmap-wx.min.js');

var wxMarkerData = []; //定位成功回调对象

Page({ data: { ak: FHG7utZtdyXN2,//填写申请到的ak markers: [], longitude: '',//经度 latitude: '',//纬度 address: '',//地址 cityInfo: {} //城市信息 }, onLoad: function (options) { var that = this; /* 获取定位地理位置 */ // 新建bmap对象 var BMap = new bmap.BMapWX({ ak: that.data.ak }); var fail = function (data) { console.log(data); }; var success = function (data) { //返回数据内，已经包含经纬度 console.log(data); //使用wxMarkerData获取数据 wxMarkerData = data.wxMarkerData; //把所有数据放在初始化data内 that.setData({ markers: wxMarkerData, latitude: wxMarkerData[0].latitude, longitude: wxMarkerData[0].longitude, address: wxMarkerData[0].address, cityInfo: data.originalData.result.addressComponent }); } // 发起regeocoding检索请求 BMap.regeocoding({ fail: fail, success: success }); }})

运行效果图：

这样就完成了在小程序上获取定位功能，不同的API接口可以实现不同的功能，微信小程序能被赋予的能力还有很多，能适应多种场景。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!