localhost上的google距离矩阵

时间:2016-12-05 23:46:45

标签: javascript google-maps google-distancematrix-api

我正在尝试使用谷歌距离矩阵来查找从一个来源到一个目的地的距离和时间。

我正在调用函数

$('#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

  • No&#39; Access-Control-Allow-Origin&#39;标题出现在请求的上 资源。起源&#39; http://localhost:60197&#39;因此不允许
    访问。

还有两个警告

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

出了什么问题,或者找到了实现所需输出的正确方法(两点之间的距离和时间)。

1 个答案:

答案 0 :(得分:1)

请勿在客户端使用javascript中的DistanceMatrix web service,请使用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.
}

});