We created a simple page and added google maps to it.
We want to show the route on the map as well as show a directions list below it. Click on your page where you'd like to add the directions list (1). Add a new component (2). Under display menu, select google directions (3-4).
Select the directions component in the app connect tree (1). Attach it to your map by selecting it from the drop-down (2-3).
Add the directions origin address (1). Add the destination address (2). You can add some way points if you want to (3). You can add departure and arrival times to find the best route, based on estimated traffic and transit schedules (4). Enable the show directions option in order to display the directions list on your page (5).
Select the travel mode (1-2).
Setup the route options like: avoid tolls, avoid ferries, etc (1). Select whether the map pins should be dragable or not (2).
And we are done! Let's preview the results.
You can see the suggested routes and select any of them. You can check the directions list below. That's how easy it is to add directions on your page using App Connect Google Directions.