osf图层

时间:2017-09-30 22:50:12

标签: javascript openlayers-3

我按照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);

1 个答案:

答案 0 :(得分:1)

ol.source.ImageStatic用于在地图上放置地理参考图像(例如,历史地图的扫描)。这是你的想法吗?如果您只想显示图片并将其锚定到地图上的某个位置,则最好使用ol.Overlay或带有ol.layer.Vector功能的ol.style.Icon

也就是说,如果imageExtent上的ol.source.ImageStatic设置在投影地图视图上的正方形,则您的图片只会显示为方形。