js
Page({
data: {
longitude: "",
latitude: "",
markers: [{
id: "0",
// iconPath: "../../images/icon_cur_position.png",
latitude: "",
longitude: "",
width: 50,
height: 50
}]
},
onLoad () {
this.openMap();
},
openMap(){ //打开地图定位
var that = this;
wx.getLocation({
type: "wgs84",
success: function (res) {
var latitude = res.latitude; //获取经度
var longitude = res.longitude; //获取纬度
that.setData({
latitude: latitude,
longitude: longitude,
})
that.openLocationFn();
}
})
},
openLocationFn(){ //选择地方
var that = this;
wx.openLocation({
latitude: that.data.latitude, //要到达的经度
longitude: that.data.longitude, //要到达的纬度
name: that.data.addressName,
scale: 18,
name: "点击右边按钮进行选择位置",
success(res) {
wx.chooseLocation({
success(res) {
that.setData({
latitude: res.latitude,
longitude: res.longitude,
})
},
})
}
})
},
onReady () {
console.log("onReady");
}
})
html
<view style="width: 100%; height: 100%;">
<map id="map" longitude="{{longitude}}" latitude=" {{latitude}}" markers="{{markers}}" scale="13" bindcontroltap="controltap" bindmarkertap="markertap" show-location style="width: 100%; height: 100%;"></map>
<button style="position:absolute;bottom:0%;z-index:9999" bindtap="openLocationFn">重新定位</button>
</view>
css
page{
height: 100%;
}
小程序自己定位,用户自己选择位置,手动搜索位置,可以跳转到高德地图和腾讯地图进行导航。。。