传单 - 如何显示标记而不是折线

Question

我目前有一组使用 javascript 和 mySQL 很好地声明的纬度/经度点数组，当我使用这组数组显示为折线时，它是成功的。

var polyline= L.polyline(xxx).addTo(map);

但是当我厌倦了更换标记时，地图没有描绘任何标记。

有什么帮助吗？非常感谢:)

Answer 1

这是因为L.Polyline 将多个 lat/lng 坐标的嵌套数组作为第一个参数，L.Marker 将单个数组与 lat/lng 坐标一起使用。签名不同：

L.折线：

new L.Polyline([[-45, -45], [45, 45]], {/*options*/});

L.标记：

new Marker([-45, -45], {/*options*/});

当您将嵌套数组传递给L.Marker 时，就像上面折线中显示的那样，它会引发错误：

未捕获的类型错误：无法读取 null 的属性 'lat'

如果您想使用折线的坐标集在直线的起点和/或终点显示标记，您可以这样做：

var coordinates = [[-45, -45], [45, 45]];

var startMarker = new Marker(coordinates[0], {/*options*/});
var endMarker = new Marker(coordinates[1], {/*options*/});

正如 cmets 中所承诺的，另一种从大型数组中添加标记的更简单方法：

var coordinates = [
  [-41.31825,174.80768],
  [-41.31606,174.80774],
  [-41.31581,174.80777],
  [-41.31115,174.80827],
  [-41.30928,174.80835],
  [-41.29127,174.83841],
  [-41.33571,174.84846],
  [-41.34268,174.82877]
];

coordinates.forEach(function (coordinate) {
  new L.Marker(coordinate).addTo(map);
});

比做起来容易得多：

new L.Marker(coordinate[0]).addTo(map);
new L.Marker(coordinate[1]).addTo(map);
new L.Marker(coordinate[2]).addTo(map);
new L.Marker(coordinate[3]).addTo(map);
new L.Marker(coordinate[4]).addTo(map);
new L.Marker(coordinate[5]).addTo(map);
new L.Marker(coordinate[6]).addTo(map);
new L.Marker(coordinate[7]).addTo(map);

Plunker 上的工作示例：http://plnkr.co/edit/3dbJgb?p=preview