Матрица расстояний с динамическим началом или назначением - PullRequest
Новая
       29

Матрица расстояний с динамическим началом или назначением

0 голосов
/ 11 сентября 2018

У меня есть этот рабочий, только один маркер "origin" и несколько динамических маркеров "destination": 

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',

Почему я просто получаю один из маркеров назначения?

1 Ответ

0 голосов
/ 11 сентября 2018

Если вы хотите получить несколько результатов, вам нужно передать массив с несколькими записями в службу для свойства 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'

подтверждение концепции скрипки

screenshot of resulting map

фрагмент кода: 

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>
...