Formatting User Instructions with HTML and CSS
To customize the presentation for your users, you can use predefined CSS classes to format the HTML output of the routing instructions. To do this, set the instructionFormat
request parameter to html
, that augments maneuver instructions with HTML markup and associated CSS classes.
-
company
: transit company name -
station
: station name -
transit
: transit type -
line
: transit line name -
destination
: line destination name -
distance-description
: entire statement that describes the distance to proceed, for example, "follow for n stops" -
stops
: number of stops or stations in "follow for" statement, for example, "n stops"
Public Transit Routing Instructions with HTML
Examples of HTML-wrapped output from the service, with associated classes are shown below.
enter
maneuver: Go to the <span class="company">U</span> station
<span class="station">U Pankstr. (Berlin)</span>
and take the <span class="transit">rail</span>
<span class="line">U8</span> towards
<span class="destination">S+U Hermannstr. (Berlin)</span>.
<span class="distance-description">
Follow for <span class="stops">1 station</span></span>.
change
maneuver: At station <span class="station">S+U Gesundbrunnen Bhf (Berlin)
</span> change to the line
<span class="line">S1</line> towards
<span class="destination">S Wannsee Bhf (Berlin)</span>.
<span class="distance-description">Follow for
<span class="stops">1 stations</span></span>.
leave
maneuver: Leave the line <span class="line">S1</span> at station
<span class="station">S+U Potsdamer Platz Bhf (Berlin)</span>
and leave the station