0

我正在使用openlayer-3进行项目。

我想在地图上以相同的程度显示大约数百张天气图像，每次都会显示每张图像。

我的想法是我为每个图像创建了每个图像层，并将它们全部添加到地图中，每次只有其中一个可见。

地图设置：

    var map = new ol.Map({
        target: 'map',
        layers: [
            new ol.layer.Tile({
                 source: new ol.source.OSM()
            });
        ],
        view: new ol.View({
            center: center,
            zoom: zoomLevel
        }),
        controls: ol.control.defaults({
            attributionOptions: ({
                collapsible: false
            })
        }),
        interactions: ol.interaction.defaults({
            mouseWheelZoom:false
        })
    });

然后我为每个图像创建了图像层并将它们添加到地图

    var source = new ol.source.ImageStatic({
        url: imageLink,
        imageExtent: bounds,
    })
    layerName[layerIdx] = new ol.layer.Image({
        source: source,
        visible: true // false for which images not need to be visible 
    });
    map.addLayer(layerName[layerIdx]);

当我遍历所有层（通过使用setVisible()层）时出现问题，我观察到浏览器的使用内存（我检查了最新版本的 Chrome 和 FireFox）正在迅速增加。我检查了 100 张图片，浏览器使用量接近 10GB，尽管图片大小小于 1MB。

我也尝试在显示后删除冗余层（使用map.removeLayer(layerName[layerIdx])），但内存并没有减少。

因此，浏览器运行缓慢，当我在智能手机上尝试时，它就崩溃了。

非常感谢任何建议或解决方案。

如果有不清楚的地方，请告诉我。

2017 年 3 月 6 日更新：我尝试使用新版本openlayer-4，问题仍然存在。任何想法都非常感谢。

4

0 回答 0