Open Layers 3 读取ECMWF WMS层

Question

我正在努力让 WMS 提要工作，提要在此处解释：

https://software.ecmwf.int/wiki/display/MACSUP/Accessing+public+CAMS+WMS+products

检索图层的示例URL是：

https://apps.ecmwf.int/wms/?token=public&request=GetMap&layers=composition_aod550,grid,foreground&width=600&bbox=-180,-90,180,90

但是，我不确定如何让 Open Layers 3 WMS API 读取这一层，我目前正在做：

var layer_to_return = new ol.layer.Tile({
  preload: Infinity,
  visible: true,
  source: new ol.source.TileWMS(({
    url: 'https://apps.ecmwf.int/wms/',
    params: {'LAYERS': 'composition_aod550', 'token':'public'},
    serverType: 'geoserver',
    crossOrigin: 'anonymous'
    }))
});

map.addLayer(layer_to_return);

其中似乎包含 URL 的大部分内容，但 'grid' 元素和边界框除外。我不确定为什么它不会在 OL3 中呈现。

Answer 1

我只是通过调整两件事来使它工作：

HTTPS 给我带来了跨域问题
然后，切片服务器返回未知投影（URL 请求默认为 EPSG:3587）

如果它对您有帮助，供参考，我通过以下方式解决的两个问题：将您的代码添加到 ol3 地图；试图加载它；使用浏览器开发工具查看正在生成的图块请求的 URL；在单独的选项卡中打开其中一个 URL；读取从 WMS 服务器返回的 XML 中的错误消息。

我查看了您 link 访问的网站上的功能文件，它似乎表明 EPSG:4326 可以工作。所以我尝试了这个并且成功了：

var layer = new ol.layer.Tile({
    preload: Infinity,
    visible: true,
    source: new ol.source.TileWMS({
        url: 'http://apps.ecmwf.int/wms/',
        params: {'LAYERS': 'composition_aod550', 'token':'public'},
        serverType: 'geoserver',
        crossOrigin: 'anonymous',
        projection: 'EPSG:4326'
    }),
    opacity: 0.5
});

请注意，我添加了 0.5 的不透明度。这样您就可以将其覆盖在另一个地图源上以查看国家/地区边界，例如开放的街道地图。

我在这里放了一个工作示例，具有透明度：

http://www.freytag.org.uk/snippets/cams.html

Open Layers 3 读取ECMWF WMS层

Open Layers 3 Reading ECMWF WMS layer

wms

openlayers-3