我正试图从大约300个经纬度坐标的表中在openlayers地图上绘制大约300个点。我所发现的只是他们网站上的绘图功能，但它可以通过用户点击鼠标绘制点，而不是自动绘制。有没有一种方法可以根据代码在地图上绘制一个点？非常感谢。
要在地图上绘制点(或任何其他几何体(，只需要
- 创建一个源，在本例中为矢量源，其中包含要绘制的特征
- 使用步骤1中的源和您喜欢的样式创建一个层，在本例中为矢量层
- 将图层添加到地图中
这就是你所需要做的。看看我为你做的例子，它生成了300个随机点特征，然后按照我之前描述的步骤操作。
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.2.1/css/ol.css" type="text/css">
<style>
.map {
height: 400px;
width: 100%;
}
</style>
<script src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.2.1/build/ol.js"></script>
<title>Random Points From Code</title>
</head>
<body>
<h2>300 Random Points From Code</h2>
<div id="map" class="map"></div>
<script type="text/javascript">
// generate 300 random points features
const getRandomNumber = function (min, ref) {
return Math.random() * ref + min;
}
const features = [];
for (i = 0; i < 300; i++) {
features.push(new ol.Feature({
geometry: new ol.geom.Point(ol.proj.fromLonLat([
-getRandomNumber(50, 50), getRandomNumber(10, 50)
]))
}));
}
// create the source and layer for random features
const vectorSource = new ol.source.Vector({
features
});
const vectorLayer = new ol.layer.Vector({
source: vectorSource,
style: new ol.style.Style({
image: new ol.style.Circle({
radius: 2,
fill: new ol.style.Fill({color: 'red'})
})
})
});
// create map and add layers
const map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
}),
vectorLayer
],
view: new ol.View({
center: ol.proj.fromLonLat([-75, 35]),
zoom: 2
})
});
</script>
</body>
</html>我用以下代码在OpenLayers中的映射中添加了一个点：
创建点几何
var point = new ol.geom.Point([545377.5290934666, 6867785.761987235]);
使用点几何创建特征
var feature = new ol.Feature({
geometry: point
});
创建一个矢量层来保存点特征
var vectorLayer = new ol.layer.Vector({
source: new ol.source.Vector({
features: [feature]
})
});
将矢量稍后添加到地图：
map.addLayer(vectorLayer);