Openlayers - 如何在 openlayers 地图中旋转 base64 图像？

Question

我将 base64 解码图像添加到 openlayer 地图。（Angular 10，Openlayers v6.4）

var src = "data:image/png;base64,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";
var imageLayer = new ImageLayer({
source: new Static({
  url: src,
  projection: 'EPSG:4326',
  imageExtent: extent,
  imageRotate : 3*Math.PI/180,
  rotation: Math.PI / 6,
}),
 });

 this.map.addLayer(imageLayer)

但这并没有旋转。 如何在 openlayers 中旋转 base64 图像？ 或另一种在 openlayers 地图中添加 base64 图像的方法？ 我无法将 ImageLayer 转换为 vectorLayer。 帮助！

Answer 1

您可以使用ol-ext ol/source/GeoImage 在地图上显示图像。
在线查看示例： https : //viglino.github.io/ol-ext/examples/layer/map.geoimage.html