先贴上官方API:
| 属性名 | 类型 | 默认值 | 说明 | 最低版本 |
|---|---|---|---|---|
| longitude | Number | 中心经度 | ||
| latitude | Number | 中心纬度 | ||
| scale | Number | 16 | 缩放级别,取值范围为5-18 | |
| markers | Array | 标记点 | ||
| covers | Array | 即将移除,请使用 markers | ||
| polyline | Array | 路线 | ||
| polygons | Array | 多边形 | 2.3.0 | |
| circles | Array | 圆 | ||
| controls | Array | 控件(即将废弃,建议使用 cover-view 代替) | ||
| include-points | Array | 缩放视野以包含所有给定的坐标点 | ||
| show-location | Boolean | 显示带有方向的当前定位点 | ||
| subkey | String | ” | 个性化地图使用的key,仅初始化地图时有效 | 2.3.0 |
| enable-3D | Boolean | false | 展示3D楼块(工具暂不支持) | 2.3.0 |
| show-compass | Boolean | false | 显示指南针 | 2.3.0 |
| enable-overlooking | Boolean | false | 开启俯视 | 2.3.0 |
| enable-zoom | Boolean | true | 是否支持缩放 | 2.3.0 |
| enable-scroll | Boolean | true | 是否支持拖动 | 2.3.0 |
| enable-rotate | Boolean | false | 是否支持旋转 | 2.3.0 |
| bindmarkertap | EventHandle | 点击标记点时触发,会返回marker的id | ||
| bindcallouttap | EventHandle | 点击标记点对应的气泡时触发,会返回marker的id | 1.2.0 | |
| bindcontroltap | EventHandle | 点击控件时触发,会返回control的id | ||
| bindregionchange | EventHandle | 视野发生变化时触发 | 2.3.0起增加causedBy 参数区分拖动、缩放和调用接口等来源 |
|
| bindtap | EventHandle | 点击地图时触发 | ||
| bindupdated | EventHandle | 在地图渲染更新完成时触发 | 1.6.0 | |
| bindpoitap | EventHandle | 点击地图poi点时触发 | 2.3.0 |
一:marker气泡不能自定义样式
marker 上的气泡 callout
| 属性 | 说明 | 类型 | 最低版本 |
|---|---|---|---|
| content | 文本 | String | 1.2.0 |
| color | 文本颜色 | String | 1.2.0 |
| fontSize | 文字大小 | Number | 1.2.0 |
| borderRadius | 边框圆角 | Number | 1.2.0 |
| borderWidth | 边框宽度 | Number | 2.3.0 |
| borderColor | 边框颜色 | String | 2.3.0 |
| bgColor | 背景色 | String | 1.2.0 |
| padding | 文本边缘留白 | Number | 1.2.0 |
| display | ‘BYCLICK’:点击显示; ‘ALWAYS’:常显 | String | 1.2.0 |
| textAlign | 文本对齐方式。有效值: left, right, center | String | 1.6.0 |
如上所示,由于是原生组件,气泡只支持上述属性,所以想要个性化的展示,只能通过个性化小程序地图,但是是有使用限制
日限制:1万次/Key/接口
并发限制:5次/秒/Key/接口
如需更大配额需要申请,且必须是公司性质。
bindregionchange方法
文档里说“2.3.0起增加causedBy 参数区分拖动、缩放和调用接口等来源”
但是没说明causedBy 具体有哪些值
实际调试过程中,通过微信开发者工具,能调试出causedBy == “drag”时,可以判断为,用户进行了拖拽操作
结合bindregionchange方法
bindregionchange(e) {
if (e.type == 'end' && e.causedBy == "drag") {//当前可视区域变动,且是用户拖拽结束后的动作
this.doSomething()
}
}
Web前端(W3Cways.com) - Web前端学习之路