Javascript 对象数组

Question

我一直在学习本教程，并想出了如何将地图居中放置在我想要的位置以及如何在我想要的位置放置标记。

https://medium.com/attentive-ai/working-with-openlayers-4-part-2-using-markers-or-points-on-the-map-f8e9b5cae098

但是我需要添加不止一个标记。在文章中它说“如果你想添加多个标记，你可以将多个特征对象数组添加到源对象的特征键，这样你就可以在地图上显示多个标记。"，但我不知道该怎么做。有人可以帮忙吗？

编辑 1：

我正在使用 ASP.Net C# 代码从数据库中检索坐标并生成 javascript，如下所示：

strMapScript += "<script type=\"text/javascript\">" + Environment.NewLine;
strMapScript += "var baseMapLayer = new ol.layer.Tile({" + Environment.NewLine;
strMapScript += "source: new ol.source.OSM()" + Environment.NewLine;
strMapScript += "});" + Environment.NewLine;
strMapScript += "var map = new ol.Map({" + Environment.NewLine;
strMapScript += "target: 'map'," + Environment.NewLine;
strMapScript += "layers: [ baseMapLayer]," + Environment.NewLine;
strMapScript += "view: new ol.View({" + Environment.NewLine;
strMapScript += "center: ol.proj.fromLonLat([??.264861,??.0527032]), " + Environment.NewLine;
strMapScript += "zoom: 16" + Environment.NewLine;
strMapScript += "})" + Environment.NewLine;
strMapScript += "});" + Environment.NewLine;
//Adding a marker on the mapvar
foreach (DataRow drCoordinate in dtblCoordinates.Rows)
{
  strMapScript += "marker = new ol.Feature({geometry: new ol.geom.Point(ol.proj.fromLonLat(" + Convert.ToString(drCoordinate["Coords"]) + ")),});" + Environment.NewLine;
  strMapScript += "var vectorSource = new ol.source.Vector({features: [marker]});" + Environment.NewLine;
  strMapScript += "var markerVectorLayer = new ol.layer.Vector({source: vectorSource,});" + Environment.NewLine;
  strMapScript += "map.addLayer(markerVectorLayer);" + Environment.NewLine;
}
strMapScript += "</script>";

编辑 2：

根据您的评论和回答，我将代码的最后一部分修改为如下所示，并且有效：

//Adding a marker on the mapvar
foreach (DataRow drCoordinate in dtblCoordinates.Rows)
{
  strMapScript += "marker" + Convert.ToString(drCoordinate["Id"]) + " = new ol.Feature({geometry: new ol.geom.Point(ol.proj.fromLonLat(" + Convert.ToString(drCoordinate["Coords"]) + ")),});" + Environment.NewLine;
  lstMarkers.Add("marker" + Convert.ToString(drCoordinate["Id"]) + "");
}
strMapScript += "var vectorSource = new ol.source.Vector({features: [" + String.Join(",",lstMarkers) + "]});" + Environment.NewLine;
strMapScript += "var markerVectorLayer = new ol.layer.Vector({source: vectorSource,});" + Environment.NewLine;
strMapScript += "map.addLayer(markerVectorLayer);" + Environment.NewLine;

Answer 1

假设您有 marker1 和 marker2 标记：

var vectorSource = new ol.source.Vector({
  features: [marker1, marker2]
});

Answer 2

你可以这样做

var marker1 = new ol.Feature({
  geometry: new ol.geom.Point(
    ol.proj.fromLonLat([-74.006,40.7127])
  ),  // Cordinates of New York's site
});
var marker2 = new ol.Feature({
  geometry: new ol.geom.Point(
    ol.proj.fromLonLat([-14.006,40.7127])
  ),  // Cordinates of New York's center
});
var marker3 = new ol.Feature({
  geometry: new ol.geom.Point(
    ol.proj.fromLonLat([-64.006,40.7127])
  ),  // Cordinates of New York's Town Hall
});

var vectorSource = new ol.source.Vector({
  features: [marker1,marker2,marker3]
});

Javascript 对象数组

Javascript objects array

javascript

arrays

openlayers