I have an OpenLayers 3 map with a base layer and a vector layer.
this.topoLayer = new ol.layer.Vector({
source: new ol.source.Vector(),
style: style
});
var baseLayer = new ol.layer.Tile({
source: new ol.source.XYZ({
url: 'http://[…]/{z}/{x}/{y}.png',
crossOrigin: 'null'
})
});
this.map = new ol.Map({
target: 'map',
layers: [baseLayer, this.topoLayer],
view: new ol.View2D({
center: ol.proj.transform([11.38, 48.54], this.options.markerEPSG, this.options.mapEPSG),
zoom: 5,
}),
});
Upon user interaction, I add and remove several features to the vector layer. Here is the function that adds a new feature:
var feature = new ol.Feature({
topo: topo,
selected: false,
geometry: new ol.geom.Point(ol.proj.transform(location, this.options.markerEPSG, this.options.mapEPSG)),
});
this.topoLayer.getSource().addFeatures([feature]);
After adding/removing a new feature I would like to automatically zoom and pan the map to fit my features. In the old OpenLayers API there was the getDataExtent
function on vector layers to retrieve a "bounding box" around all features shown. But I wonder how to do this with the new API.
var coordinates = features.map(function(feature) {return feature.getGeometry().getCoordinates();});
var extent = ol.extent.boundingExtent(coordinates);
– SomeBdyElsemap.getView().fit(extent, map.getSize())
to adjust the map. – philk