Установить листовку круга LatLng с переменной - PullRequest
Новая
       15

Установить листовку круга LatLng с переменной

2 голосов
/ 14 мая 2019

У меня проблемы с созданием нового круга на карте Leaflet с переменной latlng.

У меня есть форма, которая содержит и вводит радиус, и поле выбора, содержащее несколько местоположений с параметрами, похожими на это: 

<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: Невозможно прочитать свойство 'lng' с нулевым значением

Ответы [ 2 ]

1 голос
/ 14 мая 2019

Значение, полученное из var latlng = e.options[e.selectedIndex].value;, является строкой, а не парой координат.

Разделить эту строку, чтобы получить ваши координаты в массиве, привести значения к числам и передать их в 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);
0 голосов
/ 14 мая 2019

В вашем коде переменная latlng является строкой, и L.circle принимает объект LatLng, т. Е. Один из них: 

L.latLng(<Number> latitude, <Number> longitude)
L.latLng(<Array> coords)    // [Number, Number]
L.latLng(<Object> coords)   // {lat: Number, lng: Number}

Ваша переменная latlng имеет значение ["52.10953576, -0.498735399999987"] Youнеобходимо проанализировать вашу строку, чтобы получить правильные значения

подробнее в документации Circle

...