百度智能小程序 MapContext
MapContext
解释：map 返回值。
属性说明
| 属性名 | 说明 |
|---|---|
| MapContext.includePoints | 缩放视野展示所有经纬度 |
| MapContext.getCenterLocation | 获取当前地图中心的经纬度 |
| MapContext.translateMarker | 平移 marker |
| MapContext.moveToLocation | 将地图中心移动到当前定位点 |
| MapContext.getRegion | 获取当前地图的视野范围 |
| MapContext.getScale | 获取当前地图的缩放级别 |
示例
图片示例
代码示例
<view class="wrap">
<map id="myMap"
longitude="{{longitude}}"
latitude="{{latitude}}"
style="width: 100%"
markers="{{markers}}"
show-location>
</map>
<button type="primary" bindtap="includePoints">缩放视野展示所有经纬度</button>
<button type="primary" bindtap="getCenterLocation">获取位置</button>
<button type="primary" bindtap="translateMarker">平移 marker</button>
<button type="primary" bindtap="moveToLocation">移动位置</button>
<button type="primary" bindtap="getRegion">获取当前地图的视野范围</button>
<button type="primary" bindtap="getScale">获取当前地图的缩放级别</button>
</view>Page({
data: {
latitude: 40.048828,
longitude: 116.280412,
markers: [{
markerId: 1,
latitude: 40.052751,
longitude: 116.278796
}, {
markerId: 2,
latitude: 40.048828,
longitude: 116.280412,
callout: {
display: 'ALWAYS',
content: '百度科技园'
}
}]
},
onReady() {
this.mapContext = swan.createMapContext('myMap');
},
getCenterLocation() {
this.mapContext.getCenterLocation({
success: res => {
swan.showModal({
title: '位置信息',
content: (res.longitude).toFixed(2) + '/' + (res.latitude).toFixed(2)
});
console.log('经度', res.longitude);
console.log('纬度', res.latitude);
}
});
},
moveToLocation() {
this.mapContext.moveToLocation();
},
translateMarker() {
this.mapContext.translateMarker({
markerId: '2',
destination: {
latitude: 40.049655,
longitude: 116.27505
},
autoRotate: true,
rotate: 30,
duration: 1000,
animationEnd() {
swan.showToast({
title: '动画结束啦！',
icon: 'none'
});
},
success: res => {
console.log('translateMarker success');
},
fail : err => {
console.log('translateMarker fail', err);
}
});
},
includePoints() {
this.mapContext.includePoints({
padding: [10],
points: [{
latitude: 23,
longitude: 113.33
}, {
latitude: 23,
longitude: 113.3345211
}],
success: res => {
console.log('includePoints success');
},
fail: err => {
console.log('includePoints fail', err);
}
});
},
getRegion() {
this.mapContext.getRegion({
success: res => {
swan.showModal({
title: '视野范围',
content: 'northeast: ' + JSON.stringify(res.northeast) + '/' + 'southwest: ' + JSON.stringify(res.southwest)
});
console.log('视野范围', res);
}
});
},
getScale() {
this.mapContext.getScale({
success: res => {
swan.showModal({
title: '缩放级别',
content: JSON.stringify(res.scale)
});
}
});
}
});