---
metadata:
  - name: generator
    content: Diplodoc Platform v5.39.1
alternate:
  - https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/dg/concepts/router/multiRouter.md
  - https://yandex.com/dev/jsapi-v2-1/doc/ru/v2-1/dg/concepts/router/multiRouter.md
---
> **Documentation Index:** Fetch the complete configuration index at https://yandex.com/dev/jsapi-v2-1/doc/en/llms.txt

# Working with routes programmatically

[Overview](#about)

[Building a route on a map](#how-to-build-route)

[Route settings](#route-settings)

[Enabling editing mode](#how-to-enable-editing)

[Getting information about a route](#route-get-info)

[Solving typical tasks](#faq)


## Overview {#about}

Use the [multiRouter.MultiRoute](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.MultiRoute.md) class to [build](#how-to-build-route) multi-stop routes that include three or more points. You can use this class to get route information, change the route's appearance, and reverse the route points. [More about route settings](#route-settings)

{% include notitle [patner-code](../../_includes/router/multiRouter/partner-code-eeace3e7937c.md#map1) %}

{% note alert %}

Routing requests are [fee-based](https://yandex.com/maps-api/products/js-api#tariffs).

{% endnote %}


## Building a route on a map {#how-to-build-route}

To build a route using the [multiRouter.MultiRoute](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.MultiRoute.md) class, create an instance of this class and add it to the map:

```javascript
// Set the route.
// A driving route is created by default.
var multiRoute = new ymaps.multiRouter.MultiRoute({   
    // Route points. Points can be set as coordinates or addresses. 
    referencePoints: [
        'Smolenskaya metro station, Moscow',
        'Arbatskaya metro station, Moscow',
        [55.734876, 37.59308], // Lva Tolstogo street
    ]
}, {
      // |Automatically set the map viewport so that
      // the entire route is visible.
      boundsAutoApply: true
});

// Add the route to the map.
myMap.geoObjects.add(multiRoute);
```

{% cut "View the complete example code" %}


```html
<meta charset="utf-8">

<div id="map" style="width:450px;height:300px"></div>


```


{% endcut %}

{% note alert %}

For points that are set as a string, additional requests will be sent to the Geocoder. Each point is counted as a separate request. In addition, enabling the [reverseGeocoding](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IMultiRouteParams.md#reverseGeocoding) option will also create extra requests to the Geocoder. Remember that geocoding requests are [fee-based](https://yandex.com/maps-api/products/js-api#tariffs).

{% endnote %}

By default, route points can't be moved. In order for users to be able to move, delete, and create points, [editing mode must be enabled](#how-to-enable-editing).

## Route settings {#route-settings}

You can configure various settings for the route. For example, you can switch the routing type, change the appearance, or reverse the points.

There are two ways to configure settings: when creating a route using the constructor, or via the `setParams()` method. The examples below show how to manage route settings.

[Selecting the routing type](#set-routing-mode)

[Building a route with traffic allowances](#how-to-avoid-traffic)

[Adding throughpoints](#how-to-add-transit)

[Customizing the appearance of the route](#how-to-set-view)

[Enabling editing mode](#how-to-enable-editing)


For solutions to other common routing tasks, see [Solving typical tasks](#faq).

## Selecting the routing type {#set-routing-mode}

The routing type is set in the [routingMode](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IMultiRouteParams.md) parameter. The following types of routing are available:
- "auto" (default) — A driving route.
- "masstransit" — A route on public transit.
- "pedestrian" — A walking route.
- "bicycle" — A bike route.

Example:

```javascript
// Build a route on public transit.

// Create a route instance.
var multiRoute = new ymaps.multiRouter.MultiRoute({
    referencePoints: [
        'Smolenskaya metro station',
        'Arbatskaya metro station'
    ],
    params: {
      // Route type: on public transit.
      routingMode: "masstransit"  
    }
}, {
      // Automatically set the map viewport so that
      // the entire route is visible.
      boundsAutoApply: true
});

// Add the route to the map.
myMap.geoObjects.add(multiRoute);
```

{% cut View the complete example code"" %}


```html
<meta charset="utf-8">

<div id="map" style="width:450px;height:300px"></div>


```


{% endcut %}

You can also change the route type after the route is created:

```javascript
// Alternative way to change the route type: via the setParams() method.
multiRoute.model.setParams({
    routingMode: 'bicycle'
});
```

When the `routingMode` parameter changes, the route is re-built.

## Building a route with traffic allowances {#how-to-avoid-traffic}

To build a route that allows for traffic, set `avoidTrafficJams: true`.

```javascript
// Build a route that avoids traffic.
var multiRoute = new ymaps.multiRouter.MultiRoute({
    referencePoints: [
        "Park Pobedy, Moscow",
        "Losiny Island, Moscow"
    ],
    params: {
        avoidTrafficJams: true
    }
}, {
        // Automatically set the map viewport so that
        // the entire route is visible.
        boundsAutoApply: true
    });

// Add the route to the map.
myMap.geoObjects.add(multiRoute);
```

{% cut "View the complete example code" %}


```html
<meta charset="utf-8">

<div id="map" style="width:450px;height:300px"></div>


```


{% endcut %}

You can also enable or disable traffic allowances after a route has been added to the map:

```javascript
// Disable traffic allowances via the setParams() method.
multiRoute.model.setParams({
    avoidTrafficJams: false
});
```
When the `avoidTrafficJams` parameter changes, the route is recalculated.

The sandbox has an [interactive example](https://tech.yandex.com/maps/jsbox/2.1/multiroute_driving) of using a button to turn traffic on and off.

## Adding throughpoints {#how-to-add-transit}

[Throughpoints](*Throughpoints) are set via the `viaIndexes` parameter. For example:

```javascript
// Create a route with three points.
// The second point is a throughpoint.
var multiRoute = new ymaps.multiRouter.MultiRoute({
    referencePoints: [
      'Park Kulturi metro station',
      'Smolenskaya metro station',
      'Arbatskaya metro station'
    ],
    params: {
      // Set the second point (Smolenskaya metro station)
      // as a throughpoint.
      viaIndexes: [1]
    }
}, {
    boundsAutoApply: true
});
// Add the route to the map.
myMap.geoObjects.add(multiRoute);
```

{% cut "View the complete example code" %}


```html
<meta charset="utf-8">

<div id="map" style="width:450px;height:300px"></div>


```


{% endcut %}

{% include notitle [patner-code](../../_includes/router/multiRouter/partner-code-eeace3e7937c.md#map2) %}


{% note info %}

Throughpoints are only available for driving routes.

{% endnote %}


## Customizing the appearance of the route {#how-to-set-view}

You can change the appearance of a route when you create it using the route constructor. Display options are passed to the constructor as the second argument:

```javascript
// Create a route.
var multiRoute = new ymaps.multiRouter.MultiRoute({
    referencePoints: [
        [55.734470, 37.58000],
        [55.734336, 37.51218],
        [55.724102, 37.19912]
    ]
}, {
    // Appearance of waypoints.
    wayPointStartIconColor: "#FFFFFF",
    wayPointStartIconFillColor: "#B3B3B3",
    // Appearance of the active route path.
    routeActiveStrokeWidth: 8,
    routeActiveStrokeStyle: 'solid',
    routeActiveStrokeColor: "#002233",
    // Appearance of alternative route paths.
    routeStrokeStyle: 'dot',
    routeStrokeWidth: 3,
    boundsAutoApply: true
});
// Add the route to the map.
myMap.geoObjects.add(multiRoute);
```

{% cut "View the complete example code" %}


```html
<meta charset="utf-8">

<div id="map" style="width:450px;height:300px"></div>


```


{% endcut %}

{% include notitle [patner-code](../../_includes/router/multiRouter/partner-code-eeace3e7937c.md#map4) %}

- For a more detailed example, see [Configuring the appearance of a multiroute](https://tech.yandex.com/maps/jsbox/2.1/multiroute_view_options) in the sandbox.
- The section «Solving typical tasks» shows [how to change the route's appearance when the mouse pointer hovers over it](#how-to-change-view-onmouse).

## Enabling editing mode {#how-to-enable-editing}

When a route is added to the map, editing mode is disabled — the route points are inactive and users can't move them.

To enable editing mode, use the [start()](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.EditorAddon.md#event-start) method:

```javascript
var multiRoute = new ymaps.multiRouter.MultiRoute({
    referencePoints: [
        "Sokol metro station, Moscow",
        "Paveletskaya metro station, Moscow"
    ]
});
// Enable editing mode.
multiRoute.editor.start();
// And then disable editing mode.
// multiRoute.editor.stop();

// Add the route to the map.
myMap.geoObjects.add(multiRoute);
```

{% cut "View the complete example code" %}


```html
<meta charset="utf-8">

<div id="map" style="width:450px;height:300px"></div>


```


{% endcut %}

{% include notitle [patner-code](../../_includes/router/multiRouter/partner-code-eeace3e7937c.md#map6) %}

## Adding new points in editing mode

By default, editing mode does not allow users to create new points or delete existing ones. To make this possible, you need to specify special options:

```javascript
var multiRoute = new ymaps.multiRouter.MultiRoute({
    referencePoints: [
        "Sokol metro station, Moscow",
        "Paveletskaya metro station, Moscow"
    ]
}, {
    // The editorDrawOver option forbids setting points on top of map objects
    // (when adding new points). This is necessary
    // in order for users to add intermediary
    // points on the route path.
    editorDrawOver: false,
    // The editorMidPointsType option sets the type of intermediary
    // points to create on the route.
    // "via" — throughpoints
    // "way" — waypoints
    editorMidPointsType: "via"
});

// Enable editing mode and configure settings.
multiRoute.editor.start({
    // When the addWayPoints option is enabled, users can
    // create waypoints by clicking on the map.
    addWayPoints: true,
    // When the removeWayPoints option is enabled, users can
    // delete waypoints. 
    // To delete a waypoint, double-click it.
    removeWayPoints: true,
    // When the addMidPoints option is enabled, users can
    // add new intermediary points.
    // To create an intermediary point, click and hold the route path
    // while moving the point to the desired position on the map.
    // The type of intermediary point (waypoint or throughpoint) is set in 
    // the editorMidPointsType option.
    addMidPoints: true
});

// Add the route to the map.
myMap.geoObjects.add(multiRoute);
```

{% cut "View the complete example code" %}


```html
<meta charset="utf-8">

<div id="map" style="width:450px;height:300px"></div>


```


{% endcut %}

{% include notitle [patner-code](../../_includes/router/multiRouter/partner-code-eeace3e7937c.md#map3) %}

The sandbox has an [interactive example](https://tech.yandex.com/maps/jsbox/2.1/multiroute_edit) with a button to turn on editing mode.

## Getting information about a route {#route-get-info}

The [multiRouter.MultiRoute](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.MultiRoute.md) object contains information about created routes, including the distance and travel time, and information about closed sections of road on a driving route.

[How to get information about the active route](#get-active-route) — The distance, travel time and other information.

[How to get route paths](#get-paths) — For instance, you need to get route paths when you are building a multiroute and you need to get information about each individual path.

[How to get route segments](#get-segments) — You need to get segments if you need to see information about individual sections of the route, such as how much time will be spent on a bus segment.

[How to get waypoints](#get-wayPoints) — You need to get waypoints if their appearance changes dynamically.

[How to get throughpoints](#get-viaPoints) — You need to get throughpoints if their appearance changes dynamically.


All operations with the route are listed in the [reference guide](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.MultiRoute.md#methods-summary).

![](../../_images/small-line.png)

**How to get information about the active route**

To get a reference to the active route, use the [getActiveRoute()](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.MultiRoute.md#getActiveRoute) method. Depending on which type of routing is used, the route is described by the object:
- [multiRouter.driving.Route](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.driving.Route.md) — Driving route.
- [multiRouter.pedestrian.Route](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.pedestrian.Route.md) — Walking route.
- [multiRouter.masstransit.Route](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.masstransit.Route.md) — Public transit route.
- [multiRouter.bicycle.Route](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.bicycle.Route.md) — Bike route.

The example below shows how to get the active route:

```javascript
// Subscribe to the event for updating route data.
// To learn more about this event, see the <u />.
// Note that the subscription is for the 'model' field.
multiRoute.model.events.add('requestsuccess', function() {
    // Get a reference to the active route.
    var activeRoute = multiRoute.getActiveRoute();
    // Output route information.
    console.log("Distance: " + activeRoute.properties.get("distance").text);
    console.log("Travel time: " + activeRoute.properties.get("duration").text);
    // For driving routes, information about 
    // closed road sections can be output.
    if (activeRoute.properties.get("blocked")) {
        console.log("The route has sections with closed roads.");    }});
```

{% cut "View the complete example code" %}


```html
<meta charset="utf-8">

<div id="map" style="width:450px;height:300px"></div>

  
```


![](../../_images/small-line.png)

{% endcut %}

**How to get the route paths**

The path is a section of the route between two stopping points.

To get a list of paths, use the [getPaths()](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.driving.Route.md#getPaths) method. Each route path is described by an object that corresponds to the route type:

- [multiRouter.driving.Path](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.driving.Path.md) — A section of a driving route.
- [multiRouter.pedestrian.Path](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.pedestrian.Path.md) — A section of a walking route.
- [multiRouter.masstransit.Path](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.masstransit.Route.md) — A route section on public transit.
- [multiRouter.bicycle.Route](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.bicycle.Path.md) — A section of a bike route.

The example below shows how to get the route paths:

```javascript
// Get a collection of paths for the active route.
// activeRoute is an object that describes the active route.
// It was received earlier (see the <u />).
var activeRoutePaths = activeRoute.getPaths();    
// Iterate a collection of paths.
activeRoutePaths.each(function(path) {
    console.log("Distance: " + path.properties.get("distance").text);
    console.log("Travel time: " + path.properties.get("duration").text);
}); 
```

{% cut "View the complete example code" %}


```html
<meta charset="utf-8">

<div id="map" style="width:450px;height:300px"></div>


```


![](../../_images/small-line.png)

{% endcut %}

**How to get information about route segments**

Each route is divided into segments. Segments are sections between:
- Waypoints or throughpoints.
- Points where the direction of travel may change (a fork, entrance, exit, turn, U-turn, or intersection).
- Points where the type of route section changes. For example, the point where a «walking» segment changes to a «bus» segment.

To get a list of segments, use the [getSegments()](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.driving.Path.md#getSegments) method. Each segment is described by an object that corresponds to the route type:

- [multiRouter.driving.Segment](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.driving.Segment.md) — Segment of a driving route.
- [multiRouter.pedestrian.WalkSegment](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.pedestrian.WalkSegment.md) — Segment of a walking route.
- For public transit routes:
    - [multiRouter.masstransit.TransferSegment](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.masstransit.TransferSegment.md) — Transfer or connection segment.
    - [multiRouter.masstransit.TransportSegment](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.masstransit.TransportSegment.md) — Transport segment.
    - [multiRouter.masstransit.WalkSegment](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.masstransit.WalkSegment.md) — Walking segment.
    
- [multiRouter.bicycle.Segment](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.bicycle.Segment.md) — Segment on a bicycle.

The example below shows how to get route segments:

```javascript
// First you need to get a collection of route paths.
// Note: the activeRoute object was received earlier (see the <u />).
var activeRoutePaths = activeRoute.getPaths(); 
// Iterate the collection of paths.
activeRoutePaths.each(function(path) {
  // Get a collection of segments for each path.
  var segments = path.getSegments();
  // Iterate the collection of segments and output information about each segment.
  segments.each(function(segment) {
    console.log("Maneuver at end of segment: " + segment.properties.get("action").text);
    console.log("Distance: " + segment.properties.get("distance").text);
    console.log("Travel time: " + segment.properties.get("duration").text);
    console.log("Street that the segment follows: " + segment.properties.get("street"));
  }); 
});   
```

{% cut "View the complete example code" %}



```html
<meta charset="utf-8">

<div id="map" style="width:450px;height:300px"></div>


```


{% endcut %}

The sandbox has interactive examples:

- [Changing the color of route segments](https://tech.yandex.com/maps/jsbox/2.1/multiroute_view_access) — This example creates a public transit route. The route segments turn different colors depending on the type of segment (by bus or on foot).
    
- [Adding route information to DOM](https://tech.yandex.com/maps/jsbox/2.1/multiroute_data_access) — Displays information about route segments on an HTML page.
    
![](../../_images/small-line.png)

**How to get waypoints on the route**

A _waypoint_ is a point on the route to make a stop at. The starting and ending points are also waypoints.

Waypoints are described by the [multiRouter.WayPoint](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.WayPoint.md) object. To get a list of waypoints on a route, use the [getWayPoints()](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.MultiRoute.md#getWayPoints) method.

```javascript
var wayPoints = multiRoute.getWayPoints();  

// Iterate the collection of waypoints.
// For each point, set the placemark content.
wayPoints.each(function (point) {   
    point.options.set({
        preset: "islands#redStretchyIcon",
        // Set the address of the point as the placemark content.
        iconContentLayout: ymaps.templateLayoutFactory.createClass('{{ properties.request|raw }}')
    });
});    
```

{% cut "View the complete example code" %}


```html
<meta charset="utf-8">

<div id="map" style="width:450px;height:300px"></div>


```


![](../../_images/small-line.png)

{% endcut %}

**How to get throughpoints on the route**

A _throughpoint_ is a point that the route must go through, but does not imply a stop. Throughpoints are only supported for driving routes.

Throughpoints are described by the [multiRouter.ViaPoint](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.ViaPoint.md) object. To get throughpoints on a route, use the [getViaPoints()](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.MultiRoute.md#getViaPoints) method.

The example below demonstrates how to obtain information about throughpoints and set their appearance.

```javascript
var viaPoints = multiRoute.getViaPoints();
// Iterate the collection of throughpoints.
viaPoints.each(function (point) { 
    // Set the appearance of each throughpoint.
    point.options.set({  
        iconRadius: 7,
        iconFillColor: "#000088",
        // The appearance of a throughpoint for the active route.
        activeIconFillColor: "#E63E92"
    }); 
});
```

{% cut "View the complete example code" %}


```html
<meta charset="utf-8">

<div id="map" style="width:450px;height:300px"></div>


```


{% endcut %}

For a more detailed example, see [Configuring the appearance of a multiroute](https://tech.yandex.com/maps/jsbox/2.1/multiroute_view_options) in the sandbox.

> ## Solving typical tasks
> 
> {% cut "How can I show the address in placemark labels?" %}
> 
> If the route points are set by address, the addresses are automatically displayed in labels.
> 
> If the route points are set by coordinates, the `reverseGeocoding` option must be enabled in order for addresses to be shown in labels.
> 
> ```javascript
> var multiRoute = new ymaps.multiRouter.MultiRoute({
>     referencePoints: [
>       [55.734876, 37.59308],
>       [55.761184, 37.57850]
>     ],
>     params: {
>        reverseGeocoding: true
>     }
> });
> 
> // Add the route to the map.
> myMap.geoObjects.add(multiRoute);
> ```
> 
> ![](../../_images/use-caption-icon-route.png)
> 
> 
> {% note info %}
> 
> The `reverseGeocoding` option is a flag that allows the API to perform reverse geocoding. This means that for points that are set using coordinates, the API sends requests to the Geocoder to determine their addresses. Remember that requests to the Geocoder are [fee-based](https://yandex.com/maps-api/products/js-api#tariffs). When enabling the `reverseGeocoding` option, consider the load on your site to avoid exceeding your daily request limit.
> 
> {% endnote %}
> 
> ![](../../_images/small-line.png)
>
> {% endcut %}
> 
> {% cut "How can I hide labels on route markers?" %}
> 
> In order to not show addresses on labels, the route points must be set in **coordinates**. In addition, the `reverseGeocoding` option must be set to `false`.
> 
> ```javascript
> var multiRoute = new ymaps.multiRouter.MultiRoute({
>     referencePoints: [
>       [55.734876, 37.59308],
>       [55.761184, 37.57850]
>     ],
>     params: {
>       reverseGeocoding: false
>     }
> });
> 
> // Add the route to the map.
> myMap.geoObjects.add(multiRoute);
> ```
> 
> 
> ![](../../_images/no-caption.png)
> 
> ![](../../_images/small-line.png)
>
> {% endcut %}
> 
> {% cut "How do I set my own image for placemarks?" %}
> 
> You can set a custom placemark image in the route options. Note that you need to specify the 'wayPoint' prefix for waypoints.
> 
> ```javascript
> var multiRoute = new ymaps.multiRouter.MultiRoute({
>   referencePoints: [
>     "Leninsky Prospekt, Moscow",
>     "16 Lva Tolstogo, Moscow",
>     "Sokolniki Park, Moscow"
>   ]
> }, {
>   // Set a custom image
>   // for the ending point.
>   wayPointFinishIconLayout: "default#image",
>   wayPointFinishIconImageHref: "images/img.png",
>   wayPointFinishIconImageSize: [30, 30],
>   wayPointFinishIconImageOffset: [-15, -15]
>  });
> 
> // Add the route to the map.
> myMap.geoObjects.add(multiRoute);
> ```
> 
> 
> ![](../../_images/custom-view.png)
> 
> [Open example in sandbox](https://tech.yandex.com/maps/jsbox/2.1/multiroute_view_options)
> 
> ![](../../_images/small-line.png)
>
> {% endcut %}
> 
> {% cut "I need to change the route's appearance on hover. How do I do that?" %}
> 
> The example below shows how to change the color of the route path when the mouse pointer hovers over it. The active route is black, and alternative routes are white.
> 
> {% include notitle [patner-code](../../_includes/router/multiRouter/partner-code-eeace3e7937c.md#map5) %}
> 
> ```javascript
> var multiRoute = new ymaps.multiRouter.MultiRoute({
>     referencePoints: [
>       [55.734470, 37.58000],
>       [55.734336, 37.51218],
>       [55.724102, 37.19912]
>     ]
> }, {
>     boundsAutoApply: true
> });
> 
> // Subscribe to the route display readiness event. 
> multiRoute.events.add('update', function() {
>     // Get a list of created routes.
>     var routes = multiRoute.getRoutes();
>     // Iterate the collection of routes.
>     // For each route, subscribe to the
>     // 'mouseenter' and 'mouseleave' events.
>     routes.each(function(route) {
>         route.events.add('mouseenter', function() {
>            // Get a reference to the active route.
>            var active = multiRoute.getActiveRoute();
>             route.options.set('strokeWidth', 10);
>             // The active route will be black.
>             if (active === route) {
>                 route.options.set('strokeColor', "#000000");
>             } else {
>                 route.options.set('strokeColor', "#FFFFFF");
>             }
>         });
>         route.events.add('mouseleave', function() {
>             route.options.unset('strokeWidth');
>             route.options.unset('strokeColor');
>         });
>     });  
> });
> 
> // Add the route to the map.
> myMap.geoObjects.add(multiRoute);  
> ```
> 
> The sandbox has another example: [Working with multiroute data and events](https://tech.yandex.com.tr/maps/jsbox/2.1/multiroute_view_access). In the example, the route segments are different colors depending on the type of segment (bus or subway).
> 
> ![](../../_images/small-line.png)
>
> {% endcut %}
> 
> {% cut "How do I set a custom route balloon layout?" %}
> 
> See the [example](https://tech.yandex.com/maps/jsbox/2.1/multiroute_custom_balloon_layout).
> 
> ![](../../_images/small-line.png)
>
> {% endcut %}
> 
> {% cut "How can I make sure that the map boundaries are automatically redrawn every time the route changes?" %}
> 
> To do this, subscribe to the 'boundschange' route event. In the event handler, set the `checkZoomRange` option to `true`.
> 
> ```javascript
> multiRoute.events.add("boundschange", function() {
>     myMap.setBounds(multiRoute.getBounds(), {
>         checkZoomRange: true
>     });
> });
> ```
> 
> {% note info %}
> 
> You can also set automatic map centering via the [boundsAutoApply](https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/multiRouter.MultiRoute.md#param-options.boundsAutoApply) option. However, this option only centers the map when the route is first built.
> 
> {% endnote %}
> 
> ![](../../_images/small-line.png)
>
> {% endcut %}
> 
> {% cut "How can I remove the placemarks on waypoints?" %}
> 
> **Method 1:** Use the `wayPointVisible` option:
> 
> ```javascript
> var multiRoute = new ymaps.multiRouter.MultiRoute({
>     referencePoints: [
>       [55.734876, 37.59308],
>       [55.761184, 37.57850]
>     ]
> }, {
>     wayPointVisible: false,
>     boundsAutoApply: true
> });
> 
> // Add the route to the map.
> myMap.geoObjects.add(multiRoute);
> ```
> 
> 
> 
> ![](../../_images/no-points.png)
> 
> 
> However, in this case the route points will be inactive and users will not be able to move them.
> 
> **Method 2:** Set a custom image for the placemark that will be less noticeable. Example of setting a custom image:
> 
> ```javascript
> // Create a route.
> var multiRoute = new ymaps.multiRouter.MultiRoute({
>     referencePoints: [
>         "Leninsky Prospekt, Moscow",
>         "16 Lva Tolstogo, Moscow",
>         "Vodny Stadion metro station, Moscow"
>     ]
> }, {
>     // Set the appearance of the starting point.
>     wayPointStartIconLayout: "default#image",
>     wayPointStartIconImageHref: "images/myImageStart.png",
>     wayPointStartIconImageSize: [10, 10],
>     wayPointStartIconImageOffset: [-5, -5],
>     // Set the appearance of the ending point.
>     wayPointFinishIconLayout: "default#image",
>     wayPointFinishIconImageHref: "images/myImageFinish.png",
>     wayPointFinishIconImageSize: [10, 10],
>     wayPointFinishIconImageOffset: [-5, -5],
>     // Set the appearance of the intermediary point.
>     wayPointIconLayout: "default#image",
>     wayPointIconImageHref: "images/myImageWayPoint.png",
>     wayPointIconImageSize: [10, 10],
>     wayPointIconImageOffset: [-5, -5],
>     boundsAutoApply: true
> });
> 
> // Add the route to the map.
> myMap.geoObjects.add(multiRoute);
> ```
> 
> ![](../../_images/small-line.png)
>
> {% endcut %}
>
> 
> {% cut "How can I get information about a route's distance and travel time?" %}
> 
> See the [example](https://tech.yandex.com/maps/jsbox/2.1/multiroute_data_access) in the sandbox.
>
> {% endcut %}
> 
> {% cut "How can I get information about route segments on public transport?" %}
> 
> ```javascript
> // Build a route with three points.
> var multiRoute = new ymaps.multiRouter.MultiRoute({
>     // Define the multiroute reference points.
>     referencePoints: [
>         [55.734876, 37.59308],
>         "Mytishi, Moscow"
>     ],
>     params: {
>         routingMode: "masstransit"
>     }
> });
> 
> // Show the route on the map.
> myMap.geoObjects.add(multiRoute);
> 
> multiRoute.events.add('update', function() {
>     // Get the active route.
>     var activeRoute = multiRoute.getActiveRoute();
>     // Get the paths for the active route.
>     var activeRoutePaths = activeRoute.getPaths();
>     
>     // Iterate the collection of route paths.
>     activeRoutePaths.each(function(path) {
>         // Get the route segments.
>         var segments = path.getSegments();
>         // Iterate the collection of route segments.
>         segments.each(function(segment) {
>             // Segment type (walking or on public transit).
>             var segmentType = segment.properties.get("type");
>             // Get all the "On public transit" segments.
>             var segmentTransports = segment.properties.get('transports');
>             if (segmentTransports != undefined) {
>                 segmentTransports.forEach(function(transport) {
>                     console.log("Route number or direction: " + transport.name);
>                     console.log("Transit type: " + transport.type);
>                     console.log("Color: " + transport.Style); // Color of the subway line.
>                 });            }        });    });});
> ```
> 
> The sandbox has another example: [Working with multiroute data and events](https://tech.yandex.com/maps/jsbox/2.1/multiroute_view_access). In the example, the route segments are different colors depending on the type of segment (bus or subway).
>
> {% endcut %}
> 
> {% cut "How can I count the number of transfers on the subway?" %}
> 
> ```javascript
> var multiRoute = new ymaps.multiRouter.MultiRoute({
>     // Define the multiroute's reference points.
>     referencePoints: [
>         "Park Pobedy metro station, Moscow",
>         "Babushkinskaya metro station, Moscow"
>     ],
>     params: {
>         routingMode: "masstransit"
>     }
> });
> 
> // Show the route on the map.
> myMap.geoObjects.add(multiRoute);
> 
> multiRoute.events.add('update', function() {
>     var activeRoute = multiRoute.getActiveRoute();
>     // Travel time for the route.
>     var activeRouteDuration = activeRoute.properties.get("duration").text;
>     // Get the route paths.
>     var activeRoutePaths = activeRoute.getPaths();
>     
>     var transferCount = 0;
> 
>     activeRoutePaths.each(function(path) {
>         var segments = path.getSegments(); 
>         segments.each(function (segment) {
>             var segmentType = segment.properties.get("type");
>             // If the segment type is transfer, add one to the counter total.
>             if (segmentType == "transfer") {
>                 transferCount += 1;
>             }
>         });   
>     });
>     console.log("Number of subway transfers: " + transferCount); 
>     console.log("Travel time: " + activeRouteDuration); 
> });
> ```
>
>
> {% endcut %}
> 
> {% cut "How do I edit a route programmatically (add or remove points, change the routing type, and so on)?" %}
> 
> To programmatically edit the route, use the `multiRoute.model` field:
> 
> ```javascript
> // Create a route instance.
> var multiRoute = new ymaps.multiRouter.MultiRoute({
>     referencePoints: [
>         'Arbatskaya metro station', 
>         'Smolenskaya metro station'               
>     ]
> });
> 
> // Add the route to the map.
> myMap.geoObjects.add(multiRoute);
> 
> // Recalculate the route for the new points. 
> // The 'Arbatskaya metro station' point will be removed from the route.
> multiRoute.model.setReferencePoints([ 
>     'Smolenskaya metro station',
>     'Tekstilshiki metro station'
> ]);
> 
> // Change routing parameters.
> multiRoute.model.setParams({
>     routingMode: 'masstransit'
> });
> ```
>
> {% endcut %}

[*Throughpoints]: _Throughpoint_ — An intermediary point that the route must go through, but does not imply a stop. Throughpoints are only available for driving routes.