2011-01-13 82 views
4

這裏是代碼,它獲取緯度和緯度當輸入一個位置。我相信我的代碼正確根據我的知識,但我進入一個地方後得到一個空白頁。json與谷歌地理編碼api

下面是代碼:

<html> 
<head> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 

    var url="http://maps.googleapis.com/maps/api/geocode/json?address="; 
    var query; 
    var sensor="&sensor=false"; 
    var callback="&callback=?"; 


    $("button").click(function(){ 
      query=$("#query").val(); 
      $.getJSON(url+query+sensor+callback,function(json){ 

      $('#results').append('<p>Latitude : ' + json.results.geometry.location.lat+ '</p>'); 
      $('#results').append('<p>Longitude: ' + json.results.geometry.location.lng+ '</p>'); 

}); 


    }); 
}); 


</script> 

</head> 
<body> 

<input type="text" id="query" /><button>Get Coordinates</button> 
<div id="results"></div> 

</body> 
</html> 

回答

7

你想在這裏使用JSONP。

JSONP

如果URL中包含字符串 「回調=?」 (或類似的,由服務器端API定義),request>被視爲JSONP。有關更多詳細信息,請參閱$ .ajax()中關於jsonp數據類型的討論。

重要提示:從jQuery 1.4開始,如果JSON文件包含語法錯誤,請求通常會以靜默方式失敗。

參見:http://api.jquery.com/jQuery.getJSON/

但是你調用返回平原 JSON,所以解析失敗,語法錯誤和getJSON的URL默默地失敗。

現在,當您嘗試更改地理編碼URL中使用JSONP,你既然谷歌已經相當長一段時間之前取消了JSONP支持得到404錯誤:

總之:
你不能簡單地使用瀏覽器JavaScript的地理編碼API,你會有在您的服務器上添加代理腳本。

即使請求會的工作,你的代碼仍然有一個錯誤在裏面:

json.results是結果的陣列,所以它沒有geometry財產。

你要訪問數組的第一個元素,以得到具有geometry財產的實際對象:

json.results[9].geometry.location.lng 
+0

我的要求是working.I與firebug.when我進入一個位置,我得到的response.I只需要解析JSONP和輸出中它。我這樣想測試它>是RGT ? – simplyblue 2011-01-13 17:48:48

15

在谷歌地圖的Javascript V3,你可以使用谷歌的訪問地理編碼服務。 maps.Geocoder類。

var myAddressQuery = 'O. J. Brochs g 16a, Bergen'; 
var geocoder = new google.maps.Geocoder(); 
geocoder.geocode(
    { address : myAddressQuery, 
     region: 'no' 
    }, function(results, status){ 
     // result contains an array of hits. 
}); 

https://developers.google.com/maps/documentation/javascript/examples/geocoding-simple

+0

太棒了,它可以在不創建地圖的情況下工作! – JayC 2012-03-16 04:23:18