Добавить вызов такси

Open in CodeSandbox

API Карт позволяет строить маршруты на такси с помощью панели control.RoutePanel. Из балуна маршрута можно перейти к вызову машины через Яндекс.Такси.

В качестве точек отправления и назначения можно программно задать адрес или местоположение пользователя. Кроме того, пользователь может указать точки маршрута самостоятельно.

Для интеграции заказа такси без показа карты можно использовать виджеты Яндекс.Такси. Они позволяют получать вознаграждение за поездки, начатые через виджеты, в рамках программы вознаграждений.

<!DOCTYPE html>
<html>
    <head>
        <title>Добавить вызов такси</title>
        <meta
            http-equiv="Content-Type"
            content="text/html; charset=utf-8"
        />
        <!--
        Укажите свой API-ключ. Тестовый ключ НЕ БУДЕТ работать на других сайтах.
        Получить ключ можно в Кабинете разработчика: https://developer.tech.yandex.ru/keys/
    -->
        <script
            src="https://api-maps.yandex.ru/2.1/?lang=ru_RU&amp;apikey=<ваш API-ключ>"
            type="text/javascript"
        ></script>
        <script src="multiroute_taxi.js" type="text/javascript"></script>
        <style>
            html,
            body,
            #map {
                width: 100%;
                height: 100%;
                padding: 0;
                margin: 0;
            }
        </style>
    </head>
    <body>
        <div id="map"></div>
    </body>
</html>
ymaps.ready(init);

function init() {
    var myMap = new ymaps.Map("map", {
        center: [55.77, 37.6],
        zoom: 13,
        controls: [],
    });
    // Создадим панель маршрутизации.
    var routePanelControl = new ymaps.control.RoutePanel({
        options: {
            // Добавим заголовок панели.
            showHeader: true,
            // Зададим текст заголовка панели.
            title: "Вызов такси",
            // Пользователь сможет построить только маршрут на такси.
            routePanelTypes: { taxi: true },
            // Зададим ширину панели.
            maxWidth: "210px",
        },
    });
    // Зададим тип маршрутизации по умолчанию.
    routePanelControl.routePanel.state.set({
        // Зададим тип маршрутизации - такси.
        type: "taxi",
        // Зададим адрес пункта назначения.
        to: "Павелецкий вокзал",
        // Отключим возможность задавать пункт отправления в поле ввода.
        toEnabled: false,
    });
    var zoomControl = new ymaps.control.ZoomControl({
        options: {
            size: "small",
            float: "none",
            position: {
                bottom: 145,
                right: 10,
            },
        },
    });

    myMap.controls.add(routePanelControl).add(zoomControl);
    // Зададим местоположение пользователя в качестве начальной точки маршрута.
    routePanelControl.routePanel.geolocate("from");
}