Javascript 如何从开放图层中矢量图层的单个特征中删除样式?
我正在学习JS的OpenLayers库。 我已成功设置单击事件以更改单个功能的样式。但是,我希望在单击其他地方或其他功能后删除该样式Javascript 如何从开放图层中矢量图层的单个特征中删除样式?,javascript,openlayers,Javascript,Openlayers,我正在学习JS的OpenLayers库。 我已成功设置单击事件以更改单个功能的样式。但是,我希望在单击其他地方或其他功能后删除该样式 var white = [255, 255, 255, 1]; var blue = [0, 153, 255, 1]; var width = 3; // Basic Style for the point layer const pointStyle = new ol.style.Style({ image: new ol.style.Circle(
var white = [255, 255, 255, 1];
var blue = [0, 153, 255, 1];
var width = 3;
// Basic Style for the point layer
const pointStyle = new ol.style.Style({
image: new ol.style.Circle({
radius: width * 2,
fill: new ol.style.Fill({
color: blue
}),
}),
})
const map = new ol.Map({
//Some Parameters
})
const points = new ol.layer.Vector({
source: new ol.source.Vector({
url: './res/points.json',
format: new ol.format.GeoJSON(),
}),
style: pointStyle,
title: 'Points'
})
const myLayerGroup = new ol.layer.Group({
layers: [boundary, points]
})
map.addLayer(myLayerGroup);
map.on('click', function(e) {
map.forEachFeatureAtPixel(e.pixel, function(feature, layer) {
if (feature.get('Name')) {
if (feature.getStyle() == null) {
layer.setStyle(pointStyle);
feature.setStyle(); //Tried setting style to null here, didn't work
feature.setStyle(new ol.style.Style({
image: new ol.style.Circle({
radius: width * 2,
fill: new ol.style.Fill({
color: white //Basically points change to white here
}),
})
}))
}
}
})
})
似乎一旦我为单个元素设置了样式,即使我覆盖了整个层的样式,单个元素的样式仍然存在。我还没有找到一种方法来循环每个功能,并将它们各自的样式设置为空白。您可以使用一个变量来记录更改的功能
let changedFeature;
map.on('click', function(e) {
if (changedFeature)
changedFeature.setStyle();
changedFeature = undefined;
}
map.forEachFeatureAtPixel(e.pixel, function(feature, layer) {
if (feature.get('Name')) {
if (feature.getStyle() == null) {
feature.setStyle(new ol.style.Style({
image: new ol.style.Circle({
radius: width * 2,
fill: new ol.style.Fill({
color: white //Basically points change to white here
}),
})
}))
changedFeature = feature;
}
}
})
})
非常感谢。我试图访问功能的样式并将其设置为空。但我可以这样做。非常感谢。