最終實(shí)現(xiàn)效果：
效果實(shí)現(xiàn)步驟圖
新建index文件夾
- index.wxml
<!--pages/index/index.wxml-->
<view class='container'>
<view bindtap='onChangeAddress'>
<input value="{{address}}" name="address" placeholder="選擇地點(diǎn)">
</view>
</view>
- index.js
// pages/index/index.js
Page({
data: {
address: ''
},
onChangeAddress() {
var _page = this;
wx.chooseLocation({
success: (res) => {
_page.setData({
address: res.name
});
},
fail: (err) => {
console.log(err);
}
});
}
})
新建map文件夾
- map.wxml
<!--pages/map/map.wxml-->
<view class="container">
<map
id="myMap"
style="width: 100%; height: 100%;"
latitude="{{latitude}}"
longitude="{{longitude}}"
markers="{{markers}}"
show-location
></map>
</view>
- map.js
// pages/map/map.js
Page({
data: {
latitude: 31.22786,
longitude: 121.46658,
markers: [{
id: 1,
latitude: 31.22786,
longitude: 121.46658,
name: '上海招商局廣場(chǎng)'
}]
},
onReady(e) {
this.mapCtx = wx.createMapContext('myMap')
}
})
