Установка текущего местоположения пользователя для locationpicker.jquery.js

Question

Я использую locationpicker.jquery.js и im пытаюсь предоставить переменные по долготе и широте перед тем, как он загрузится, чтобы пользователь мог загружать его или ее конкретное местоположение.

$('.map').locationpicker({ 
     location: { 
      latitude: 10.621760, 
      longitude: 121.107015 
     }, 
     radius: 10, 
     inputBinding: { 
      latitudeInput: $('.map-lat'), 
      longitudeInput: $('.map-lon'), 
      radiusInput: $('.map-radius'), 
      locationNameInput: $('.map-address'), 
      scrollwheel: true 
     }, 
     enableReverseGeocode: true 
    }); 

    $(document).ready(function() { 
     navigator.geolocation.getCurrentPosition(showPosition); 
     function showPosition(position) { 
      $('.map-lat').val(position.coords.latitude); 
      $('.map-lon').val(position.coords.longitude); 
     } 
    }); 

Я попытался поставить селекторы jquery и поместить их в переменные для широты и долготы. Я попытался установить скрытое поле ввода и передать их широте и долготе; но они просто терпят неудачу. Есть ли что-то, что я могу сделать, чтобы сделать загрузку locationpicker в местоположении пользователя? широта и долгота, похоже, не принимают никаких других типов переменных, кроме чисел.

Answer 1

Я думаю, что проблема, с которой вы сталкиваетесь, заключается в том, что getCurrentLocation является асинхронным процессом. Это означает, что вам нужно загрузить карту после завершения этого процесса.

$(document).ready(function() { 
    navigator.geolocation.getCurrentPosition(showPosition); 
    function showPosition(position) { 
     var lat = position.coords.latitude; 
     var lng = position.coords.longitude; 
     $('.map-lat').val(lat); 
     $('.map-lon').val(lng); 
     buildMap(lat, lng); 
    } 
}); 

Pass в lat и lng аргументов и преобразовать их в числа с плавающей точкой (+lat ...), в противном случае использовать значения по умолчанию.

function buildMap(lat, lng) { 
    $('.map').locationpicker({ 
    location: { 
     latitude: +lat || 10.621760, 
     longitude: +lng || 121.107015 
    }, 
    radius: 10, 
    ... 
} 

Answer 2

Теперь getCurrentPosition() и watchPosition() больше не работать на небезопасном происхождении. Чтобы использовать эту функцию, вам следует переключить приложение в безопасное происхождение, например HTTPS.