2014-04-27 3 views
2

Я создал карту с OpenLayers 3, используя статическое изображение. Он использует поддельную проекцию, чтобы карта могла использовать, чтобы правильно отображать слой, поскольку он измеряется в пикселях. Это код:OpenLayers, устанавливающий положение наложения на статическом изображении

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 
}); 

Я очень новичок в этом, поэтому, если у кого-нибудь есть идея, как правильно установить положение, я буду благодарен.

ответ

2

Используя этот OpenLayers 3 map в качестве примера, я был в состоянии добавить маркер к центру вашего статического изображения со следующим:

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 
}); 
Смежные вопросы