Question

我正在尝试将我的L.polygon数据移动到另一个文件中。我正在使用jQuery从单独的文件中获取数据。看起来它应该返回我在index.html文件中将它作为L.polygon时使用的完全相同的数据，但它会返回此错误：

Invalid LatLng object: ( , undefined)

我搜索了错误，但似乎报告它的其他人使用的数据类型与我不同。

以下是完整的示例：

的index.html：

<!DOCTYPE html>
<meta charset="utf-8">
<html>
<head>
  <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.6.4/leaflet.css" />
  <script src="http://cdn.leafletjs.com/leaflet-0.6.4/leaflet.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
  <style type="text/css">
  #map {
    height: 500px;
  }
  </style>
</head>
<body>

<div id="map"></div>
<script type="text/javascript">
  var map = L.map('map').setView([33.720818, -84.240], 11);

  $.get("data/temp.csv", function(data) {
    console.log(data);
    var temp = new L.polygon(data).setStyle(defaultStyle).addTo(map);
  });
</script>

</body>
</html>

数据/ temp.csv：

[
[33.829205,-84.377261],
[33.829121,-84.377257],
[33.829039,-84.377271],
[33.828937,-84.377204],
[33.828871,-84.377122]
]

编辑：为了澄清，将以下内容添加到index.html文件中工作得很好，但是从另一个文件（上面）中引入它不起作用。

var temp = L.polygon([
  [33.829205,-84.377261],
  [33.829121,-84.377257],
  [33.829039,-84.377271],
  [33.828937,-84.377204],
  [33.828871,-84.377122]
  ]).setStyle(defaultStyle).addTo(map);

Answer 1

L.polygon()需要一组LatLng个对象。

您需要迭代数组，从每个元素中创建LatLng，或者将此列表包装在GeoJSON对象中，并使用GeoJSON类为您执行此操作。

类似的东西：

L.geoJson({"type": "Polygon", "coordinates": data}).setStyle(defaultStyle).addTo(map);

从评论中修改：事实证明L.polygon()实际上会自动将数组数组转换为LatLng数组。问题是你需要显式并传入“json”作为$.get()的最后一个参数，以确保它实际上将字符串解析为JSON，而不是返回原始字符串。

Answer 2

您可以使用JSON.parse(data)。对我来说，它有效。

Leaflet错误：无效的LatLng对象:(，undefined）

2 个答案: