2

我使用静态图像使用 OpenLayers 3 创建了一个地图。它使用假投影，因此地图可以用来正确显示以像素为单位的图层。这是代码：

var pixelProjection = new ol.proj.Projection({
  code: 'pixel',
  units: 'pixels',
  extent: [0, 0, 1389, 1070]
});


var map = new ol.Map({
  layers: [
    new ol.layer.Image({
      source: new ol.source.ImageStatic({
        url: 'http://s25.postimg.org/4o15oqbmn/jdgf.jpg',
        imageSize: [1389, 1070],
        projection: pixelProjection,
        imageExtent: pixelProjection.getExtent()
      })
    })
  ],
  target: 'map',
  view: new ol.View2D({
    projection: pixelProjection,
    center: ol.extent.getCenter(pixelProjection.getExtent()),
    zoom: 2
  }) 
});

我试图添加标记覆盖以添加更多交互但是我正在努力指定位置并且标记位于地图之外，而不是在我想要放置它的位置之内。

var marker = new ol.Overlay({
    position: [200, 200],
    element: document.getElementById('marker'),
    stopEvent: false
});

我对此很陌生，所以如果有人知道如何正确设置位置，我将不胜感激。

4

1 回答 1

2

以这个OpenLayers 3 地图为例，我可以在静态图像的中心添加一个标记，如下所示：

var iconFeature = new ol.Feature({
    geometry: new ol.geom.Point([700, 700])
});

var iconStyle = new ol.style.Style({
    image: new ol.style.Icon({
        src: 'http://ol3js.org/en/master/examples/data/icon.png'
    })
});

iconFeature.setStyle(iconStyle);

var vectorSource = new ol.source.Vector({
    features: [iconFeature]
});

var vectorLayer = new ol.layer.Vector({
    source: vectorSource
});
于 2014-05-03T04:33:33.483 回答