0

Distance Matrix API を使用して 2 地点間の距離を計算しようとしています。この API を使用するのはこれが初めてなので、Google ドキュメントのページで見つけたコードを文字通りコピー して自分のページに貼り付けました。しかし、どのような出力も表示されず、その理由もわかりません。これは私のページです

そして、これはソースです:

<!DOCTYPE html> 
<html> 
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

<!-- Google Api -->
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDDMkiaVfr1y0QCsx_qUsJKIBAWpkyXZrY&sensor=false">
</script>

<script type="text/javascript">
var origin1 = new google.maps.LatLng(55.930385, -3.118425);
var origin2 = "Greenwich, England";
var destinationA = "Stockholm, Sweden";
var destinationB = new google.maps.LatLng(50.087692, 14.421150);

var service = new google.maps.DistanceMatrixService();
service.getDistanceMatrix(
  {
    origins: [origin1, origin2],
    destinations: [destinationA, destinationB],
    travelMode: google.maps.TravelMode.DRIVING,
    avoidHighways: false,
    avoidTolls: false
  }, callback);

function callback(response, status) {
  if (status == google.maps.DistanceMatrixStatus.OK) 
  {
    var origins = response.originAddresses;
    var destinations = response.destinationAddresses;
    document.writeln(response.originAddresses[1]);    
  }

  else {
    document.writeln("error");

       }
  }  

</script>
</html> 
4

1 に答える 1

0

わかりました。なぜそれが機能しないのかわかりません。まず、jQueryを使用することをお勧めします。ここで見つけることができます

$(document).ready()まず、コードを関数でラップして、ページの準備ができたときに実行されるようにします。

$(document).ready(function() {
  // Everything in your original script block
  var origin1 = new google.maps.LatLng(55.930385, -3.118425);
  // etc etc      
});

第二に、どこに書いているのかがわかっていると、ドキュメントへの書き込みが非常に簡単になります。div位置データを保持するを作成します。

<body>
<div id="location"/>
</body>

第三に、あなたがグーグルからあなたの場所を持っているとき、あなたのテキストdivを一致するように変更してください:

$("#location").text(response.originAddresses[1]);

jQueryなしでドキュメントを処理することは悪夢です。このライブラリを使用することを強くお勧めします。

于 2012-08-09T09:09:22.377 に答える