javascript - 使用谷歌距离矩阵的位置

Question

我是谷歌地图距离矩阵的新手。但我需要它来计算多个位置之间最有效的路线。

然而，使用 jsfiddle 示例，我什至可以让它创建一条包含我所在地区位置的路线:

1. My Js fiddle
2. Example js Fiddle tha I used as base

基本上将目的地更改为:

var origin = "Aeroporto da Madeira"
var destinations = [
    "Hotel Four Views Baía, Rua das Maravilhas, Funchal",
    "R. José Joaquim da Costa 112, 9325-031 Estreito De Câmara, Portugal",
    "Q.ta de São João, 2735-521, Portugal"];

这些地方存在，如果我在谷歌地图上搜索就会出现。这可能是一个非常愚蠢的问题，但我做错了什么？

Answer 1

地址可以进行地理编码这一事实并不意味着可以计算到另一个位置的路线。

在您的情况下，起点位于马德拉岛(一个岛屿)，但最后一个目的地未位于马德拉岛(可能无法计算行车路线……显然没有可用的渡轮……，您的由于试图访问 undefined variable ，函数停止运行 routes.elements[i].duration.value)

在访问它的属性之前检查元素的状态

var map;
var geocoder;
var origin = "Aeroporto da Madeira"
var destinations = [
  "Hotel Four Views Baía, Rua das Maravilhas, Funchal",
  "R. José Joaquim da Costa 112, 9325-031 Estreito De Câmara, Portugal",
  "Q.ta de São João, 2735-521, Portugal"
];
var directionsDisplay;
var directionsService = new google.maps.DirectionsService();

function calculateDistances() {
  var service = new google.maps.DistanceMatrixService();
  service.getDistanceMatrix({
    origins: [origin], //array of origins
    destinations: destinations, //array of destinations
    travelMode: google.maps.TravelMode.DRIVING,
    unitSystem: google.maps.UnitSystem.METRIC,
    avoidHighways: false,
    avoidTolls: false
  }, callback);
}

function callback(response, status) {
  if (status != google.maps.DistanceMatrixStatus.OK) {
    alert('Error was: ' + status);
  } else {
    //we only have one origin so there should only be one row
    var routes = response.rows[0];

    //need to find the shortest 
    var lowest = Number.POSITIVE_INFINITY;
    var tmp;
    var shortestRouteIdx = -1;
    var resultText = "Possible Routes: <br/>";
    for (var i = routes.elements.length - 1; i >= 0; i--) {
      //do  we got a result for the element?
      if (routes.elements[i].status === google.maps.DistanceMatrixElementStatus.OK) {
        tmp = routes.elements[i].duration.value;
        resultText += "Route " + destinations[i] + ": " + tmp + "<br/>";
        if (tmp < lowest) {
          lowest = tmp;
          shortestRouteIdx = i;
        }
      }
    }
    //log the routes and duration.
    document.getElementById('results').innerHTML = resultText;
    if (shortestRouteIdx > -1) {
      //get the shortest route
      var shortestRoute = destinations[shortestRouteIdx];
      //now we need to map the route.
      calculateRoute(origin, shortestRoute)
    } else {
      alert('no route available');

    }

  }
}

//Calculate the route of the shortest distance we found.
function calculateRoute(start, end) {
  var request = {
    origin: start,
    destination: end,
    travelMode: google.maps.TravelMode.DRIVING
  };
  directionsService.route(request, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(result);
    }
  });
}

function initialize() {
  directionsDisplay = new google.maps.DirectionsRenderer();
  var centerPosition = new google.maps.LatLng(32.670159, -16.978268);
  var options = {
    zoom: 12,
    center: centerPosition,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  map = new google.maps.Map(document.getElementById('map'), options);
  directionsDisplay.setMap(map);
  calculateDistances();
}

google.maps.event.addDomListener(window, 'load', initialize);

html,
body,
#map {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}
#results {
  position: fixed;
  top: 0;
  right: 0;
  background: gold;
}

<div id="map"></div>
<div id="results"></div>
<script src="https://maps.googleapis.com/maps/api/js?v=3"></script>