openlayers 3缩放到组合范围

Posted 2023-02-16

【中文标题】openlayers 3缩放到组合范围

【英文标题】：openlayers 3 zoom to combined extent

【发布时间】：2015-07-19 04:53:50

【问题描述】：

我正在使用 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());

关于如何让它发挥作用的任何想法？

【问题讨论】：

我不太了解范围以创建答案，但我认为在您的循环中您可以使用 ol.extent.getBottomLeft 和 ol.extent.getTopRight 作为图层范围。存储左下角的最小值和右上角的最大值，并使用它们来创建新范围。

怎么样？可以试试吗？

【参考方案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 对象。有关升级到新矢量 API 的详细信息，请参阅 3.5.0 release notes。

【讨论】：

不知何故我无法将对象加载到新的 ol.source.vector 中？

new ol.layer.Vector( title: 'Natuurcompensatie Gasselsbroek', source: new ol.source.Vector( url: NatuurcompensatieGasselsbroek, format: new ol.format.GeoJSON() ), style: function(feature, resolution) return lookup[feature.get('landschapselement')]; ),

我也试过object: NatuurcompensatieGasselsbroek

从3.8.0开始应该是map.getView().fit(extent, map.getSize());

my_vector_layer.getSource().getExtent() 如果图层不可见，将返回无穷大，这意味着我们在添加到地图时为该矢量图层设置了一些最大分辨率。有什么解决办法吗？