修改OpenLayers 3中现有层的值

本文关键字：OpenLayers 修改 | 更新日期: 2023-09-27 18:06:11

我正在使用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方法的标记。是否可以在不删除图层的情况下修改图层，或者是否有更好的方法可以遵循。

请帮。

修改OpenLayers 3中现有层的值

如果您在功能ol.Feature.setId(<your id>)上设置了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在特征更新时重绘层。使用这种方法，我可以在屏幕上显示数百个具有复杂几何形状的特征，而不会对速度造成重大影响。

如果你的图层中只有一个特征，你可以直接修改特征的几何形状:

function changemarker(lat, long, flag) {
  vectorSource[flag].getFeatures()[0].getGeometry().setCoordinates(ol.proj.transform([+long, +lat], 'EPSG:4326', 'EPSG:3857'));
}
相关文章：