Leaflet 在传单中,如何从现在起将样式设置为默认样式

Leaflet 在传单中,如何从现在起将样式设置为默认样式,leaflet,Leaflet,我将geoJson贴图区域渲染到具有初始不透明度的贴图上。我有一个滑块可以在运行中更改不透明度 下面是我在自定义传单控件中对输入更改事件执行的动态不透明度设置(typescript)的位置: this.layers.forEach((r: L.GeoJSON<any>) => { r.eachLayer((layer: any) => { layer.setStyle({ fillOpacity: vm.mapOptions.heat

我将geoJson贴图区域渲染到具有初始不透明度的贴图上。我有一个滑块可以在运行中更改不透明度

下面是我在自定义传单控件中对输入更改事件执行的动态不透明度设置(typescript)的位置:

this.layers.forEach((r: L.GeoJSON<any>) => {
      r.eachLayer((layer: any) => {
             layer.setStyle({ fillOpacity: vm.mapOptions.heatmapOpacity });
      });
});
setTimeout(() => this.map.invalidateSize());
问题是,如果我使用setStyle将不透明度设置为不同的值,那么我进入一个区域,然后再次离开该区域,调用resetStyle将样式重置回原始默认样式,然后再更改不透明度

是否可以在图层上设置默认样式,以便调用resetStyle将样式设置为具有新不透明度的“我的值”,而不是创建区域时设置的原始不透明度?我该怎么做呢?

使用

所以不是

layer.setStyle({ fillOpacity: vm.mapOptions.heatmapOpacity });
使用

传单GeoJSON图层组的方法重新应用在创建该组时应用的,或默认方法(如果未提供样式):

将给定向量层的样式重置为原始GeoJSON样式,这对于在悬停事件后重置样式非常有用

如果以后更改该组中一个或所有矢量图层的样式,则在使用
resetStyle
时将覆盖该样式,并应用初始样式

一个简单的解决方法就是修改GeoJSON图层组的
样式
选项。但是,它将影响其所有子层:

group.options.style=newStyle;
(这是@GabyakaGPetrioli的答案中建议的,但你必须将其应用于团队,而不是个人特征)

另一种解决方案是记录每个向量层的新样式,并在您想要恢复以前的状态时使用该记录值,而不是使用组的
resetStyle
方法

var-map=L.map(“map”).setView([48.85,2.35],12);
var geojson={
键入:“功能”,
几何图形:{
键入:“点”,
座标:[2.35,48.85]
}
};
var点;
var startStyle={
颜色:“红色”
};
var newStyle={
颜色:“绿色”
};
var group=L.geoJSON(geoJSON{
风格:startStyle,
pointToLayer:功能(特性、latlng){
点=L.circleMarker(车床);
指定样式(点、起始样式);
返回点;
}
}).addTo(地图);
//如有必要,将样式记录到单个矢量层。
功能分配样式(传单层、新闻样式){
传单图层设置样式(新闻样式);
传单图层。\u recordedStyle=新闻样式;
}
//如果需要,应用以前录制的样式。
函数重新分配样式(图层){
传单层.设置样式(传单层.记录样式);
}
document.getElementById('button')。addEventListener('click',函数(事件){
event.preventDefault();
//或者使用记录新样式的包装器函数…
//指定样式(点、新闻样式);
//或者,如果可以接受影响所有子层的样式选项,则只需修改组的样式选项。
point.setStyle(新闻风格);
group.options.style=新闻样式;
});
集团公司({
鼠标悬停:功能(e){
e、 target.setStyle({
颜色:“蓝色”
});
},
鼠标输出:函数(e){
//重新分配样式(例如图层);
组重设样式(e层);
}
});
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'{
属性:“©;贡献者”
}).addTo(地图)

将颜色更改为绿色…

…然后鼠标悬停和鼠标悬停

Hmmm。这似乎不起作用。不透明性一开始并没有改变,所以我同时也调用了第一条语句。resetStyle也没有将其重置回setOptions值。
layer.setStyle({ fillOpacity: vm.mapOptions.heatmapOpacity });
L.Util.setOptions(layer, { style: { fillOpacity: vm.mapOptions.heatmapOpacity } });