图像在 osf 层顶部的静态图像层上显示错误

Question

我按照 openlayers 书中的 example 在 osf 层上添加静态图像。它有效，但我的图像 (256x256) 显示为矩形。我尝试使用投影坐标并查看了此处的其他帖子，但我无法理解为什么图像未显示为正方形：

// Create map
var map = new ol.Map({
  target: 'map', // The DOM element that will contains the map
  renderer: 'canvas', // Force the renderer to be used
  layers: [
    // Add a new Tile layer getting tiles from OpenStreetMap source
    new ol.layer.Tile({
      source: new ol.source.OSM()
    })
  ],
  // Create a view centered on the specified location and zoom level
  view: new ol.View({
    center: ol.proj.transform([16.3725, 48.208889], 'EPSG:4326', 'EPSG:3857'),
    zoom: 4
  })
});

// Create an image layer
var imageLayer = new ol.layer.Image({
  opacity: 0.75,
  source: new ol.source.ImageStatic({
    attributions: [
      new ol.Attribution({
        html: ''
      })
    ],
    url: 'https://placebear.com/256/256',
    imageSize: [256, 256],
    projection: map.getView().getProjection(),
    imageExtent: ol.extent.applyTransform(
      [0, 0, 16.3725, 48.208889], ol.proj.getTransform("EPSG:4326", "EPSG:3857"))
  })
});

map.addLayer(imageLayer);

Answer 1

ol.source.ImageStatic 用于在地图上放置地理参考图像（例如历史地图的扫描图）。这是你的想法吗？如果您只想显示图像并将其锚定到地图上的某个位置，您最好使用 ol.Overlay 或 ol.layer.Vector 以及具有 ol.style.Icon.[=16= 的特征]

也就是说，只有当 ol.source.ImageStatic 上的 imageExtent 设置在投影地图视图上显示为正方形时，您的图像才会显示为正方形。

图像在 osf 层顶部的静态图像层上显示错误

Image is displayed wrong on static image layer on top of osf layer

javascript

openlayers-3