web-dev-qa-db-fra.com

OpenLayers 3 Etendue de toutes les fonctionnalités sur un calque vectoriel?

J'ai une carte OpenLayers 3 avec un calque de base et un calque vectoriel. 

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

Lors de l'interaction de l'utilisateur, j'ajoute et supprime plusieurs caractéristiques de la couche vectorielle. Voici la fonction qui ajoute une nouvelle fonctionnalité:

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

Après avoir ajouté/supprimé une nouvelle fonctionnalité, je souhaite automatiquement effectuer un zoom et un panoramique de la carte en fonction de mes fonctionnalités. Dans l'ancienne API OpenLayers, il existait une fonction getDataExtent sur les couches vectorielles pour extraire un "cadre de sélection" autour de toutes les fonctionnalités présentées. Mais je me demande comment faire cela avec la nouvelle API.

javascriptopenlayersopenlayers-3
17
SomeBdyElse

Dans la version 3.7, ol.View.fitExtent() et ol.View.fitGeometry() ont été unifiés dans une seule fonction: fit.

Alors maintenant, le code est:

 var extent = myLayer.getSource().getExtent();
 map.getView().fit(extent, map.getSize());
22
Mister Smith

D'après la réponse de Tyler DeWitt, vous devriez pouvoir faire quelque chose comme ceci:

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

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

Edit: Comme Tim et Stuart ont dit que ce qui précède ne fonctionne plus. Ce qui suit devrait faire l'affaire à la place:

 var extent = yourlayer.getSource().getExtent();
 map.getView().fitExtent(extent, map.getSize());
8
Danny Hoek
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);

Non testé.

Il devrait y avoir un moyen plus élégant, mais je ne sais pas encore où le trouver.

3
Jachym

Comme je ne peux pas encore commenter, je vais devoir poster une autre réponse: La réponse de Danny Hoek est incorrecte, voici la mise à jour:

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

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

Fondamentalement, cet accessoire 2D semble avoir disparu.

2
Stuart Allen

Il y a une fonction getExtent() sur ol.source maintenant, donc je peux appeler <layer>.getSource().getExtent(). Je n'arrive pas à comprendre comment faire en sorte que ma carte soit agrandie à ce niveau. <map>.zoomToExtent(extent) n'existe plus.

0
Tyler DeWitt