DirectionsViewModel

AMD: require(["esri/widgets/Directions/DirectionsViewModel"], (DirectionsVM) => { /* code goes here */ });
ESM: import DirectionsVM from "@arcgis/core/widgets/Directions/DirectionsViewModel";
Class: esri/widgets/Directions/DirectionsViewModel
Inheritance: DirectionsViewModel Accessor
Since: ArcGIS API for JavaScript 4.6

Provides the communication and data manipulation logic for the Directions widget.

See also
Example
const directions = new Directions({
  viewModel: { // autocasts as new DirectionsViewModel
    routeServiceUrl: "https://route-api.arcgis.com/arcgis/rest/services/World/Route/NAServer/Route_World"
  }
});

Constructors

new DirectionsViewModel(properties)
Parameter
properties Object
optional

See the properties for a list of all the properties that may be passed into the constructor.

Property Overview

Any properties can be set, retrieved or listened to. See the Working with Properties topic.
Show inherited properties Hide inherited properties
Name Type Summary Class
String

An authorization string used to access a resource or service.

more details
DirectionsViewModel
String

The name of the class.

more details
Accessor
GoToOverride

This function provides the ability to override either the MapView goTo() or SceneView goTo() methods.

more details
DirectionsViewModel
Object

The network attribute name to be used as the impedance attribute in the analysis.

more details
DirectionsViewModel
RouteLayerSolveResult

The most recent route result.

more details
DirectionsViewModel
RouteLayer

The RouteLayer associated with the DirectionsViewModel.

more details
DirectionsViewModel
Number

The maximum number of stops allowed for routing.

more details
DirectionsViewModel
RouteParameters

Route Parameters object used to call the service.

more details
DirectionsViewModel
String

The URL of the REST endpoint of the Route service.

more details
DirectionsViewModel
SimpleLineSymbol

Defines the symbol used to draw the route on the map.

more details
DirectionsViewModel
TravelMode

The selected travel mode.

more details
DirectionsViewModel
Object

The Service Description object returned by the Route REST Endpoint.

more details
DirectionsViewModel
String

The current state of the view model.

more details
DirectionsViewModel
Collection<Stop>

A Collection of Stops that define the stop locations along the route.

more details
DirectionsViewModel
RouteStopSymbols

The default stop symbols used to display locations between the origin and final destination.

more details
DirectionsViewModel
Object

The name of the network attribute to use for the drive time when computing directions.

more details
DirectionsViewModel
TravelMode[]

Array of objects containing properties specific to either an ArcGIS service or organization's travel modes.

more details
DirectionsViewModel
MapView|SceneView

The view from which the widget will operate.

more details
DirectionsViewModel

Property Details

apiKey String
Since: ArcGIS API for JavaScript 4.19

An authorization string used to access a resource or service. API keys are generated and managed in the ArcGIS Developer dashboard. An API key is tied explicitly to an ArcGIS account; it is also used to monitor service usage. Setting a fine-grained API key on a specific class overrides the global API key.

By default, the following URLs will be used (unless overwritten in the app, or if using different defaults from a portal):

Geocoding URL: https://geocode-api.arcgis.com/arcgis/rest/services/World/GeocodeServer

Routing URL: https://route-api.arcgis.com/arcgis/rest/services/World/Route/NAServer/Route_World

declaredClass Stringreadonly inherited
Since: ArcGIS API for JavaScript 4.7

The name of the class. The declared class name is formatted as esri.folder.className.

goToOverride GoToOverride
Since: ArcGIS API for JavaScript 4.8

This function provides the ability to override either the MapView goTo() or SceneView goTo() methods.

See also
Example
// The following snippet uses the Search widget but can be applied to any
// widgets that support the goToOverride property.
search.goToOverride = function(view, goToParams) {
  goToParams.options.duration = updatedDuration;
  return view.goTo(goToParams.target, goToParams.options);
};
impedanceAttribute Objectreadonly

The network attribute name to be used as the impedance attribute in the analysis. The value is defined in the specific routing network layer used in the route.

For more information, see Understanding the network attribute.

Properties
name String

Name of the impedance network attribute.

units String

Units of this network attribute.

lastRoute RouteLayerSolveResultreadonly

The most recent route result. Returns a RouteLayerSolveResult object containing properties for barriers (if any), stops, and directions.

Properties
directionLines Collection<DirectionLine>

Collection of direction polylines associated with line segments between turns.

directionPoints Collection<DirectionPoint>

Collection of direction items as points with various display information.

pointBarriers Collection<PointBarrier>

Collection of point barriers.

polygonBarriers Collection<PolygonBarrier>

Collection of polygon barriers.

polylineBarriers Collection<PolylineBarrier>

Collection of polyline barriers.

routeInfo RouteInfo

Information about a solved route including the route's geometry and overall distance and time.

stops Collection<Stop>

Collection of stops. Respresents the start, end, or midpoint of a route.

Default Value:null
See also
layer RouteLayer
Since: ArcGIS API for JavaScript 4.24

The RouteLayer associated with the DirectionsViewModel. The route layer contains stops and barriers and will be used to display and solve routes.

maxStops Number

The maximum number of stops allowed for routing.

Default Value:50
routeParameters RouteParameters

Route Parameters object used to call the service. Please refer to the RouteParameters documentation for the list of available settings.

routeServiceUrl String
Deprecated since version 4.24. Use url from layer instead.

The URL of the REST endpoint of the Route service.

By default, the DirectionsViewModel will use the global routing serice (see config.routeServiceUrl).

If connected to a Portal you can use the route service advertised on the portal's helper services as demonstrated below.

See also
Example
// Create DirectionsViewModel using the route service advertised on the portal
const portal = Portal.getDefault();
const viewModel = new DirectionsViewModel({
  routeServiceUrl: portal.helperServices.route.url
});
routeSymbol SimpleLineSymbol
Deprecated since version 4.24. Use directionLines from layer instead.

Defines the symbol used to draw the route on the map.

selectedTravelMode TravelMode

The selected travel mode. Unless specified, the Directions widget will use the first supported travel mode. For the default routeServiceUrl this is a travel mode named "Driving Time". More information can be found in the ArcGIS Online documentation.

Default Value:null
See also
serviceDescription Objectreadonly

The Service Description object returned by the Route REST Endpoint. This object contains three properties: currentVersion, defaultTravelMode, and supportedTravelModes.

This information is useful when implementing complex logistics scenarios operating with limitations or preferences on vehicle or stop properties, for example avoiding toll roads, dealing with hazardous materials, working with stop service times, etc.

Properties
currentVersion Number

Server version.

defaultTravelMode String

Id of the default travel mode.

supportedTravelModes TravelMode[]

Available travel modes.

Default Value:null
state Stringreadonly

The current state of the view model.

Possible Values:"disabled"|"ready"

Default Value:disabled
Deprecated since version 4.24. Use stops from layer instead.

A Collection of Stops that define the stop locations along the route.

stopSymbols RouteStopSymbols
Deprecated since version 4.24. Use RouteStopSymbols from layer instead.

The default stop symbols used to display locations between the origin and final destination.

Properties

The first stop symbol.

The middle stop symbol.

The last stop symbol.

An unlocated stop symbol.

A waypoint stop symbol.

timeAttribute Objectreadonly

The name of the network attribute to use for the drive time when computing directions.

Properties
name String

The name of the network attribute to use for the drive time when computing directions.

units String

The units to use when calculating drive time for directions.

travelModes TravelMode[]readonly

Array of objects containing properties specific to either an ArcGIS service or organization's travel modes. More information can be found in the ArcGIS Online documentation.

The view from which the widget will operate.

Method Overview

Show inherited methods Hide inherited methods
Name Return Type Summary Class

Adds one or more handles which are to be tied to the lifecycle of the object.

more details
Accessor

Centers the map at the specified maneuver or stop.

more details
DirectionsViewModel

Clears any highlighted route segments.

more details
DirectionsViewModel

Removes the route directions from the directions list, leaving the inputs untouched.

more details
DirectionsViewModel
Object

Returns the cost attribute associated with the parsed name.

more details
DirectionsViewModel
Promise<RouteLayerSolveResult>

Computes a route and directions.

more details
DirectionsViewModel
Boolean

Returns true if a named group of handles exist.

more details
Accessor
Promise

Highlights the specified network feature.

more details
DirectionsViewModel

Highlights the specified route segment on the map.

more details
DirectionsViewModel
Promise

This method should be called to load the view model's routing resources.

more details
DirectionsViewModel

Removes a group of handles owned by the object.

more details
Accessor

Resets the state of the ViewModel, clearing all the input stops and results in the widget and in the map.

more details
DirectionsViewModel
Promise<PortalItem>

Saves the RouteLayer associated with the view model.

more details
DirectionsViewModel
Promise<PortalItem>

Saves the RouteLayer associated with the view model as a new portal item.

more details
DirectionsViewModel

Zoom so that the full route is displayed within the current map extent.

more details
DirectionsViewModel

Method Details

addHandles(handleOrHandles, groupKey)inherited
Since: ArcGIS API for JavaScript 4.25

Adds one or more handles which are to be tied to the lifecycle of the object. The handles will be removed when the object is destroyed.

// Manually manage handles
const handle = reactiveUtils.when(
  () => !view.updating,
  () => {
    wkidSelect.disabled = false;
  },
  { once: true }
);

// Handle gets removed when the object is destroyed.
this.addHandles(handle);
Parameters
handleOrHandles WatchHandle|WatchHandle[]

Handles marked for removal once the object is destroyed.

groupKey *
optional

Key identifying the group to which the handles should be added. All the handles in the group can later be removed with Accessor.removeHandles(). If no key is provided the handles are added to a default group.

centerAt(stopOrManeuver)

Centers the map at the specified maneuver or stop.

Parameter
stopOrManeuver Graphic

The stop or maneuver where the map should be centered.

clearHighlights()

Clears any highlighted route segments.

clearResults()

Removes the route directions from the directions list, leaving the inputs untouched. The route and locations persist on the map.

getCostAttribute(attributeName){Object}

Returns the cost attribute associated with the parsed name.

Parameter
attributeName String

The attribute name specifying the cost attribute used as an impedance.

Returns
Type Description
Object The cost attribute associated with the passed name.
Property Type Description
name string Name of the impedance network attribute.
units string Units of this network attribute.
getDirections(){Promise<RouteLayerSolveResult>}

Computes a route and directions. If successful, results will be assigned to lastRoute and returned in a resolving promise. If a view is assigned, it will zoom to the extent of the route.

Returns
Type Description
Promise<RouteLayerSolveResult> When resolved, returns a RouteLayerSolveResult.
hasHandles(groupKey){Boolean}inherited
Since: ArcGIS API for JavaScript 4.25

Returns true if a named group of handles exist.

Parameter
groupKey *
optional

A group key.

Returns
Type Description
Boolean Returns true if a named group of handles exist.
Example
// Remove a named group of handles if they exist.
if (obj.hasHandles("watch-view-updates")) {
  obj.removeHandles("watch-view-updates");
}
highlight(networkFeature){Promise}
Since: ArcGIS API for JavaScript 4.24

Highlights the specified network feature.

Parameter

The network feature to highlight.

Returns
Type Description
Promise Resolves when the highlight has been completed.
highlightSegment(maneuver)
Deprecated since version 4.24. Use highlight instead.

Highlights the specified route segment on the map.

Parameter
maneuver Graphic

The route segment to highlight.

load(){Promise}

This method should be called to load the view model's routing resources.

This method downloads service metadata from the assigned routing service. Call this method before accessing properties on the view model or whenever the routeServiceUrl changes.

Returns
Type Description
Promise When resolved, the view model has loaded the route service metadata necessary for routing.
removeHandles(groupKey)inherited
Since: ArcGIS API for JavaScript 4.25

Removes a group of handles owned by the object.

Parameter
groupKey *
optional

A group key or an array or collection of group keys to remove.

Example
obj.removeHandles(); // removes handles from default group

obj.removeHandles("handle-group");
obj.removeHandles("other-handle-group");
reset()

Resets the state of the ViewModel, clearing all the input stops and results in the widget and in the map.

save(){Promise<PortalItem>}
Since: ArcGIS API for JavaScript 4.24

Saves the RouteLayer associated with the view model. This method will update the portal-item associated with layer.

Returns
Type Description
Promise<PortalItem> When resolved, returns a PortalItem.
See also
saveAs(portalItem, options){Promise<PortalItem>}
Since: ArcGIS API for JavaScript 4.24

Saves the RouteLayer associated with the view model as a new portal item.

Parameters
portalItem Promise<PortalItem>

The new portal item to which the layer will be saved.

options Object
optional

Save options. Currently, there is only one property that can be set, which is folder.

Specification
folder PortalFolder
optional

The folder in which to save the item.

Returns
Type Description
Promise<PortalItem> Saved portal item.
See also
zoomToRoute()

Zoom so that the full route is displayed within the current map extent.

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.