问题集合
安卓App端,开启点聚合
- 会导致@markertap和@labeltap的点击事件失效(未解决)
- 标记点Label属性失效(未解决)
html
<view class="content">
<map id="map" class="map" :show-location="true" :latitude="latitude" :longitude="longitude"
@markertap="markertap" @labeltap="labeltap"></map>
</view>
javascript
const img = '/static/logo.png';
export default {
data() {
return {
latitude: 32.715738,
longitude: -117.1610838,
}
},
onReady() {
this._mapContext = uni.createMapContext("map", this);
// this.clusterEvent()
this.addMarkers();
},
methods: {
// 开启聚合
clusterEvent(){
// 仅调用初始化,才会触发 on.("markerClusterCreate", (e) => {})
this._mapContext.initMarkerCluster({
enableDefaultStyle: false,
zoomOnClick: true,
gridSize: 60,
complete(res) {
console.log('initMarkerCluster', res)
}
});
// 缩放或拖动导致新的聚合簇产生时触发,仅返回新创建的聚合簇信息。
this._mapContext.on("markerClusterCreate", (e) => {
// console.log("markerClusterCreate", e);
});
// 聚合点击事件
this._mapContext.on("markerClusterClick", (e) => {
// console.log("markerClusterClick", e);
})
},
// 添加标记点
addMarkers() {
const positions = [{
latitude: 32.715738,
longitude: -117.1610838,
}, {
latitude: 32.715180,
longitude: -117.1610838,
}, {
latitude: 32.715180,
longitude: -117.16217638,
}]
const markers = []
positions.forEach((p, i) => {
markers.push(
Object.assign({}, {
id: i + 1, // markertap点击事件必须指定id
iconPath: img,
width: 50,
height: 50,
// joinCluster: true, // 指定了该参数才会参与聚合
label: { // 点聚合开启,label失效
width: 50,
height: 30,
borderWidth: 1,
borderRadius: 10,
fontSize: 14,
color: '#fff',
textAlign: 'center',
bgColor: '#1bff18',
content: `label ${i + 1}`
}
}, p)
)
})
this._mapContext.addMarkers({
markers,
clear: false,
complete(res) {
console.log('addMarkers', res)
}
})
},
// 标记点点击事件(注:安卓app,点聚合开启,标记点点击失效)
markertap(evt) {
console.log("Marker点击", evt);
},
// Label标签点击事件(注:安卓app,点聚合开启,Label标签点击失效)
labeltap(evt) {
console.log("Label点击", evt);
},
}
}