Как определить, находится ли адрес за пределами МКАД и, если нет, рассчитать расстояние до него.

Так уж выходит, что темы большинства моих статей так или иначе совпадают в тем, чем я в данный момент занимаюсь. Соответственно не так давно меня попросили написать скрипт расчета стоимости доставки, который должен был работать следующим образом:

  • Если адрес доставки находится внутри МКАД, то цена фиксированная, допустим 400
  • Если адрес находится за пределами МКАД, то цена сразу становится 700, кроме того, за каждые 10км удалённости от МКАД к цене добавляется ещё 100.

Из этих двух условий понятно, что основная задача — определить, находится ли адрес внутри МКАД, и если нет, то рассчитать кратчайшее расстояние до него, и не просто прямой отрезок, а маршрут по дороге.

В этой статье вас ждут два готовых скрипта с формой, которые вы просто можете сохранить себе на рабочий стол в виде html-файла и они уже будут работать, отличие между ними в том, что второй скрипт просто определяет, находится ли адрес внутри МКАД и рассчитывает расстояние, а первый ещё и показыват маршрут на Яндекс Картах.

Сначала небольшое видео о том, как это будет работать.

С отображением кратчайшего расстояния на карте

Этот код не просто рассчитывает кратчайшее расстояние, но и чертит маршрут на карте. В коде я постарался оставить как можно больше комментариев, чтобы всё было просто и понятно.

Крайтчайший маршрут от МКАД до заданного адреса

И, как я уже говорил, вы можете просто скопировать его 1 в 1, сохранить на рабочий стол и всё у вас будет работать. А потом, когда разберетесь, что к чему, уже без проблем сможете интегрировать его в рассчет стоимости доставки интернет-магазина и т.п.

Этот код доступен только для зарегистрированных пользователей.

Регистрация Войдите на сайт, если вы уже зарегистрированы »

Несколько комментариев по коду:

  • Для того, чтобы не отображать маршрут на карте, а просто выводить числовое значение, закомментируйте или удалите следующие строки: 140-143, 217, 220, 251-252, 271-272 и 334, либо просто перейдите к следующему готовому коду, в котором я уже всё закомментировал.
  • 8, 306-315 — я привык работать с jQuery, поэтому здесь он используется для асинхронной загрузки API Яндекс Карт и для отслеживания клика по кнопке, но он не лежит в основе скрипта, поэтому вы легко сможете обойтись и без него. И опять-таки, на тот случай, если у вас с этим возникают трудности, следующий пример я сделал на чистом JavaScript.
  • 18-127 — массив координат (широта и долгота) каждого километра МКАД.

Без отображения кратчайшего расстояния, просто расчет и вывод результата (чистый JavaScript).

Всё точно так же, код готовый к использованию — просто вставляете его и смотрите результат.

Этот код доступен только для зарегистрированных пользователей.

Регистрация Войдите на сайт, если вы уже зарегистрированы »

Другие премиум-посты

Комментарии 5

  • Аноним20 апреля 2017 в 11:04 #

    Здравствуйте, Михаил
    Не могли бы вы доработать код, чтобы адрес "подсказывался" во время набора?
    И еще было бы здорово чтобы после ввода адреса карта переходила на этот адрес и приближалась к нему.

    • Миша20 апреля 2017 в 12:04 #

      Здравствуйте,

      не уверен, что я сейчас смогу найти время,
      но относительно подсказывания адреса могу сделать наводку: https://tech.yandex.ru/maps/doc/jsapi/2.1/ref/reference/SuggestView-docpage/

      А почему у вас комментарий без имени и емайл?

      • w0rmak21 апреля 2017 в 10:04 #

        Видимо я не вошел под логином.
        Если можете - добавьте пожалуйста данный функционал. Почти не разбираюсь в js.

      • w0rmak21 апреля 2017 в 11:04 #

        Это было просто. Нашел код в интернете. Добавьте и себе

        <script>
        ymaps.load(function () {
            var input = document.getElementById('moscow_address');
            var suggestView = new ymaps.SuggestView('moscow_address', {
                offset: [10, 10]
            });
         
             suggestView.state.events.add('change', function () {
             var activeIndex = suggestView.state.get('activeIndex');
             if (typeof activeIndex == 'number') {
                   activeItem = suggestView.state.get('items')[activeIndex];
                 if (activeItem && activeItem.value != input.value) {
                   input.value = activeItem.value;
                 }
             }
            });
        });
        </script>

Оставить комментарий / вопрос

phpjsHTMLCSSSQLПросто код
  Комментарии закрыты.