javascript - 使用变量设置传单圆 LatLng

Question

我在使用 latlng 变量在 Leaflet map 上创建新圆时遇到问题。

我有一个包含和输入半径的表单和一个包含几个位置的选择框，选项如下所示:

<option value="52.10953576, -0.498735399999987">Place Name</option>

单击保存按钮时，将运行以下代码:

$('#drawcircle').click(function() {
  var radius = document.getElementById("circleRadius").value;
  var e = document.getElementById("locationcoord");
  var latlng = e.options[e.selectedIndex].value;
  var radiusinmeters = cr * 1609.344;
  var circle = L.circle([latlng], radiusnmeters).addTo(map);
  drawnItems.addLayer(circle);
});

我已经使用 console.log 进行了一些调试，可以看到 latlng 变量确实包含来自选择框的正确信息。

但是，我明白了

Uncaught TypeError: Cannot read property 'lng' of null

Answer 1

您从 var latlng = e.options[e.selectedIndex].value; 获得的值是一个字符串，而不是一对坐标。

Split这个字符串获取数组中的坐标，将值转换为数字，并将其提供给 L.circle。例如，

var radiusinmeters = cr * 1609.344;
var latlng_string = e.options[e.selectedIndex].value;
var latlng_array = latlng_string
                      .split(/,\s*/) // split the value
                      .map(function(v) { return +v; }); // cast to numbers

var circle = L.circle(latlng_array, radiusnmeters).addTo(map);