在openlayers 6中使用tileSource.getTileGridForProjection尝试颜色操纵失败

Question

使用openlayers 6.2.1，我试图更改xyz源(如颜色操纵示例(、中瓦片的像素颜色

我首先定义了XYZ来源：

const xyz = new XYZ({
url: 'https://mbenzekri.github.io/frcommunes/fr/communes/{z}/{x}/{y}.png',
maxZoom: 12,
minZoom: 5
})

然后使用RasterSource操作颜色

const rastersource= new Raster({
sources: [ xyz ],
operation: function (pixels, data) { 
pixels[0] = pixels[0] 
pixels[1] = pixels[1] 
pixels[2] = pixels[2] 
}
})

然后是ImageLayer:

const imagelayer = new ImageLayer({
source: rastersource
})

在OSM层对象上的地图中添加此层失败，在渲染时显示消息：

TileLayer.js:160 Uncaught TypeError: tileSource.getTileGridForProjection is not a function
at CanvasTileLayerRenderer.renderFrame (TileLayer.js:160)
at TileLayer.Layer.render (Layer.js:216)
at CompositeMapRenderer.renderFrame (Composite.js:112)
at Map.PluggableMap.renderFrame_ (PluggableMap.js:1265)
at Map.<anonymous> (PluggableMap.js:186)

用具有相同xyz源代码的简单TileLayer替换imagelayer效果良好(源代码行索引.js:37(

const tilelayer = new TileLayer({
source: xyz
})

我是不是做错了什么，遗漏了一些配置？

提前感谢您的帮助或兴趣

完整代码在这里(简单示例50行(

无错误版本可在github页面上进行测试

Answer 1

您的导入错误。

import ImageLayer from 'ol/layer/Tile';

应该是

import ImageLayer from 'ol/layer/Image';