Skip to content

Маршрути

Цей інструмент дозволяє користувачу побудувати маршрут між двома точками, переглянути покрокові інструкції та візуалізувати маршрут на карті. Інтерфейс розрахований на зручність використання та швидку взаємодію.

scheme-api
/api-user/osrm-routes?steps=true

Параметри

Параметри API
НазваТипОпис
stepsBooleanЧи показувати кроки маршруту

Запит

payload
[[[28.694164453124444,48.542682408459854],[34.95637148437433,49.94828168067562]]]

Відповідь

Приклад відповіді
json
[
    {
        "geom": {
            "coordinates": [    // Поворотні точки
                [
                    34.610002,
                    49.960513
                ],
                [
                    34.610904,
                    49.960455
                ],
                [
                    34.610964,
                    49.960806
                ]
            ],
            "type": "LineString"
        },
        "instructions": [             // Кроки
            {
                "geometry": {
                    "coordinates": [
                        [
                            34.610002,
                            49.960513
                        ],
                        [
                            34.610904,
                            49.960455
                        ]
                    ],
                    "type": "LineString"
                },
                "maneuver": {
                    "bearing_after": 96,
                    "bearing_before": 0,
                    "location": [
                        34.610002,
                        49.960513
                    ],
                    "modifier": "left",
                    "type": "depart"
                },
                "mode": "driving",
                "driving_side": "right",
                "name": "вулиця Заливчого",
                "intersections": [
                    {
                        "out": 0,
                        "entry": [
                            true
                        ],
                        "bearings": [
                            96
                        ],
                        "location": [
                            34.610002,
                            49.960513
                        ]
                    }
                ],
                "weight": 11.1,
                "duration": 11.1,
                "distance": 65
            },
            {
                "geometry": {
                    "coordinates": [
                        [
                            34.610904,
                            49.960455
                        ],
                        [
                            34.610964,
                            49.960806
                        ]
                    ],
                    "type": "LineString"
                },
                "maneuver": {
                    "bearing_after": 5,
                    "bearing_before": 95,
                    "location": [
                        34.610904,
                        49.960455
                    ],
                    "modifier": "left",
                    "type": "turn"
                },
                "mode": "driving",
                "driving_side": "right",
                "name": "вулиця В'ячеслава Чорновола",
                "intersections": [
                    {
                        "out": 0,
                        "in": 2,
                        "entry": [
                            true,
                            true,
                            false
                        ],
                        "bearings": [
                            0,
                            105,
                            270
                        ],
                        "location": [
                            34.610904,
                            49.960455
                        ]
                    }
                ],
                "weight": 3.5,
                "duration": 3.5,
                "distance": 39.3
            },
            {
                "geometry": {
                    "coordinates": [
                        [
                            34.610964,
                            49.960806
                        ],
                        [
                            34.610964,
                            49.960806
                        ]
                    ],
                    "type": "LineString"
                },
                "maneuver": {
                    "bearing_after": 0,
                    "bearing_before": 6,
                    "location": [
                        34.610964,
                        49.960806
                    ],
                    "type": "arrive"
                },
                "mode": "driving",
                "driving_side": "right",
                "name": "вулиця В'ячеслава Чорновола",
                "intersections": [
                    {
                        "in": 0,
                        "entry": [
                            true
                        ],
                        "bearings": [
                            186
                        ],
                        "location": [
                            34.610964,
                            49.960806
                        ]
                    }
                ],
                "weight": 0,
                "duration": 0,
                "distance": 0
            }
        ],
        "distance": 104.3,        // Сумарна дистанція (м)
        "time_for_route": 30      // Розрахунковий час (сек)
    }
]

Демо

Ви можете переміщати точки по карті

Маршрут

0 m

Немає інструкцій

Особливості:

  • Введення координат: користувач вводить дві точки у форматі 'довгота, широта'.
  • Побудова маршруту: автоматичне прокладання маршруту між двома точками.
  • Покрокові інструкції: детальний перелік дій з напрямками та відстанню для кожного кроку.
  • Перемикання точок: кнопка для миттєвого обміну точок місцями (A ↔ B).
  • Тимчасові маркери: наведення на інструкцію підсвічує відповідну точку маршруту на карті.
  • Інтерактивна карта: можливість переміщення, масштабування та перегляду маршруту.
  • Візуальна індикація точок: зелена крапка для початку маршруту, червона — для кінця.
  • Завантаження маршруту: індикатор, що показує процес отримання маршруту.