具有动态原点或目的地的距离矩阵

Question

我有这个工作，只有一个“原点”标记和多个动态“目标”标记：

markerOrigin = place.geometry.location;

for (var i = 0; i < markers.length; i++) {        
    markersPosition = markers[i].getPosition();
    alert(markersPosition); //give me all the markers latlng
}

service.getDistanceMatrix({
    origins: [markerOrigin],
    destinations: [markersPosition],
    travelMode: 'DRIVING',

为什么我只是获得一个目的地标记？

Answer 1

如果需要多个结果，则需要将包含多个条目的数组传递给destinations属性的服务。目前你正在传递[markersPosition]（其中markersPosition包含一个位置）。

将markersPosition更改为数组：

var markersPosition = [];

将每个标记的位置推到它上面：

for (var i = 0; i < markers.length; i++) {
  markersPosition.push(markers[i].getPosition());
}

然后将其作为destinations属性传递给服务：

service.getDistanceMatrix({
  origins: [markerOrigin],
  destinations: markersPosition,
  travelMode: 'DRIVING'

proof of concept fiddle

代码段：

html,
body {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
}

#map {
  height: 75%;
}

<div id="output"></div>
<div id="map"></div>
<script>
  function initMap() {
    var myLatLng = {
      lat: 42.31391,
      lng: -83.2032224
    };

    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 4,
      center: myLatLng,
      mapTypeId: 'hybrid'
    });

    markerOrigin = myLatLng;
    var locations = [
    {address: "16099 Michigan Ave, Dearborn, MI 48126, USA", lat: 42.31391, lng: -83.2032224},
    {address: "Dearborn, MI, USA", lat: 42.3222599, lng: -83.1763145},
    {address: "Dearborn, MI 48126, USA", lat: 42.3382755, lng: -83.1756188},
    {address: "Wayne County, MI, USA", lat: 42.2790746, lng: -83.336188},
    {address: "Detroit Metropolitan Area, MI, USA", lat: 42.8105356, lng: -83.0790865},
    {address: "Michigan, USA", lat: 44.3148443, lng: -85.6023643}
    ]
    var markers = [];
    for (var i = 0; i < locations.length; i++) {
      var marker = new google.maps.Marker({
        position: locations[i],
        map: map
      });
      markers.push(marker);
    }
    var markersPosition = [];
    for (var i = 0; i < markers.length; i++) {
      markersPosition.push(markers[i].getPosition());
      // alert(markersPosition); //give me all the markers latlng
    }
    var service = new google.maps.DistanceMatrixService;
    service.getDistanceMatrix({
      origins: [markerOrigin],
      destinations: markersPosition,
      travelMode: 'DRIVING'
    }, function(response, status) {
      if (status !== 'OK') {
        alert('Error was: ' + status);
      } else {
        var originList = response.originAddresses;
        var destinationList = response.destinationAddresses;
        var outputDiv = document.getElementById('output');
        outputDiv.innerHTML = '';

      };

      for (var i = 0; i < originList.length; i++) {
        var results = response.rows[i].elements;
        for (var j = 0; j < results.length; j++) {
          outputDiv.innerHTML += originList[i] + ' to ' + destinationList[j] +
            ': ' + results[j].distance.text + ' in ' +
            results[j].duration.text + '<br>';
        }
      }
    });
  }
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?callback=initMap"></script>