- 求教小程序map组件如何更新覆盖物?
已经实现了polygons多边形覆盖物的展示,现在是需要在地图缩小的时候隐藏覆盖物,但是已清空了data的覆盖物数组,map组件内覆盖物还是存在, 使用wx:if可以达到效果,但是体验太差了
2021-10-25 - 小程序地图组件不能隐藏多边形、圆形覆盖物?
小程序地图清空polygon、polyline数据之后,重新setData也不会隐藏覆盖物 wxml代码 <map id="map" scale="15" show-location="true" markers="{{markers}}" circles="{{circles}}" polygons="{{polygons}}" style="width: 100%; height: 100%" bindregionchange="mapChange"> </map> js data:{ markers:[{ "id": 346189, "latitude": 28.204634908858026, "longitude": 112.99551174014448, "iconPath": "../../image/images/default.png", "width": 0, "height": 0, "callout": { "content": "0805新增工地看看", "color": "#28373B", "display": "ALWAYS", "textAlign": "center", "bgColor": "transparent", "anchorY": 10 } }], polygons:[{ "points": [ { "longitude": 112.868618, "latitude": 28.289189 }, { "longitude": 112.86188, "latitude": 28.291985 }, { "longitude": 112.867502, "latitude": 28.295613 }, { "longitude": 112.875312, "latitude": 28.293345 }, { "longitude": 112.875355, "latitude": 28.293232 }, { "longitude": 112.875355, "latitude": 28.293194 } ], "fillColor": "#FAC3251A", "strokeColor": "#E32121FF", "strokeWidth": 2 }, ], circles:[ { "latitude": "28.194935", "longitude": "112.925454", "fillColor": "#FAC3251A", "color": "#E32121FF", "radius": 80, "strokeWidth": 1 }, ] }, // 地图事件 mapChange({ causedBy, detail, type }) { if (type == 'end' && causedBy == 'scale') ) { this.handleScaleChange(detail.scale) } }, handleScaleChange(scale) { let { markers, circles, polygons } = this.data if (scale <= 14.9) { // 地图比例小于等于14.9,隐藏markers markers.forEach(item => { if (item.callout) { item.callout.display = "BYCLICK" } }) } else { // 地图比例小于等于14.9,显示markers markers.forEach(item => { if (item.callout) { item.callout.display = "ALWAYS" } }) } // 当缩放比例<=14时,展示电子围栏 if (scale >= 14) { if (!circles.length) { circles = graphicalData.circles } if (!polygons.length) { polygons = graphicalData.polygons } } else { circles = [] polygons = [] } this.setData({ circles, polygons, markers }) }
2021-10-19