Javascript 如何在openlayers3中更改图像颜色？

我是openlayers3的新手。我将点显示为图像，但我想动态更改图像的颜色。是否可以在openlayers3中使用，或者在openlayers3中使用任何其他功能，如canvas

var iconStyle = new ol.style.Style({ 
    image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({
         anchor: [0.5, 46], 
         anchorXUnits: 'fraction', 
         anchorYUnits: 'pixels', 
         src: 'data/icon.png' 
    })) 
}); 

作为起点，他们使用透明PNG和

ol.Color

选项来拥有多个彩色点，我尝试过这样改变颜色，但没有成功

var london=新的ol.功能({
几何：新的ol.geom.Point（LONLAT（[-0.12755,51.507222]）的ol.proj
});
伦敦风格（新ol风格）({
图片：新的ol.style.Icon（/**@type{olx.style.IconOptions}*/({
颜色：“#ff0000”，
交叉源：“匿名”，
src:'https://openlayers.org/en/v4.1.1/examples/data/dot.png'
}))
}));
var vectorSource=新的ol.source.Vector({
特写：[伦敦]
});
var vectorLayer=新ol.layer.Vector({
来源：矢量源
});
var rasterLayer=新ol.layer.Tile({
来源：new ol.source.TileJSON({
网址：'https://api.tiles.mapbox.com/v3/mapbox.geography-class.json?secure',
交叉源：“”
})
});
var map=新ol.map({
图层：[光栅图层，矢量图层]，
目标：document.getElementById（'map'），
视图：新ol.view({
中心：Lonlat的其他项目（[2.896372,44.60240]），
缩放：3
})
});
map.on（'singleclick'，function（event）{//使用'pointermove'捕捉鼠标在功能上的移动
map.forEachFeatureAtPixel（event.pixel，函数（feature，layer）{
/*获取当前图像实例及其颜色*/
var image=feature.getStyle（）.getImage（）；
log（image.getColor（））；
/*颜色存储在image.i中，但没有setter*/
控制台日志（image.i）；
/*尝试强制更改颜色：*/
image.i=[0,255,0,1]；
/*在图层上调度changed（）事件，以强制重新加载样式*/
层。已更改（）；
console.log（image.getColor（））；//记录新的颜色，但不起作用。。。
});
});

您需要另一个图像来替换原始图像，但是的，这是可能的。你应该共享你正在使用的代码以获得更具体的帮助。我不想用其他具有不同颜色的图像替换原始图像。我想用不同的颜色使用相同的图像var iconStyle=new ol.style.style（{image:new ol.style.Icon（/**@type{olx.style.IconOptions}*/（{anchor:[0.5,46]，anchorXUnits:'france'，anchorYUnits:'pixels'，src:'data/Icon.png'}）；据我所知，您无法在
ol.style.Icon
对象中更改PNG的颜色。如果我们谈论的是
img
标签，那么您可以使用它来实现类似的功能；但是我想在
ol
对象中没有办法做到这一点。