Skip to content

ym.services.Routing

Overview

You can use this class to perform route calculations. Three classes are available for route planning: one for calculating a simple route (one destination), one for calculating multiple destinations (matrix route planning), and one to calculate a route based on individual GPS traces.

Initialization

Code example: Initialization Routing

// Initialization: simple routing
var routing = new ym.services.Routing();

// Initialization: Routing with multiple destinations
var matrixRouting = new ym.services.MatrixRouting();

// Initialization: Match routing
var matchRouting = new ym.services.MatchRouting();

Methods

Routing.calcRoute(waypoints, options) from v3

Parameter: waypoints

An array of LatLng-objects. The first point marks the start, the last one the destination. The points in between are interpreted as waypoints, over which the route should run.

Parameter: options

Name Description Data type Default value
type Allows specifying which routing option should be used. Options: ROUTE, TRIP, ISOCHRONE. string ROUTE
timeInMinutes Only for the type ISOCHRONE. Time in minutes in which the object can move. double null
distanceInMeters Only for the type ISOCHRONE. Distance in meters in which the object can move. double null
isochroneGrid Only for the type ISOCHRONE. Defines the fineness of the polygon that will be calculated. number null
isoLocale The locale is composed of language (ISO-639) and country (ISO-3166-2). string ym.options.locale
coordFormatOut The default coordinate format is GEODECIMAL_POINT. string GEODECIMAL_POINT
channel A character string that is logged; it can be freely selected by the user. string
speedProfile The speed profile: FAST, BICYCLE, PEDESTRIAN. string FAST
routingTimeMode The time for the routing: ARRIVAL, DEPARTURE. string ARRIVAL

Call

Code example: Routing.calcRoute(waypoints, options) Example calls
routing.calcRoute([[49.0, 10.0], [49.0, 9.0]]);
routing.calcRoute([ym.latLng(49.0, 10.0), ym.latLng(49.0, 9.0)]);
routing.calcRoute([{lat: 49.0, lng: 10.0}, {lat: 49.0, lng: 9.0}]);

MatrixRouting.calcRoute(startpoint, waypoints, options) from v3

Parameter: startpoint

A LatLng-object, which defines the starting point.

Parameter: waypoints

An array of LatLng-objects. The points represent different target points.

Parameter: options

The options are similar to those of the method calcRoute.

Call

Code example: MatrixRouting.calcRoute(waypoints, options) Example calls
matrixRouting.calcRoute(ym.latLng(49.1, 10.1), [ym.latLng(49.1, 10.1), ym.latLng(49.1, 9.1)]);
matrixRouting.calcRoute({lat: 49.1, lng: 9.1}, [{lat: 49.1, lng: 10.1}, {lat: 49.1, lng: 9.1}]);

MatchRouting.calcRoute(waypoints, options) from v3.7

Parameter: waypoints

An array of LatLng-objects. The points represent different GPS points.

Parameter: options

The options are similar to those of the method calcRoute.

Call

Code example: MatchRouting.calcRoute(waypoints, options) Example calls
matchRouting.calcRoute([ym.latLng(49.021629, 8.439032), ym.latLng(49.020770, 8.438335), ym.latLng(49.019820, 8.440667)]);
matchRouting.calcRoute([[8.439032, 49.021629], [8.438335, 49.020770], [8.440667, 49.019820]]);

Events

routing.on('success', function (request, response) {
    // Work
});

routing.on('error', function (request, response) {
    // Work
});

Code examples

This example is complete; you can save it locally and run it in an HTTP context. You only have to replace the value for apiKey before. In the example, a route between Frankfurt and Karlsruhe is calculated, where PEDESTRIAN (pedestrian) is chosen as the speed profile. In this case, only the start and end point and the route line are shown. The color, thickness, and degree of coverage of the route are defined. Note that the last feature element contains the route line.

<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>Routing example</title>
    <!-- SmartMaps Style -->
    <link href="https://www.yellowmap.de/Presentation/Yellowmaps/Examples/assets/site.css" rel="stylesheet">
    <link rel="stylesheet" href="https://www.yellowmap.de/api_js/cdn/highlight/styles/github.css">
    <style>
        .leaflet-control-zoom-in {color: red !important;}
        .leaflet-control-zoom-out {color: blue !important;}
    </style>
</head>
<body>
    <div id="map-wrapper">
    <div id="map"></div>
</div>
<script src="https://www.yellowmap.de/api_rst/api/loader?apiKey={API_KEY}&amp;libraries=enterprise-3"></script>
<script>
    var routingLayer, map;
    var rootUrl = ym.options.rootUrl;
    ym.ready({
        locale: "de-DE",
        rootUrl: rootUrl
    }, function (modules) {
        var routing = new ym.services.Routing();
        // First create a routing layer instance. You will see here 
        // the complete logic to create a route with waypoints.
        routingLayer = ym.geoJson(null, {
            style: function (feature) {
                // Draw the routing polyline. For more information about 
                // GeoJSON features and geometry, see: http://geojson.org/
                if (feature.geometry.type === "LineString") {
            // To make the line invisible, set weight to 0.
                    return {weight: 5, opacity: 0.8, color:'#406291'};
                }
            },
            // Popup of the starting point.
            onEachFeature: function(feature, layer) {
                if (feature.properties && feature.properties.description) {
                    layer.bindPopup(feature.properties.description);
                }
            },
            pointToLayer: function (feature, latlng) {
                // Draw the waypoint markers above the polyline route. You have 
                // Description and orientation information is available in the properties 
                // for a more detailed output.
                return ym.circleMarker(latlng, {
                      radius: 12,
                      fillColor: "#990000",
                      color: "#ffffff",
                      weight: 1,
                      opacity: 1,
                      fillOpacity: 0.8
                    });
            }
        });
        map = ym.map("map", {
            center: [49.001, 8.417],
            zoom: 12
        });
        map.addLayer(routingLayer);
        // From Frankfurt to Karlsruhe on foot.
        var latlngs = [];
        latlngs.push(ym.latLng(50.095685, 8.690445));
        latlngs.push(ym.latLng(49.00162,8.39905));
        routing.calcRoute(latlngs, {speedProfile: 'PEDESTRIAN'});
        routing.on("success", function (request, response) {
            // Now you can redraw.
            var route = response.body;
            var features = response.body.features;
            console.log(response.body);
            route.features = [];
            route.features.push(features[0]) // Starting point
            route.features.push(features[features.length-2]) // Destination
            // The last feature contains the route line:
            route.features.push(features[features.length-1]) // Route line
            console.log(route);
            routingLayer.addData(route);
        });
    });
</script>
</body>
</html>