如何在 openlayers 6.x 中旋轉靜態圖像

Question

我需要在 openlayers 6 中創建和旋轉靜態圖像層。

靜態圖像的創建正在使用 url 和 imageExtent 工作，我可以在地圖內看到圖像。

new ImageLayer({
        source: new Static({
          url,
          imageExtent: [ minX, minY, maxX, maxY] })

現在，我需要旋轉這張圖片。

我決定使用Turfjs

所以我做了這個使用 Turfjs 的 transformRotate 旋轉的代碼：

 const poly = bboxPolygon([minX, minY, maxX, maxY])

  const rotatedPoly = transformRotate(poly, -extent.rotation, {})



  const leftBottom = JSON.parse(JSON.stringify(rotatedPoly.geometry.coordinates[0][0]))
  const rightBottom = JSON.parse(JSON.stringify(rotatedPoly.geometry.coordinates[0][1]))
  const rightTop = JSON.parse(JSON.stringify(rotatedPoly.geometry.coordinates[0][2]))
  const leftTop = JSON.parse(JSON.stringify(rotatedPoly.geometry.coordinates[0][3]))

  const bounds = [leftBottom, leftTop, rightTop, rightBottom]

  return new ImageLayer({
    source: new Static({
      url,
      imageExtent: bounds
    })
  })

最后一個塊代碼不起作用，我在地圖中什么也看不到。

我的坐標在 'EPSG:4326'

有什么想法嗎？

即使沒有 Turfjs，任何可能有幫助的解決方案？

Answer 1

查看 ol-ext 擴展名和ol.source.GeoImage 。

看到它在行動： https : //viglino.github.io/ol-ext/examples/layer/map.geoimage.html