Javascript, чтобы вернуть адрес пользователя с помощью API Карт Google

Итак; Я разрабатываю это веб-приложение, которое работает на основе местоположения пользователя.Javascript, чтобы вернуть адрес пользователя с помощью API Карт Google

Часть, которая находит координаты и часть, которая преобразует эти координаты в адрес, работает как индивидуально. Однако переменная из первой функции, похоже, не переходит к второй функции, и я не могу понять, почему.

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script> 

<script type="text/javascript"> 

var coordinates; 


function getCoordinates(){ 

    var options = { 
    enableHighAccuracy: true, 
    timeout: 4500, 
    maximumAge: 0 
    }; 

    function success(pos) { 
    var crd = pos.coords; 

    console.log('Enlem : ' + crd.latitude); 
    console.log('Boylam: ' + crd.longitude); 
    console.log('Hata Payı ' + crd.accuracy + ' metre.'); 

    coordinates = new google.maps.LatLng(crd.latitude, crd.longitude); 
    alert(coordinates); 
    return coordinates; 

    }; 

    function error(err) { 
    console.warn('HATA(' + err.code + '): ' + err.message); 
    }; 

    navigator.geolocation.getCurrentPosition(success, error, options); 
} 


var ReverseGeocode = function() { 

    //This is declaring the Global variables 

    var geocoder, map, marker; 

    //This is declaring the 'Geocoder' variable 
    geocoder = new google.maps.Geocoder(); 

    function GeoCode(latlng) { 

     // This is making the Geocode request 
     geocoder.geocode({ 'latLng': latlng }, function (results, status) { 

      if(status !== google.maps.GeocoderStatus.OK) 
      { 
       alert(status); 
      } 
      // This is checking to see if the Geoeode Status is OK before proceeding  
      if (status == google.maps.GeocoderStatus.OK) { 

       var address = (results[0].formatted_address); 

       //This is placing the returned address in the 'Address' field on the HTML form 
       document.getElementById('Address').value = results[0].formatted_address; 


      } 
     }); 

    } 

    return { 

     Init: function() { 

      var latlng = getCoordinates(); 

      alert(latlng); 
      GeoCode(latlng); 
     }, 

    }; 

}();   


</script> 

</head> 
<body> 
    <div> 
     <input name="Address" type="text" id="Address" size="55" /> 
    </div> 
    <div> 
     <input type="button" value="Adres Bul" onclick="ReverseGeocode.Init()"> 
    </div> 
    <div id="map_canvas" style="height: 90%; top: 60px; border: 1px solid black;"> 
    </div> 
</body> 
</html>

источник

2015-07-06 Code Bunny

Одна вещь, которую я заметил, это предупреждение (latLng) - captial L - так что проблема может быть не такой, как вы думаете, просто предупреждение не так –

О, это опечатка произошла, когда я передавал код здесь. Я изменю его на то, как он находится в исходном коде. Спасибо. –

Посмотрите на мое сообщение здесь, я думаю, вам это нужно http://stackoverflow.com/questions/27203977/google-api-address-components#27226620 –

Ваша основная проблема: getCoordinates() не возвращает координаты. Поэтому вы не можете использовать его следующим образом:

var latlng = getCoordinates();

Javascript имеет асинхронный материал. Это означает, что для этого требуется javascript.

Способ обработки javascript: вы отправляете запрос, и вы предоставляете обратный вызов (функцию). Всякий раз, когда javascript готов, ваш обратный вызов будет выполнен. Позиционирование - одна из тех асинхронных вещей.

Вот краткий пример:

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script> 
    <script type="text/javascript"> 
    // this function is triggered when geolocation has found coordinates 
    function geolocationReturnedCoordinates(coordinates) { 
    document.getElementById('log').innerHTML = 
     'lat: ' + coordinates.coords.latitude + 
     '<br>lng: ' + coordinates.coords.longitude + 
     '<br>accuracy: ' + coordinates.coords.accuracy; 
    // Here would be a good place to call Reverse geocoding, since you have the coordinates here. 
    GeoCode(new google.maps.LatLng(coordinates.coords.latitude, coordinates.coords.longitude)); 
    } 

    // geocoder 
    geocoder = new google.maps.Geocoder(); 
    function GeoCode(latlng) { 
    // This is making the Geocode request 
    geocoder.geocode({'location': latlng }, function (results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
     var address = (results[0].formatted_address); 
     //This is placing the returned address in the 'Address' field on the HTML form 
     document.getElementById('Address').value = results[0].formatted_address; 
     } 
    }); 
    } 

    function search_position_and_address() { 
    // we start the request, to ask the position of the client 
    // we will pass geolocationReturnedCoordinates as the success callback 
    navigator.geolocation.getCurrentPosition(geolocationReturnedCoordinates, null, null); 
    } 
    </script> 
</head> 
<body> 
    <input type="button" value="GO" onclick="search_position_and_address()"> Get position (coordinates) of the client. -- Then look for the address 
    <div id="log"></div> 
    <input id="Address" placeholder="Address"> 
</body> 
</html>

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

Также имена функций ... Я пытаюсь сделать точку. В реальной жизни вы бы выбрали более короткое имя.

источник

2015-07-06 14:40:32

Благодарим вас за ответ, и это практично, и хороший пример использования обратных вызовов. –

Javascript, чтобы вернуть адрес пользователя с помощью API Карт Google

ответ

Смежные вопросы