2011-01-13 24 views
4

場所を入力したときに緯度と経度を取得するコードです。私は自分の知識に基づいて正しいコードを信じていますが、場所に入ると空白のページが表示されます。ここでjson googleジオコーディング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で定義されているように)、リクエスト>は代わりにJSONPとして扱われます。詳細については、$ .ajax()のjsonpデータ型の説明を参照してください。

重要:jQuery 1.4以降、JSONファイルに構文エラーが含まれていると、通常は要求が黙って失敗します。

参照:http://api.jquery.com/jQuery.getJSON/

しかし、あなたはプレーン JSONリターンを呼んでいるので、構文解析、構文エラーで失敗し、getJSONは黙って失敗したURL。

を:今、あなたはJSONPを使用するジオコードURLを変更しようとすると、あなたが 404エラーを取得し、Googleはかなりしばらく前にJSONPのサポートを削除しているので

短く:
ブラウザのJavaScriptからジオコードAPIを使用することはできません。サーバーにプロキシスクリプトを追加します。

とにもリクエストが働くならば、あなたのコードはまだそれにバグがあります。

json.resultsは、結果の配列あるので、それは何のgeometry性質を持っていません。

あなたはgeometry性質を持っている実際のオブジェクトを取得するためには、配列の最初の要素にアクセスする必要があります:GoogleマップのJavascript V3で

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

私の要求はworking.Iは私はresponse.IだけでJSONPを解析し、it.Iがそう思うouputをする必要があります場所を入力firebug.whenでそれをテストしている>それはRGTです? – simplyblue

15

は、Googleを使用してジオコーディングサービスにアクセスすることができます。ジオコーダークラス。

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

+1

ただし、地図なしで使用することは規約違反です。 – NexusRex

関連する問題