помощью OpenLayers 3 зум в сочетании степени

Я использую openlayers 3 для создания карты с векторными объектами сверху. Пока все идет хорошо.

У меня есть несколько векторных слоев, сгруппированных в переменной под названием 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')];
                }
                })


            ]
})
Теперь я хочу каким-то образом перебрать переменные проекта, перебрать его слои один за другим, получить экстент каждого слоя объектов и остановиться, когда будет достигнут последний слой. Затем я хочу увеличить масштаб до этой комбинированной степени.

Это моя базовая настройка (я не очень хорошо разбираюсь в javascript и петли): 

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

Есть идеи, как я могу заставить это работать?

1 9
openlayers-3

1 ответ:

Вы должны быть в состоянии сделать это: 

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

Используйте ol.extent.createEmpty() функция для инициализации экстента. Затем пройдите цикл по коллекции слоев и используйте ol.extent.extend() чтобы создать экстент, включающий все объекты во всех ваших векторных источниках. Наконец, установите вид карты в этом объеме.

Есть несколько вещей, чтобы отметить здесь. Тот самый group.getLayers() метод возвращает значение ol.Collection из слоев. Это похоже на обычный JavaScript Array, за исключением того, что это заметный. Вы можете использовать collection.forEach() метод для итерации через каждый слой в коллекции.

Также обратите внимание, что вы должны позвонить source.getExtent() чтобы получить экстент всех загруженных в данный момент объектов в исходном коде.

Наконец, ссылки выше относятся к версии 3.5.0 и выше. Вам нужно будет адаптировать свой код для работы с объектами ol.source.Vector вместо экспериментальных (а теперь удаленных) объектов ol.source.GeoJSON. Смотрите3.5.0 примечания к выпуску для получения подробной информации об обновлении новый векторный интерфейс API.

19