21

我有一个带有基础层和矢量图层的 OpenLayers 3 地图。

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,
    }),
});

在用户交互时,我向矢量图层添加和删除几个特征。这是添加新功能的函数:

  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]);

添加/删除新功能后,我想自动缩放和平移地图以适合我的功能。在旧的 OpenLayers API 中getDataExtent,矢量图层上有一个函数可以检索显示的所有特征周围的“边界框”。但我想知道如何使用新的 API 来做到这一点。

4

5 回答 5

28

在 3.7 版本中,ol.View.fitExtent()ol.View.fitGeometry()已统一在一个功能中:fit.

所以现在的代码是:

 var extent = myLayer.getSource().getExtent();
 map.getView().fit(extent, map.getSize());
于 2015-07-08T09:36:32.863 回答
9

根据 Tyler DeWitt 的回答,您应该能够执行以下操作:

var view = yourmap.getView();
var view2D = view.getView2D();
var extent = yourlayer.getSource().getExtent();

view2D.fitExtent(extent, yourmap.getSize());

编辑:就像蒂姆和斯图尔特所说的那样,上面的方法不再起作用了。以下应该可以解决问题:

 var extent = yourlayer.getSource().getExtent();
 map.getView().fitExtent(extent, map.getSize());
于 2014-06-17T09:08:50.523 回答
3
var source = layer.getSource();
goog.events.listen(source, ol.source.VectorEventType.ADD, function(evt) {
     // taken from ol/source/vectorsource.js
     var extent = ol.extent.createEmpty();
     var geometry = null;
     var feature;
     var features = source.getFeatures().getArray();
     for (var i = 0, ii = features.length; i < ii; ++i) {
         feature = features[i];
         geometry = feature.getGeometry();
         if (!goog.isNull(geometry)) {
               ol.extent.extend(extent, geometry.getExtent());
     }
     // here you should have your extent
    }
}, false, this);

未经测试。

应该有更优雅的方式,但我现在不确定在哪里可以找到它。

于 2014-01-02T17:07:40.137 回答
2

由于我还不能发表评论,我将不得不发布另一个答案:Danny Hoek 的答案不再正确,这里是更新:

var view = yourmap.getView();
var extent = yourlayer.getSource().getExtent();

view.fitExtent(extent, yourmap.getSize());

基本上,那个 2D 道具似乎已经消失了。

于 2014-10-13T14:55:56.393 回答
0

现在有一个getExtent()功能ol.source,所以我可以调用<layer>.getSource().getExtent(). 但是,我不知道如何让我的地图缩放到那个级​​别。<map>.zoomToExtent(extent)不复存在。

于 2014-05-15T14:44:38.017 回答