2015-05-08 11 views
6

Używam otwartych klocków 3 do utworzenia mapy z funkcjami wektorowymi u góry. Jak na razie dobrze.nakładki 3 powiększ powiększenie

Mam kilka warstw wektorowych, zgrupowanych w zmiennej o nazwie 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')]; 
       } 
       }) 


      ] 
}) 

Teraz chcę jakoś pętli zmiennych projecten, pętlę przez jego warstw jedna po drugiej, uzyskać stopień każdej warstwie funkcji, a zatrzyma się, gdy zostanie osiągnięta ostatnia warstwa. Następnie chcę powiększyć do tego połączonego zakresu.

To moja podstawowa konfiguracja (nie jestem dobry z JavaScript i pętle):

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

Wszelkie pomysły, w jaki sposób mogę uzyskać to do pracy?

+0

Nie znam wystarczająco dużo, aby stworzyć odpowiedź, ale myślę, że w swojej pętli można użyć ol.extent.getBottomLeft i ol.extent.getTopRight dla zakresu warstw. Przechowuj wartości minimalne lewych dolnych i maksymalnych wartości prawego górnego rogu i użyj ich, aby utworzyć nowy zakres. –

+0

Jak? Czy możesz spróbować? – user1697335

Odpowiedz

15

powinien być w stanie to zrobić:

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

Użyj funkcji ol.extent.createEmpty() zainicjować swój zakres. Następnie przejrzyj kolekcję warstw i użyj ol.extent.extend(), aby wygenerować zakres obejmujący wszystkie funkcje we wszystkich źródłach wektorowych. Na koniec dopasuj widok mapy w tym zakresie.

Jest kilka rzeczy do zapamiętania tutaj. Metoda zwraca ol.Collection warstw. Jest to podobne do zwykłego JavaScriptu Array z tym wyjątkiem, że jest możliwe do zaobserwowania. Możesz użyć metody collection.forEach() do iteracji każdej warstwy w kolekcji.

Należy również pamiętać, że należy zadzwonić pod numer source.getExtent(), aby uzyskać zasięg wszystkich aktualnie wczytanych funkcji w źródle.

Wreszcie powyższe linki dotyczą wersji 3.5.0 i nowszych. Będziesz musiał dostosować swój kod do pracy z obiektami ol.source.Vector zamiast eksperymentalnych (i teraz usuniętych) obiektów ol.source.GeoJSON. Zobacz 3.5.0 release notes, aby uzyskać szczegółowe informacje na temat aktualizacji do nowego API wektorowego.

+0

Znakomity Tim! Wielkie dzięki! – user1697335

+0

jakoś nie mogę załadować obiektu do nowego ol.source.vector? – user1697335

+0

'nowy ol.layer.Vector ({ tytuł: 'Natuurcompensatie Gasselsbroek', źródło: nowy ol.source.Vector ({ \t \t \t \t \t \t \t url: NatuurcompensatieGasselsbroek, format \t \t \t \t \t \t \t : New ol.format.GeoJSON() \t \t \t \t \t}) \t \t \t \t \t Styl funkcja (cecha, rozdzielczość) { \t \t \t \t \t \t powrotu odnośników [funkcji.get ("landschapselement")]; \t \t \t \t \t} \t \t \t \t \t}), ' – user1697335

Powiązane problemy