我的服务器静态地为同一对象的几个不同的PNG图像提供服务,每个图像都使用不同的光谱滤镜(例如,只有一个红色通道或一个蓝色通道)。我想展示一下那个物体的一张光滑的、假彩色的地图。为此,我创建了三个独立的图像源,如下所示:
extent = [0, 0, ncols, nrows];
pixelProjection = new ol.proj.Projection({
code: 'some-image',
units: 'pixels',
extent: extent
});
rsource = new ol.source.ImageStatic({
url: "static/imgs/band_1.png",
projection: pixelProjection,
imageExtent: extent
});
gsource = new ol.source.ImageStatic({
url: "static/imgs/band_2.png",
projection: pixelProjection,
imageExtent: extent
});
bsource = new ol.source.ImageStatic({
url: "static/imgs/band_3.png",
projection: pixelProjection,
imageExtent: extent
});接下来,我使用这些源作为栅格源的输入,栅格源可以组成它们:
rgbSources = [rsource, gsource, bsource];
raster = new ol.source.Raster({
sources: rgbSources,
operation: function(bands, data) {
var rband = bands[0];
var gband = bands[1];
var bband = bands[2];
var composed = [
rband[0],
gband[0],
bband[0],
255
];
return composed;
}
});然后,我创建一个使用此栅格作为其源的图层:
colorLayer = new ol.layer.Image({
source: raster
});最后,我可以创建一个地图并将我的栅格层添加到地图中:
var map = new ol.Map({
target: 'map',
view: new ol.View({
center:ol.extent.getCenter(extent),
projection: pixelProjection,
zoom: 1.5
})
});
map.addLayer(colorLayer);到目前一切尚好!这将按预期显示图像的彩色版本。当用户通过输入要从中拉出的新通道索引来触发对颜色通道的改变时,出现了问题。我像这样处理蓝色通道的变化:
var index = 4; // actually gets passed in from user
bsource = new ol.source.ImageStatic({
url: "static/imgs/band_" + index + ".png",
projection: pixelProjection,
imageExtent: extent
});
rgbSources[2] = bsource; // this was in global scope from before
raster.sources = rgbSources; // as was this预期的行为是地图会立即改变颜色,或者至少在我放大或平移时会改变,但这两种情况都不会发生。我根本无法让新的颜色出现。我是不是更新错了东西?也许raster.sources字段有一个我找不到的相关setter函数?
发布于 2016-04-12 09:09:58
找到解决方案了!看起来直接设置栅格源是不允许的,但是设置图层的源是允许的。所以不幸的是,我必须创建一个新的栅格对象(完全是新的源),但至少我不需要一个新的层:
raster = new ol.source.Raster({
sources: rgbSources,
operation: composeBands
});
colorLayer.setSource(raster);接受我自己的答案,但愿意接受别人的解决方案,如果这意味着我不需要创建新的源码。
https://stackoverflow.com/questions/36561695
复制相似问题