2

Google 距離行列を使用して、あるソースから 1 つの目的地までの距離と時間を調べようとしています。

関数を呼び出しています

$('#postCode').change(function () {
    var address = "sydney";
    var source = "melbourne"
    var url = "https://maps.googleapis.com/maps/api/distancematrix/js?units=imperial&origins=" + address + "&destinations=" + source + "&key=MYKEY_HERE";
    $.get(url, function (data) {
        window.alert(data);
    });
});

返されたデータを取得する必要があるだけですが、問題はリンクのあるページをロードするたびに発生します

<script src="https://maps.google.com/maps/api/js?sensor=false?key=MYKEY_HERE"></script>

または郵便番号フィールドの変更をトリガーすると、コンソールに次の2つのエラーが表示されます

  • Google Maps API エラー: MissingKeyMapError


  • 要求されたリソースに「Access-Control-Allow-Origin」ヘッダーがありません。したがって、オリジン「http://localhost:60197」へのアクセスは許可されていません

2つの警告もあります

util.js:210 Google Maps API 警告: NoApiKeys https://developers.google.com/maps/documentation/javascript/error-messages#no-api-keys

util.js:210 Google Maps API 警告: SensorNotRequired https://developers.google.com/maps/documentation/javascript/error-messages#sensor-not-required

何が間違っているか、または必要な出力 (2 点間の距離と時間) を達成する適切な方法は何ですか。

4

1 に答える 1

1

クライアントの Javascript からDistanceMatrix Web サービスを使用しないでください。Google Maps Javascript API v3 DistanceMatrix Serviceを使用してください。

$('#postCode').change(function () {
    var address = "sydney";
    var source = "melbourne"
var service = new google.maps.DistanceMatrixService();
service.getDistanceMatrix(
  {
    origins: [address],
    destinations: [source],
    travelMode: 'DRIVING',
    unitSystem: google.maps.UnitSystem.IMPERIAL,
  }, callback);

function callback(response, status) {
  // See Parsing the Results for
  // the basics of a callback function.
}

});

于 2016-12-05T23:55:33.727 に答える