/ OpenLayers 3

OpenLayers 3 动态更新 VectorLayer 中的数据

通过一个小例子，展示如何改变 VectorLayer 中的要素，并刷新地图。

源代码：qianyanseu/openlayers3-vectorlayer-source-update

关键代码

在 OpenLayers 3 中，更新矢量图层中的内容，可通过修改该图层的 DataSource 来实现。

下面这段代码实现了每5秒更新一次数据。更新时，首先将现有的要素集清空，再批量将获取到的要素集添加到图层中。对 addFeatures() 的调用会自动触发 changed 事件，导致图层重绘，因次不需要再专门调用地图重绘的方法。

      var refreshInteval = 5000; // refresh every 5 seconds
      setTimeout(updateFeaturesForVectorLayer, refreshInteval);

      function updateFeaturesForVectorLayer(){
        $.ajax({
          type : "POST",
          url : 'http://localhost/ol-test/countries.geojson',
          dataType:"json",
          success : function(datas) {
            console.log('get data success, begin to update layer')
            var features = (new ol.format.GeoJSON()).readFeatures(datas, {featureProjection:"EPSG:3857"});

            
            vectorLayer.getSource().clear();
            vectorLayer.getSource().addFeatures(features);
            
            
          }
          });
          
          setTimeout(reflushMaiPage, refreshInteval);
        }