Skip to content

Route On Map

In this guide you will learn how to compute a route between a departure and destination, and render the route on an interactive map, supporting pan and zoom. The map will be centered on the route such that the route fits in the viewport.


It is required that you complete the Environment Setup - CPP Examples guide as well as the Create a Project - CPP Examples guide and the Interactive Map guide before starting this guide.

Compute a route

Open the file CenterMap.cpp and add the following include.

1#include <API/GEM_RoutingService.h>

Comment out or delete the following line, which flies the camera to the specified latitude, longitude coordinates.

1//mapView->centerOnCoordinates({ 37.768741, -122.482696 }, 60);
Add the code below instead of the line above.
 1gem::RouteList routes;
 3   ProgressListener calculateRouteListener;
 4   gem::LandmarkList waypoints;
 5   waypoints.push_back(gem::Landmark("San Francisco", { 37.77903, -122.41991 }));
 6   waypoints.push_back(gem::Landmark("San Jose", { 37.33619, -121.89058 }));
 7   gem::RoutePreferences preferences;
 8   gem::RoutingService().calculateRoute(routes, waypoints, preferences, &calculateRouteListener);
 9   auto ret = WAIT_UNTIL(std::bind(&ProgressListener::IsFinished, &calculateRouteListener), 15000);
11if (routes.size() > 0)
13   mapView->preferences().routes().add(routes[0], true);
14   mapView->centerOnRoute(routes[0], gem::Rect(), gem::Animation(gem::AnimationLinear, gem::ProgressListener(), 3000));
This defines a LandmarkList containing at least 2 waypoints, where the first one is the departure point and the last one is the destination.
Each waypoint has a name string, a latitude, in degrees, and a longitude, in degrees.
Next, gem::RoutingService().calculateRoute() is used to compute the route and wait for the results.
The route computation results are stored in gem::RouteList routes; There could be 0 or more resulting routes between the specified departure and destination. If there is at least one route, that is,
if (routes.size() > 0) then the first route (at index 0) is selected and added to the mapView. Then, mapView->centerOnRoute() is used to fly the camera to the route, such that the bounding box containing the route fits in the viewport.

Try it out!

vstudio route on map - example CPP screenshot

Click the green arrow play button at the top to compile and run the project. After the route is computed and rendered on the map, you can pan the map and zoom in/out using the mouse scroll wheel.