All docs
V20.2
21.1
20.2
20.1
19.2
The page you are viewing does not exist in version 19.2. This link will take you to the root page.
19.1
The page you are viewing does not exist in version 19.1. This link will take you to the root page.
18.2
The page you are viewing does not exist in version 18.2. This link will take you to the root page.
18.1
The page you are viewing does not exist in version 18.1. This link will take you to the root page.
17.2
The page you are viewing does not exist in version 17.2. This link will take you to the root page.

routes[]

An array of routes shown on the map.

Type:

Array<Object>

Raised Events: routeAdded, routeRemoved

color

Specifies the color of the line displaying the route.

Type:

String

Default Value: '#0000FF'

This property supports the following colors:

locations[]

Contains an array of objects making up the route.

Type:

Array<Object>

You can specify the locations value in one of the following formats.

  • { lat: 40.749825, lng: -73.987963}
  • "40.749825, -73.987963"
  • [40.749825, -73.987963]
  • "Brooklyn Bridge,New York,NY"

When you use the Map as an ASP.NET MVC 5 Control or a DevExtreme-Based ASP.NET Core Control, specify this property using the Address() or Coordinates() method as shown in the following code.

Razor C#
Razor VB
@(Html.DevExtreme().Map()
    .Routes(routes => {
        routes.Add().Locations(locations => {
            locations.Add().Address("Brooklyn Bridge,New York,NY");
            locations.Add().Coordinates(40.753889, -73.95);
        });
    })
)
@(Html.DevExtreme().Map() _
    .Routes(Sub(routes)
        routes.Add().Locations(Sub(locations)
            locations.Add().Address("Brooklyn Bridge,New York,NY")
            locations.Add().Coordinates(40.753889, -73.95)
        End Sub)
    End Sub)
)

mode

Specifies a transportation mode to be used in the displayed route.

Type:

String

Default Value: 'driving'
Accepted Values: 'driving' | 'walking'

Use the GeoMapRouteMode enum to specify this property when the UI component is used as an ASP.NET MVC 5 Control or a DevExtreme-Based ASP.NET Core Control. This enum accepts the following values: Driving and Walking.

opacity

Specifies the opacity of the line displaying the route.

Type:

Number

Default Value: 0.5

weight

Specifies the thickness of the line displaying the route in pixels.

Type:

Number

Default Value: 5