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