leaflet 块状,并点击变色

1. 点击块状,变色,效果如下

    

2. 代码如下:


var that=this;

that.partyDistrictLayer = L.geoJson(data, {     //获取边界并定义
        style: {
          weight: 2,
          opacity: 1,
          color: 'red',
          dashArray: '4',
          fillOpacity: 0.2,
          fillColor: '#FFEDA0'
        },
        onEachFeature: ((feature, layer) => { //对每个小块进行定义
          layer.on({
            //mouseover:移入
            mouseover: ((e) => {
              var layer = e.target;
              layer.setStyle({
                weight: 5,
                color: '#666',
                dashArray: '',
                fillOpacity: 0.5
              });
              if (!L.Browser.ie && !L.Browser.opera) {
                layer.bringToFront();
              }
            }),
            //mouseout:移出
            mouseout: ((e) => {
              // that.partyDistrictLayer.resetStyle(e.target);     //恢复样式
              var layer = e.target;
              layer.setStyle({
                weight: 2,
                opacity: 1,
                color: 'red',
                dashArray: '4',
                fillOpacity: 0.2,
                fillColor: '#FFEDA0'
              });

            }),
            //click事件
            click: ((e) => {
              _map.fitBounds(e.target.getBounds());
              var code = parseInt(e.target.feature.id);
              if (that.level == 2) code = parseInt(e.target.feature.properties.XZDM);

              if (code > 620700000) {
                return;
              }
              //大于市级,就返回
              if (code < 6207) {
                return;
              }
              if (that.partyDistrictLayer != undefined) {
                _map.removeLayer(that.partyDistrictLayer);
              }
              if (that.qlsMarkerLayer != undefined) {
                _map.removeLayer(that.qlsMarkerLayer);
              }
              that.getAround(code);
              that.RefreshPartyLayers(code);
            })
          });
        })
      }).addTo(_map);

  _map.fitBounds(that.partyDistrictLayer.getBounds());

 

转载自:https://blog.csdn.net/qq_34790644/article/details/88866266

You may also like...