OpenLayers基本标记

Question

我正在使用最新的CDN版本的OpenLayers，但我正在努力为我的地图添加一个标记。这是我到目前为止所拥有的...(为了保护客户端隐私，省略了一些变量(

var map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
})
],
view: new ol.View({
center: ol.proj.fromLonLat([long, lat]),
zoom: 14
})
});
//Adding a marker on the map
var marker = new ol.Feature({
geometry: new ol.geom.Point(
ol.proj.fromLonLat([long, lat])
),
name: name,
});
var iconStyle = new Style({
image: new Icon(({
anchor: [0.5, 46],
anchorXUnits: 'fraction',
anchorYUnits: 'pixels',
src: icon_src
}))
});
marker.setStyle(iconStyle);
var vectorSource = new ol.source.Vector({
features: [marker]
});
var markerVectorLayer = new ol.layer.Vector({
source: vectorSource,
});
map.addLayer(markerVectorLayer);

<div id="map" class="map" style="width:1022px;height:240px;margin-top:15px;"></div>

我在控制台中得到"未定义样式"，然后如果我尝试导入样式，如示例中所示，它提到导入只能在模块顶部完成......我认为它需要 webpack 或类似的东西，我很确定我的网站不会运行它。我只需要一个非常基本的地图标记，比如红色的谷歌地图图标，没什么花哨的。

Answer 1

CDN 版本的 OL5 的语法与 OL4 相同

var iconStyle = new ol.style.Style({
image: new ol.style.Icon(({

为版本 4 API 添加书签可能很有用，但始终与版本 5 交叉检查，以防发生其他更改 http://openlayers.org/en/v4.6.5/apidoc/index.html