如何使用光栅源类型?

How to use the Raster source type?

TL;DR: 如何在 OL3 中使用光栅源?如何使用它显示任何东西? 一个简单的工作示例将是完美的。

============================================= =

我正在尝试使用 ol.source.Raster 可视化海拔数据。

虽然我首先尝试做的是使整个地图具有如下特定颜色:

var bing = new ol.source.BingMaps({key: '%key%', imagerySet: 'Aerial'});
var raster = new ol.source.Raster({
    sources: [bing],
    operation: function(pixels, data) {
        return (0, 255, 0, 128);
    },
});
map = new ol.Map({
    layers: [
        new ol.layer.Tile({source: bing}),
        new ol.layer.Image({source: raster})
    ],
    target: 'ol-map',
    view: new ol.View({
        center: ol.proj.transform([-1, 52], 'EPSG:4326', 'EPSG:3857'),
        zoom: 6
    })
});

我希望整张地图都是绿色的。

但是,这没有任何作用。如中,它显示了 bing 图层,但不显示栅格图层。或者栅格层可能由于这段代码而没有包含任何东西,我不知道。

我试过在 ol3 网站上查看 the examples,但没有帮助。事实上,在单击它们的编辑按钮并被带到 JSFiddle 时,它​​们似乎没有呈现任何东西。也许这是 JSFiddle 的问题。所以我复制了假定的源代码,并在 .html 文件中尝试了 运行。加载了 ol3 地图对象,但没有别的,很有趣。

根据上下文,我会使用 ol3 中的地理定位 API 来计算图块的高程颜色并在栅格图层中渲染它们。

函数operation中的值return必须是数组(可以参考linkhttp://openlayers.org/en/latest/apidoc/ol.html#.RasterOperation)。您可以更改栅格

var raster = new ol.source.Raster({
sources: [bing],
operation: function(pixels, data) {
    return [0, 255, 0, 128];
},
});