如何使用光栅源类型

How to use the Raster source type?

本文关键字：类型 何使用      更新时间：2023-09-26

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网站上的例子，他们没有帮助。事实上，在单击它们上的Edit按钮并被带到JSFiddle时，它们似乎不呈现任何东西。也许这是JSFiddle的一个问题。因此，我复制了假定的源代码，并尝试在.html文件中运行。加载了ol3 map对象，但没有其他内容，非常有趣。

在上下文方面，我会使用ol3中的Geolocation API来计算贴图的高程颜色，并在栅格层中渲染它们。

函数operation的返回值必须是数组(可参考链接http://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];
},
});
相关文章：