2016-08-27 4 views
-1

Я делаю простую веб-страницу, которая берет адрес в качестве входных данных и возвращает широту и долготу для этого адреса, используя google geocodeapi. Я не могу обработать результат. Я хочу выбрать конкретный элемент, то есть широту и долготу от JSON, которые возвращаются в ответ от Google. Пожалуйста, помогите мне. Я новичок в JSON. Вот JSON:JSON синтаксический анализ с использованием javascript возвращает [object Object]

{ 
    "results" : [ 
    { 
     "address_components" : [ 
     { 
      "long_name" : "Jabalpur", 
      "short_name" : "Jabalpur", 
      "types" : [ "locality", "political" ] 
     }, 
     { 
      "long_name" : "Jabalpur", 
      "short_name" : "Jabalpur", 
      "types" : [ "administrative_area_level_2", "political" ] 
     }, 
     { 
      "long_name" : "Madhya Pradesh", 
      "short_name" : "MP", 
      "types" : [ "administrative_area_level_1", "political" ] 
     }, 
     { 
      "long_name" : "India", 
      "short_name" : "IN", 
      "types" : [ "country", "political" ] 
     }, 
     { 
      "long_name" : "482001", 
      "short_name" : "482001", 
      "types" : [ "postal_code" ] 
     } 
     ], 
     "formatted_address" : "Jabalpur, Madhya Pradesh 482001, India", 
     "geometry" : { 
     "bounds" : { 
      "northeast" : { 
      "lat" : 23.246354, 
      "lng" : 80.08003219999999 
      }, 
      "southwest" : { 
      "lat" : 23.1050362, 
      "lng" : 79.85747339999999 
      } 
     }, 
     "location" : { 
      "lat" : 23.181467, 
      "lng" : 79.98640709999999 
     }, 
     "location_type" : "APPROXIMATE", 
     "viewport" : { 
      "northeast" : { 
      "lat" : 23.246354, 
      "lng" : 80.08003219999999 
      }, 
      "southwest" : { 
      "lat" : 23.1050362, 
      "lng" : 79.85747339999999 
      } 
     } 
     }, 
     "place_id" : "ChIJfam2DxqugTkRueNDvBYGAkQ", 
     "types" : [ "locality", "political" ] 
    } 
    ], 
    "status" : "OK" 
} 

и мой код:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Geocode</title> 
</head> 
<body> 
Enter Address<input type="text" id="UserInput"> 
Go<input type="button" onclick="geoCode()"> 

<script> 

    function geoCode(){ 

     var UserInput = document.getElementById('UserInput').valueOf(); 
     var xmlhttp = new XMLHttpRequest(); 
     var ApiKey = 'AIzaSyDZP2E_5LLE6VOwIbrNImS32sAx5rsgEbU'; 
     var myArr; 

     var url = 'https://maps.googleapis.com/maps/api/geocode/json?address='+UserInput.value+'&key='+ApiKey; 

     var xhr = new XMLHttpRequest(); 
     xhr.open('GET',url,true); 
     xhr.send(); 

     xhr.onreadystatechange = processRequest; 

     function processRequest() { 
      if(xhr.readyState==4 && xhr.status==200) 
      { 
       var response = JSON.parse(xhr.responseText); 
       alert(response["results"][0][0]); 
      } 
     } 
    } 

Я попытался JSON.stringify(), но он выплевывает все данные из ответа. Как выбрать один конкретный элемент из JSON? Пожалуйста, помогите

+1

'response [" results "] [0]' не является массивом, поэтому 'response [" results "] [0] [0]' is 'undefined'. Что ты хочешь? – Leo

+0

Вы не должны анализировать (JSON.parse) полученный ответ, так как эта функция используется для преобразования строкового представления JSON в объект JSON, который является вашим случаем уже в этой форме. Вам нужно получить доступ к элементу по его пути, что-то вроде 'result [0] .formatted_address' вернет' 'Jabalpur, Madhya Pradesh 482001, India''. – FDavidov

ответ

1
<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Geocode</title> 
</head> 
<body> 
Enter Address<input type="text" id="UserInput"> 
Go<input type="button" onclick="geoCode()"> 

<script> 

    function geoCode(){ 

     var UserInput = document.getElementById('UserInput').valueOf(); 
     var xmlhttp = new XMLHttpRequest(); 
     var ApiKey = 'AIzaSyDZP2E_5LLE6VOwIbrNImS32sAx5rsgEbU'; 
     var myArr; 

     var url = 'https://maps.googleapis.com/maps/api/geocode/json?address='+UserInput.value+'&key='+ApiKey; 

     var xhr = new XMLHttpRequest(); 
     xhr.open('GET',url,true); 
     xhr.send(); 

     xhr.onreadystatechange = processRequest; 

     function processRequest() { 
      if(xhr.readyState==4 && xhr.status==200) 
      { 
       var response = JSON.parse(xhr.responseText); 
       alert(response.results[0].geometry.location.lat + " " + response.results[0].geometry.location.lng); 
      } 
     } 
    } 
Смежные вопросы