如何在openlayer上的地圖上添加標記？

Question

我使用的是openlayer，但我無法在地圖上添加lat/long標記。 可否請你指出我出去一個正確的方向，我的代碼示例如下：

let map = new ol.Map({ 
    target: 'map', 
    layers: [ 
    new ol.layer.Tile({ 
     source: new ol.source.OSM() 
    }) 
    ], 
    view: new ol.View({ 
    center: ol.proj.transform([37.41, 8.82], 'EPSG:4326', 'EPSG:3857'), 
    zoom: 4 
    }) 
}) 
let layerCloud = new ol.layer.Tile({ 
    source: new ol.source.XYZ({ 
    url: api.mapTemperature() 
    }) 
}) 
map.addLayer(layerCloud) 

Answer 1

您可以通過添加與設置爲顯示針的圖像風格的新Vector層添加標記。下面的代碼將添加一個別針到地圖的中心。

const center = map.getView().getCenter(); 
const pinnedLocation = ol.proj.transform(center, 'EPSG:3857', 'EPSG:4326'); 
const feature = new ol.Feature(new ol.geom.Point(center)); 
const pinLayer = new ol.layer.Vector ({ 
    source: new ol.source.Vector ({ 
    features: [feature] 
    }), 
    style: new ol.style.Style ({ 
    image: new ol.style.Icon({ 
     src: 'http://openlayers.org/en/v3.8.2/examples/data/icon.png' 
    }) 
    }) 
}); 
map.addLayer (pinLayer);