As previously announced, HERE recently released the Intermodal Routing API. Intermodal routing is a novel capability that allows users to find routes across different modes of transportation, such as combining air and ground travel, rail and bike share, or public transit and taxi services.
Current routing services can only route across a single mode of transport—for example, car routing, public transit routing or bike routing. Combining modes really opens new possibilities.
Because Park and Ride is a common and oft-requested application for intermodal routing, we implemented it first. Park and Ride enables use cases ranging from calculating your personal best route to reach your office, to showing customers a map with comfortable Park and Ride solutions to reach your company headquarters in a congested city, to offering a fully flexible Park and Ride Routing solution.
Please note that HERE is offering Park and Ride Routing only in specific locations—see the Coverage Information for currently supported cities. This list is growing as we collect the necessary data for more and more destinations, so check back soon if you don't see what you're looking for now.
Without further ado, let's show you how to implement a map using the HERE Intermodal Routing API on your website.
What you need
To work with any HERE API, you need to get yourself a pair of credentials. They consist of an App ID and an App Code. You can get your own set of credentials by signing up for free on developer.here.com. After signing up you will see an option to generate an App ID and an App Code. If you have already signed up, you can access your credentials on your "Projects" page.
For this API, licensing compliance means there's one extra hoop to jump through to activate access. Please fill out the form on the Contact Us page, noting your App ID and requesting that it's enabled for the Intermodal Routing API. We'll try to respond ASAP, but it can take up to three days to activate.
- Part 1: Basic Map Set-up
- Part 2: Geolocation
- Part 3: Basic Routing
- Part 4: Advanced Routing
- Part 5: Refactoring
- Part 6: Reacting to outside influences
- Part 7: Traffic
- Part 8: Wrapping Up
Finally: some code!
here.js, which we are writing next:
Now you have set up a HERE map, centered at the HERE Chicago offices, which are located at 41.884238 degrees North, 87.638862 West. (See? You already learned something!) It should look approximately like this:
tools.js, which, you may have noticed, we are already including in the HTML file above:
Now that you have the basics in place, you are ready for the big moment: Firing off a request to the HERE Intermodal Routing API. The request will look like this:
The request parameters are the app ID and app code you set up earlier, the parameter
profile you use to specify you want a Park and Ride route,
arr to specify the coordinates of your start and end point, and a
time for which you want the route to be calculated.
If you look at the function
Mobility.prototype.route above, you will see this request being assembled, along with the parameters
maneuvers, which are needed if you want to visualize the returned route - if you don't want to know the geometry and maneuvers for the route, you can omit them.
And here is (an edited version of) what the response will look like. Actually, you'll get a much longer response, but we are limiting ourselves to the bits that are interesting for this tutorial. For a depiction of the full response, see the Park and Ride Routing Example from the documentation.
The response gives us a JSON list of three
Connection objects (of which only one is shown here), each of which contains a list of
Sec objects (again, we are only showing the first one). The
Sec objects represent parts of the journey between which the vehicle is switched. Most importantly for us here, they also contain the
Graph object, which we use to visualize the route on the map.
Let's use our utility class to make a request to the HERE Intermodal Routing API and visualize the response. To the end of the
here.js file, add this code:
And with just that you have requested and displayed a Park and Ride route on a map. Your result, depending on the start point you use, should look something like this:
Now you can go forth and modify the code to suit your needs!