Map & elevation chart API

The map & elevation chart API provides a means for you to embed any given race into your website with a simple HTML iframe code. For instance, the placing the code

<iframe src="https://www.hellodrifter.com/events/sean-o-brien-2017/races/67/map_with_chart?line_color=f00&skin=outdoors" width="100%" height="500px"></iframe>

in your website would produce something like this:

The URL to access the map & elevation chart API for any given race can be found by clicking the "Embed map code" link on the sidebar of a race page.

You'll notice that the hello,drifter link in the iframe tag has a ? followed two parameter/value pairs separated by a & character: line_color=f00&skin=outdoors . These parameters tell hello,drifter to (1) make the line color red ( ff0 is a hexidecimal code for a certain red), and (2) use the 'outdoors' map skin.

The below table describes the available parameters using the map & elevation chart API.

Parameter Default value Available values Description
line_color 0066ff The line color for the route. Can be any valid 3-digit or 6-digit hex color. The color of the line color used by the map.
line_opacity 0.5 The line opacity (i.e., transparency) for the route. Any value from 0 to 1.
markers true true, false, t, f Whether to show point of interest markers when the map loads.
marker_shape pin Either "pin" or "circle" The shape of any point of interest markers.
outline_color Slightly darker than the `line_color` value. (Note that outline_color does not visually appear unless the `outline_opacity` is changed from its default of 0, i.e., invisible.) Any valid 3-digit or 6-digit hex color. The outline color for the route's line (see `line_color`)
outline_opacity 0, meaning completely transparent. The opacity (i.e., transparency) for the route line's outline. Any value from 0 to 1.
skin run-bike-hike Any recognized Mapbox tile skin: streets, light, dark, satellite, streets-satellite, wheatpaste, streets-basic, comic, outdoors, run-bike-hike, pencil, pirates, emerald, and high-contrast . The tile skin to be used by the map.
unit_system "null", meaning that the system will display units in the system it believes is appropriate for the user based on the requesting IP address (not always accurate) Either "metric" or "imperial" The system of measurement (kilometers/meters vs. miles/feet) to be displayed to the user.