Routing is done using ALK Maps Data. The display of rail routes is handled through the Rail Routing Layer.
The first step in generating routes is to add a routing layer to your map. The routing layer will be responsible for both retrieving and drawing the routes based on the stops and properties you define.
var routingLayer = new ALKMaps.Layer.RailRouting( "Rail Route Layer" ); myMap.addLayer(routingLayer);
Once you have a routing layer added to your map, the next step is to add routes. To generate a route you will need at least two stops (an origin and a destination).
The addRoute method of the routing layer takes up to four parameters for creating a route: stops, functionOptions, and routeOptions.
The stops parameter of the addRoute method should contain an array of Objects representing the stations of the route.
| Parameter | Type | Description |
|---|---|---|
format |
[1|2|3|4|5] |
Station format type
|
name |
string |
Station name or code The following is a list of acceptable format specific to each StationFormat:
|
railroad |
string |
2 to 4 character Standard Carrier Alpha Code. |
The functionOptions parameter contains options related to the functionality of the route.
| Parameter | Type | Description |
|---|---|---|
routeId |
string |
A unique string values used to identify a route. It is needed when removing or updating a route. |
async |
boolean |
Default: true Determine whether the route request will be asynchronous. If so, a callback function can be specified. If a type of web browser, like IE, uses XDomainRequest to issue HTTP request, it is required to make asynchronous calls due to limitations of the browser. |
success |
function |
Function to be called on the success of the asynchronous routing request. |
failure |
function |
Function to be called when error happens. |
style |
ALKMaps.StyleMap |
{strokeColor: "#00C000", strokeOpacity: 0.6}Currently, strokeOpacity and strokeColor are the supported styling options.
Note: See Route Colors for more information.
|
frameRoute |
boolean |
Default: true
Indicates whether the center point and zoom level of the map will be adjusted to show the route in full frame. |
showHandles |
boolean |
Default: true
Indicates whether to show the origin/waypoint/destination graphics. |
The routeOptions parameter contains options related to the generation of the route and optional reports.
| Parameter | Type/Values | Description |
|---|---|---|
routingPreference |
[Practical|Intermodal|Shortest|
CoalBulk|AutoRacks|FuelSurcharge] |
Default is FuelSurcharge. Routing preference for route calculation.
|
distUnit |
[Miles|Kilometers] |
Default: Miles Units for distances included in the report. |
You can remove individual routes in a particular routing layer by calling the removeRoute method with the routeId of the route you would like to remove.
routingLayer.removeRoute("myRoute");
The route handles (icons displayed at the origin, destination, and waypoints) can be shown/hidden or changed.
The visibility of route handles can be set when the route is added via the showHandles option in the functionOptions of the addRoute call.
routingLayer.addRoute({
...
functionOptions:{
routeId: "DenverToOaklandCA",
showHandles: false
},
...
});
The visibility can also be changed after the route has been created via a call to the setRouteHandleVisibility on the routing layer. The function takes the routeId and a boolean value indicating the visibility as parameters.
routingLayer.setRouteHandleVisibility("DenverToOaklandCA", false);
In addition to being hidden, the route handle graphics can be changed via the setRouteHandle function on the routing layer. Changes to the route handle graphics only affect handles that are currently part of the route. Handles added after the graphic change will need to be set after they are added.
routingLayer.setRouteHandle(
"MyRoute",
"O",
{
externalGraphic: "https://maps.alk.com/api/1.2/img/fav.png"
}
);
The first parameter of setRouteHandle is the routeId of the route containing the handle to change.
The second parameter indicate which handle to change. This can be specified by either the type or index of the point. Valid types are "O" for origin, "D" for destination, or "W" for waypoint, or "A" for all types. If the route contains several stop/waypoints, all graphics will be updated. In addition to types, you may also specify the index to select the handle. The index is zero-based starting at the origin.
The third parameter is an object representing the style properties to be set. Valid style properties are:
| Property | Description |
|---|---|
externalGraphic |
The URL of the image to be used as the handle. |
graphicWidth |
The width of the image. |
graphicHeight |
The height of the image. |
graphicXOffset |
The X offset from the stop point. |
graphicYOffset |
The Y offset from the stop point. |
Different route colors are generated by the toolkit for each new route created. If you would like to specify a particular color for a route, you can pass in the color as a style object when the route is created.
routingLayer.addRoute({
...
functionOptions:{
routeId: "DenverToOaklandCA",
style: {
strokeOpacity: 0.9,
strokeColor: "#0000FF"
}
},
...
});
Currently, strokeOpacity, strokeColor, strokeLinecap, strokeWidthand strokeDashstyle are the supported styling options.
Stroke opacity value ranges are from 0 to 1. Stroke color takes hex code in string, like "#ee9900". Valid value for line cap is "butt", "round", or "square".
Valid value for dash style is "dot", "dash", "dashdot", "longdash", "longdashdot" or "solid" and most SLD patterns will render correctly.
If stroke width is supplied, default width in the context will be replaced.