收藏
回答

小程序地图组件不能隐藏多边形、圆形覆盖物?

小程序地图清空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
    })
  }

回答关注问题邀请回答
收藏
登录 后发表内容