Я использую Google Distance Matrix API, чтобы рассчитать расстояние + время в пути от одной точки до другой.

Я хотел бы добавить выражения if..elseif..else к результату поиска расстояния, чтобы варьировать ответы в зависимости от того, насколько велики расстояния (например, <или> 10 км), но я новичок в JS и могу ' Кажется, я понял, куда вставить эти операторы в мой код. Какие-нибудь советы?

Вот мой код:

$(function(){
   function calculateDistance(origin, destination) {
      var service = new google.maps.DistanceMatrixService();
      service.getDistanceMatrix(
      {
        origins: [origin],
        destinations: [destination],
        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) {
        $('#result').html(err);
      } else {
        var origin = response.originAddresses[0];
        var destination = response.destinationAddresses[0];
        if (response.rows[0].elements[0].status === "ZERO_RESULTS") {
          $('#result').html("We can't seem to find "
                            + origin + ". Are you sure you entered a valid postcode and place?");
        } else {
          var distance = response.rows[0].elements[0].distance;
          var duration = response.rows[0].elements[0].duration;
          var distance_value = distance.value;
          var distance_text = distance.text;
          var duration_value = duration.value;
          var duration_text = duration.text;
          var kilometer = distance_text.substring(0, distance_text.length - 3);
          $('#result').html("It is " + kilometer + " kilometer from " + origin + " to " + destination + " and it takes " + duration_text + " to drive.");
        }
      }
    }

    $('#distance_form').submit(function(e){
        event.preventDefault();
        var origin = $('#origin').val();
        var destination = $('#destination').val();
        var distance_text = calculateDistance(origin, destination);
    });

  });
-2
LoCaTo 25 Фев 2018 в 22:47

1 ответ

Лучший ответ

Один из вариантов - использовать условную логику в вашей функции callback следующим образом:

function callback(response, status) {
  if (status !== google.maps.DistanceMatrixStatus.OK) {
    $('#result').html(err);
    return;
  }
  if (response.rows[0].elements[0].status !== "OK") {
    $('#result').html("We can't seem to find " + origin + ". Are you sure you entered a valid postcode and place?");
    return;
  }
  var origin = response.originAddresses[0];
  var destination = response.destinationAddresses[0];
  var distance = response.rows[0].elements[0].distance;
  var duration = response.rows[0].elements[0].duration;
  var distance_value = distance.value;
  var distance_text = distance.text;
  var duration_value = duration.value;
  var duration_text = duration.text;
  var kilometer = distance_text.substring(0, distance_text.length - 3);

  if (distance_value > 10000) {
    $('#result').html('Distance is greater than 10km');
  } else {
    $('#result').html('Distance is less than 10km');
  }
}

Проверка ответа выполняется в начале функции, и если запрос не возвращает желаемый статус, вы return раньше и останавливаете выполнение функции. После того, как эти операторы проверки будут исключены, вы можете извлечь все необходимые данные из ответа, а затем выполнить свои условные операторы на основе любого из извлеченных вами значений.

В моем примере это выглядит так:

if (distance_value > 10000) {
  $('#result').html('Distance is greater than 10km');
} else {
  $('#result').html('Distance is less than 10km');
}

Я проверяю, превышает ли значение расстояния 10000 м (10 км), и на основании этого показываю другой результат.

Вот JSBin с рабочим примером.

1
Iavor 3 Мар 2018 в 21:41