修改 OpenLayers 3 中现有图层的值
Modifying values of existing layer in OpenLayers 3
我通过调用以下函数使用 ol3 在地图上添加标记
function addmarker(lat, long, flag) {
iconFeature = new ol.Feature({
geometry: new ol.geom.Point(ol.proj.transform([+long, +lat], 'EPSG:4326', 'EPSG:3857')),
name: 'NULL'
});
iconStyle = new ol.style.Style({
fill: new ol.style.Fill({
color: '#008000'
}),
stroke: new ol.style.Stroke({
color: '#008000',
width: 3
}),
image: new ol.style.Circle({
radius: 6,
fill: new ol.style.Fill({
color: '#008000'
})
})
});
iconFeature.setStyle(iconStyle);
vectorSource[flag] = new ol.source.Vector({
features: [iconFeature]
});
vectorLayer[flag] = new ol.layer.Vector({
source: vectorSource[flag]
});
map.addLayer(vectorLayer[flag]);
}
为了更改标记位置,我正在删除图层并再次添加新图层
function changemarker(lat, long, flag) {
vectorSource[flag].clear();
map.removeLayer(vectorLayer[flag]);
addmarker(lat, long, flag);
}
我遇到了性能问题,因为我正在更改每 500 毫秒调用一次 changemarker 方法的标记。
是否可以在不删除图层的情况下修改图层,或者是否有更好的方法可以遵循。
请帮忙。
如果图层中只有一个特征,可以直接修改特征的几何形状:
function changemarker(lat, long, flag) {
vectorSource[flag].getFeatures()[0].getGeometry().setCoordinates(ol.proj.transform([+long, +lat], 'EPSG:4326', 'EPSG:3857'));
}
如果您在某个功能上设置了 ID ol.Feature.setId(<your id>)
,您可以像这样直接更改它:-
//Setting up your feature
iconFeature = new ol.Feature({
geometry: new ol.geom.Point(ol.proj.transform([+long, +lat], 'EPSG:4326', 'EPSG:3857')),
name: 'NULL'
});
iconFeature.setId('feature1');
然后
var myFeature = vectorSource.getFeatureById('feature1');
myFeature.getGeometry().setCoordinates(ol.proj.transform([lon, lat], 'EPSG:4326', 'EPSG:3857'));
这应该会立即更新要素而无需任何重绘调用 - OL 会在要素更新时重绘图层。使用这种方法,我在屏幕上显示了数百个具有复杂几何形状的特征,并且没有明显的速度损失。
我通过调用以下函数使用 ol3 在地图上添加标记
function addmarker(lat, long, flag) {
iconFeature = new ol.Feature({
geometry: new ol.geom.Point(ol.proj.transform([+long, +lat], 'EPSG:4326', 'EPSG:3857')),
name: 'NULL'
});
iconStyle = new ol.style.Style({
fill: new ol.style.Fill({
color: '#008000'
}),
stroke: new ol.style.Stroke({
color: '#008000',
width: 3
}),
image: new ol.style.Circle({
radius: 6,
fill: new ol.style.Fill({
color: '#008000'
})
})
});
iconFeature.setStyle(iconStyle);
vectorSource[flag] = new ol.source.Vector({
features: [iconFeature]
});
vectorLayer[flag] = new ol.layer.Vector({
source: vectorSource[flag]
});
map.addLayer(vectorLayer[flag]);
}
为了更改标记位置,我正在删除图层并再次添加新图层
function changemarker(lat, long, flag) {
vectorSource[flag].clear();
map.removeLayer(vectorLayer[flag]);
addmarker(lat, long, flag);
}
我遇到了性能问题,因为我正在更改每 500 毫秒调用一次 changemarker 方法的标记。 是否可以在不删除图层的情况下修改图层,或者是否有更好的方法可以遵循。
请帮忙。
如果图层中只有一个特征,可以直接修改特征的几何形状:
function changemarker(lat, long, flag) {
vectorSource[flag].getFeatures()[0].getGeometry().setCoordinates(ol.proj.transform([+long, +lat], 'EPSG:4326', 'EPSG:3857'));
}
如果您在某个功能上设置了 ID ol.Feature.setId(<your id>)
,您可以像这样直接更改它:-
//Setting up your feature
iconFeature = new ol.Feature({
geometry: new ol.geom.Point(ol.proj.transform([+long, +lat], 'EPSG:4326', 'EPSG:3857')),
name: 'NULL'
});
iconFeature.setId('feature1');
然后
var myFeature = vectorSource.getFeatureById('feature1');
myFeature.getGeometry().setCoordinates(ol.proj.transform([lon, lat], 'EPSG:4326', 'EPSG:3857'));
这应该会立即更新要素而无需任何重绘调用 - OL 会在要素更新时重绘图层。使用这种方法,我在屏幕上显示了数百个具有复杂几何形状的特征,并且没有明显的速度损失。