[GIS] How to add ol.layer.Vector source dynamically

openlayers

How to set source dynamically to a layer vector in OpenLayers 3

like this

var vectorLayer=  new ol.layer.Vector({  
    source: new ol.source.Vector()
});

vectorLayer.setSource(another_source);

Is it possible?

Best Answer

There is no method for setting source at api, http://openlayers.org/en/v3.0.0/apidoc/ol.layer.Vector.html. However you can define source;

var source = new ol.source.Vector();

and set source at the beginning;

var vectorLayer=  new ol.layer.Vector({

source: source

});

Then you are free to add or remove features to source dynamically by using addFeature and removeFeature methods without a need of dynamic change of source.

Related Solutions

OpenLayers 3 – Dynamically Adding Layer from Folder Contents

I believe I have done something similar using layer groups and the visibility option. I added multiple layer groups to an object and then used the visible option to hide and show the different layers. You can probably do the same thing not using groups as well if you don't want to. I'll try to provide a small example illustrating what I mean.

var layers = {};
layers['map'] = new ol.layer.Group({
  visible: false,
  source: new ol.source.OSM()
});
...//make more layers
map = new ol.Map({
layers: _.values(layers)//you can do something like this if you use underscore or lodash
...
function changeLayer(newLayer, oldLayer) {
  layers[oldLayer].set("visible", false);
  layers[newLayer].set("visible", true);
}

[GIS] OpenLayers3 change Layer source URL (or replace features loaded from another URL)

This answer by Pedro Baracho was given on StackOverflow: https://stackoverflow.com/a/31995204/1300775 (sorry for cross-posting)

is it possible to simply update the source URL (and automagically refresh the layer features) ?

You can create a new source and set it on the target layer using ol.layer.Layer.setSource.

s=new ol.source.Vector(/* your source config goes here */);
l=m.getLayers().getArray()[1];
l.setSource(s);

If both layers are visible, the map will automagically refresh the features.

shall I remove existing features, load new features using my own logic and add the loaded ones ?

You can add or remove features on your Vector Layer using:

var feature = new ol.Feature({
  geometry: new ol.geom.Polygon(polyCoords),
  labelPoint: new ol.geom.Point(labelCoords),
  name: 'My Polygon'
});

l=m.getLayers().getArray()[1];
s=l.getSource();
s.addFeature(feature);
s.addFeatures(/* array of features */);
s.removeFeature(feature);

shall I remove the whole Layer, re-create it, and re-add it ?

You can do that using ol.Map.addLayer and ol.Map.removeLayer.

// m is your map variable
v = new ol.layer.Vector(cfg);
m.addLayer(v);
m.removeLayer(v);

Final answer

All options listed above will switch the URL of your Layer. Each option triggers its own set of events and works with different parameters and objects. Based on my personal understanding, I would suggest:

Use option 1, if you are loading a new layer with the same properties of your old layer, but with new data.
Use option 2, if you have very few changes regarding some features on a Vector layer.
Use option 3, if you have a whole new layer, with different properties than your previous layer.

Best Answer

Related Solutions

OpenLayers 3 – Dynamically Adding Layer from Folder Contents

[GIS] OpenLayers3 change Layer source URL (or replace features loaded from another URL)

Related Question