openlayers 3 zoom in estensione combinata

Question

Sto usando gli openlayer 3 per creare una mappa con caratteristiche vettoriali in alto. Fin qui tutto bene.

Ho diversi livelli vettoriali, raggruppati in una variabile denominata projecten.

var projecten = new ol.layer.Group({ 

      title: 'Projecten', 
      layers: [ 

       new ol.layer.Vector({ 
       title: 'EVZ Den Dungen', 
       source: new ol.source.GeoJSON(
          /** @type {olx.source.GeoJSONOptions} */ ({ 
           object: EVZDenDungen, 
           projection: 'EPSG:3857' 
         })), 
       style: function(feature, resolution) { 
        return lookup[feature.get('landschapselement')]; 
       } 
       }), 

       new ol.layer.Vector({ 
       title: 'EVZ Croy', 
       source: new ol.source.GeoJSON(
          /** @type {olx.source.GeoJSONOptions} */ ({ 
           object: EVZCroy, 
           projection: 'EPSG:3857' 
         })), 
       style: function(feature, resolution) { 
        return lookup[feature.get('landschapselement')]; 
       } 
       }), 

       new ol.layer.Vector({ 
       title: 'Natuurcompensatie Gasselsbroek', 
       source: new ol.source.GeoJSON(
          /** @type {olx.source.GeoJSONOptions} */ ({ 
           object: NatuurcompensatieGasselsbroek, 
           projection: 'EPSG:3857' 
         })), 
       style: function(feature, resolution) { 
        return lookup[feature.get('landschapselement')]; 
       } 
       }), 

       new ol.layer.Vector({ 
       title: 'Ebben', 
       source: new ol.source.GeoJSON(
          /** @type {olx.source.GeoJSONOptions} */ ({ 
           object: Ebben, 
           projection: 'EPSG:3857' 
         })), 
       style: function(feature, resolution) { 
        return lookup[feature.get('landschapselement')]; 
       } 
       }), 

       new ol.layer.Vector({ 
       title: 'Zionsburg', 
       source: new ol.source.GeoJSON(
          /** @type {olx.source.GeoJSONOptions} */ ({ 
           object: Zionsburg, 
           projection: 'EPSG:3857' 
         })), 
       style: function(feature, resolution) { 
        return lookup[feature.get('landschapselement')]; 
       } 
       }) 


      ] 
}) 

Ora voglio in qualche modo un ciclo tra le variabili projecten, ciclo attraverso i suoi strati uno per uno, ottenere l'estensione di ogni strato funzione, e fermarsi quando è stato raggiunto l'ultimo strato. Quindi voglio zoomare su questa estensione combinata.

Questa è la mia impostazione di base (io non sono bravo con javascript e loop):

projecten.getLayers() 
    for (var i = 0, ii = layers.length; i < ii; ++i) { 
     layer = layers[i]; 
     ol.extent.boundingExtend(extent, layer.getBounds()); 
    } 
    map.getView().fitExtent(extent,map.getSize()); 

Tutte le idee su come posso ottenere questo lavoro?

Answer 1

Si dovrebbe essere in grado di fare questo:

var extent = ol.extent.createEmpty(); 
projecten.getLayers().forEach(function(layer) { 
    ol.extent.extend(extent, layer.getSource().getExtent()); 
}); 
map.getView().fitExtent(extent, map.getSize()); 

utilizzare la funzione ol.extent.createEmpty() per inizializzare la vostra misura. Quindi esegui un ciclo attraverso la raccolta di livelli e utilizza ol.extent.extend() per generare un'estensione che includa tutte le funzionalità in tutte le origini vettoriali. Infine, adatta la visualizzazione della mappa in questa misura.

Ci sono alcune cose da notare qui. Il metodo group.getLayers() restituisce uno ol.Collection livelli. Questo è simile a un normale JavaScript Array tranne che è osservabile. È possibile utilizzare il metodo collection.forEach() per iterare attraverso ogni livello nella raccolta.

Si noti inoltre che è necessario chiamare source.getExtent() per ottenere l'estensione di tutte le funzionalità attualmente caricate in una fonte.

Infine, i collegamenti sopra riportati sono rilevanti per la versione 3.5.0 e successive. Dovrai adattare il tuo codice per lavorare con gli oggetti ol.source.Vector invece degli oggetti sperimentali (e ora rimossi) ol.source.GeoJSON. Vedi lo 3.5.0 release notes per dettagli sull'aggiornamento alla nuova API vettoriale.