URL, iFrame & Dynamic Links

Racemap provides interactive content through a unique URL. Embed your Tracking Map, Leaderboard or the activity upload directly on your pages using iFrame. Dynamic links activate specific features.

Unique URL & Event-ID

When saving a tracking map an unique URL/ app link and an event ID are generated.

  • URL: to open a specific tracking map in any browser, works on computers, tablets and smartphones

  • App Link: to open a "unlisted" Tracking Map in Racemap app, therefore our tracking app needs to be installed

  • Event-ID: to be found in backend URL of your event

Unique URL of the Map for 100km-Duathlon 2018

The App Link is build of a static part and the unique Eventslug. For the example above the App-Link is https://racemap.com/app/events/100km-duathlon_2018-05-05/player. With the Eventslug - 100km-duathlon_2018-05-05.

https://racemap.com/app/events/EVENTSLUG/player

Racemap Event-ID can be found in the Backend URL of your Tracking Map.

iFrame Integration

Embed your Tracking Map or your Leaderboard on any homepage and blog. Through the iFrame you show the interactive tracking map directly on your sites. Your visitors don't need to navigate to external pages. See the link and the corresponding html-code of the event 100km-Duathlon: Tracking Map: https://racemap.com/player/100km-duathlon_2018-05-05/

<iframe src="https://racemap.com/player/100km-duathlon_2018-05-05" loading="lazy" allowfullscreen webkitallowfullscreen mozallowfullscreen style="border: none; box-shadow: 0 0 10px rgb(112, 139, 161); width: 100%; height: 800px;"></iframe>

The parameters width: 100% and height: 800px adjust the size of the tracking map on your webpage.

Sample with embedded Tracking Map https://racemap.com/features#embedded-racemap-100d

iFrame Options - more focus on your map – to skip the start screen just add ?embed=true to the link: https://racemap.com/player/100km-duathlon_2018-05-05/?embed=true

<iframe style="border: none; width: 650px; height: 550px;"src="https://racemap.com/player/100km-duathlon_2018-05-05/?embed=true"allowfullscreen="allowfullscreen"></iframe>

nice shadow around your map and dynamic width for your tracking map

<iframe src="https://racemap.com/player/100km-duathlon_2018-05-05/?embed=true"allowfullscreen webkitallowfullscreen mozallowfullscreen style="border: none; box-shadow: 0 0 10px rgb(112, 139, 161); width: 100%; height: 800px;"></iframe>

Leaderboard: https://racemap.com/timing/virtual-race Sample with embedded Leaderboard https://racemap.com/test20191101#embed-leaderboard

<iframe src="https://racemap.com/timing/virtual-race" loading="lazy" allowfullscreen webkitallowfullscreen mozallowfullscreen style="border: none; box-shadow: 0 0 10px rgb(112, 139, 161); width: 100%; height: 800px;"></iframe>

Activity Upload: https://racemap.com/upload Sample with embedded activity upload https://racemap.com/test20191101#embed-upload-activity

<iframe src="https://racemap.com/upload?key=GJH1ZL" allowfullscreen webkitallowfullscreen mozallowfullscreen style="border: none; box-shadow: 0 0 10px rgb(112, 139, 161); width: 100%; height: 850px;"></iframe>

Dynamic Links

Follow – Racemap moves with selected athlete and creates a dynamic URL you can share, e.g. URL to follow the team "Flaming Sideburns" at 100km-Duathlon: https://racemap.com/player/100km-duathlon_2018-05-05/?embed=true/#follow=5ba8e1900e341e2f93f036f1 &selected=5ba8e1900e341e2f93f036f1

<iframe style="border: none; width: 650px; height: 550px;"src="https://racemap.com/player/100km-duathlon_2018-05-05/?embed=true/#follow=5ba8e1900e341e2f93f036f1&selected=5ba8e1900e341e2f93f036f1"allowfullscreen="allowfullscreen"></iframe>

Select – To highlight participants in your Racemap. You can select one category of athletes only and save this group of selected athletes with a dynamic URL.

https://racemap.com/player/100km-duathlon_2018-05-05/?embed=true/ #follow= 5ba8e1900e341e2f93f036f1&selected=5ba8e1900e341e2f93f036f1, 5ba8e190f653df2f98804c40, 5ba8e190e6950a2f99bdc41b,5ba8e19076addf2fa3adc1ea

iframe style="border: none; width: 650px; height: 550px;"src="https://racemap.com/player/100km-duathlon_2018-05-05/?embed=true/#follow=5ba8e1900e341e2f93f036f1&selected=5ba8e1900e341e2f93f036f1,5ba8e190f653df2f98804c40,5ba8e190e6950a2f99bdc41b,5ba8e19076addf2fa3adc1ea"allowfullscreen="allowfullscreen"></iframe>