Embedding the map works by including an iframe HTML tag into your website. The most basic variant looks like the following:
<iframe src="https://map.bikecitizens.net/embedded?cccode=de-bremen" height="700px" width="100%" frameborder="0"></iframe>
This includes an iframe with the given dimensions¹ to your site in which the Bike Citizens route planer is displayed. The city to be shown is set in the cccode parameter, here the city of Bremen is used as an example. See the list of available cities for the respective city-code of your city.
There are a number of parameters with which one can customize the behaviour of the embedded map.
See a few examplesParameter | Required | Description | Example | Default |
---|---|---|---|---|
cccode | true | Sets the country/city code of your embedded map. See full list here. | cccode=at-graz | none |
addr0 addr1 |
false | Preset the address input fields with the given value. addr0 is the start point, addr1 the destination of the route. These two parameters can be set indedendently from each other |
addr0=Main%20Street%2012& addr1=… |
none |
minutes | false | If present, the map is started in 5 minutes by bike mode with the given value as the duration in minutes. | minutes=5 | none |
routing_profile | false | Sets the routing profile. Allowed values are: 0 (easy), 1 (balanced), 2 (fast) | routing_profile=2 | 1 |
bike_profile | false | Sets the bike profile. Allowed values are: 0 (mountain bike), 1 (city bike), 2 (road bike) | bike_profile=0 | 1 |
lat lon |
false | Set the initial center of the map position by providing latitude and longitude coordinates | lat=47.135&lon=9.52 | city center |
zoom | false | Set the initial zoom level for the map. An integer that goes from 0 to 19 | zoom=15 | 13 |
It is possible to have a branded version of the Bike Citizens map which better integrates into your website. To learn more about this, contact us at dev@bikecitizens.net.
See an example of this here