1.wxml
使用map组件 绑定markers 插入callout
<map id="mapId" longitude="{{longitude}}" latitude="{{latitude}}" markers="{{markers}}" style="width: 100%; height: 100%;" scale="11">
<!-- <cover-view slot="callout">
<block wx:for="{{customCalloutMarkerIds}}" wx:key="*this">
<cover-view marker-id="{{item}}">
</cover-view>
</block>
</cover-view> -->
</map>
2.js
自定义气泡内容,添加进markes
let markers = []
if(list.length > 0){
list.forEach(item=>{
let normalCallout = {
id: item.id,
latitude: item.lon,
longitude: item.lat,
iconPath: item.onoff == \'上线\' ? \'/images/location1.png\' : \'/images/location3.png\',
callout: {
content: `名称：${item.name}\n状态：${item.onoff}`,
color: \'#000\',
fontSize: 12,
borderWidth: 1,
borderRadius: 10,
borderColor: \'#ccc\',
bgColor: \'#fff\',
padding: 10,
display: \'BYCLICK\',
textAlign: \'left\',
},
}
markers.push(normalCallout)
})
}
请发表评论