在Open Layer Map中添加标记可以通过以下步骤完成:
<div id="map"></div>
var map = new ol.Map({
target: 'map',
view: new ol.View({
center: ol.proj.fromLonLat([经度, 纬度]),
zoom: 缩放级别
})
});
var marker = new ol.Overlay({
position: ol.proj.fromLonLat([经度, 纬度]),
positioning: 'center-center',
element: document.getElementById('marker'),
stopEvent: false
});
map.addOverlay(marker);
其中,经度
和纬度
分别表示标记的经度和纬度坐标,marker
是一个HTML元素,可以自定义标记的图标样式。
marker
元素上,例如:.marker {
background-image: url('marker.png');
width: 32px;
height: 32px;
margin-left: -16px;
margin-top: -16px;
}
然后,在创建标记对象时,将element
属性指定为具有该CSS类的HTML元素。
至此,已经成功将标记添加到Open Layer Map中。可以根据需要,重复以上步骤添加更多的标记。
领取专属 10元无门槛券
手把手带您无忧上云