Maps
Iframe URL with GET parameters for maps embeds
- Default
- Simple marker
- Marker with popup
- JSON markers
- Routing with two coordinates
- Routing with coordinates and address
Maps is a standalone page to embed based on Leaflet.js.
Default
Render with iframe URL only.
<iframe src="../templates/map.html" class="my-position mod-absolute mod-top-left u-w-100 u-h-100 u-b-none">
Simple marker
Adding latitude and longitude automatically adds a marker on the map.
GET parameter | Description |
---|---|
p1_lat |
Latitude |
p1_lng |
Longitude |
<iframe src="../templates/map.html?p1_lat=45.5456975&p1_lng=5.9704754" class="my-position mod-absolute mod-top-left u-w-100 u-h-100 u-b-none"></iframe>
Marker with popup
Add custom text fields on the popup.
GET parameter | Description |
---|---|
p1_lat |
Latitude |
p1_lng |
Longitude |
p1_name |
Custom heading for the popup |
p1_address |
Any text string |
p1_zipcode |
Any text string |
p1_city |
Any text string |
p1_open_popup |
Can be either 1 or 0 or true or false - Sets if the popup is starting opened or closed |
<iframe src="../templates/map.html?p1_lat=45.5456975&p1_lng=5.9704754&p1_name=IT Automotive&p1_address=351 Av. des Massettes&p1_zipcode=73190&p1_city=Challes-les-Eaux&p1_open_popup=1" class="my-position mod-absolute mod-top-left u-w-100 u-h-100 u-b-none"></iframe>
JSON markers
Adding multiple markers at once from a JSON file.
GET parameter | Description |
---|---|
map_markers_json |
URL of the JSON. Can be either relative or absolute |
<iframe src="../templates/map.html?map_markers_json=../js/concessions.json" class="my-position mod-absolute mod-top-left u-w-100 u-h-100 u-b-none"></iframe>
Routing with two coordinates
Trace a route between two coordinates.
GET parameter | Required or not | Description |
---|---|---|
p1_lat |
Required | Latitude point 1 |
p1_lng |
Required | Longitude point 1 |
p2_lat |
Required | Latitude point 2 |
p2_lng |
Required | Longitude point 2 |
<iframe src="../templates/map.html?p1_lat=45.5456975&p1_lng=5.9704754&p2_lat=45&p2_lng=3" class="my-position mod-absolute mod-top-left u-w-100 u-h-100 u-b-none"></iframe>
Routing with coordinates and address
Trace a route between one coordinate and a postal address.
GET parameter | Required or not | Description |
---|---|---|
p1_lat |
Required | Latitude point 1 |
p1_lng |
Required | Longitude point 1 |
p2_address |
Required | Any text string for the point 2 |
p2_zipcode |
Required | Any text string for the point 2 |
p2_city |
Required | Any text string for the point 2 |
p1_name |
Optional | Custom heading for the popup of the point 1 |
p1_address |
Optional | Any text string for the point 1 |
p1_zipcode |
Optional | Any text string for the point 1 |
p1_city |
Optional | Any text string for the point 1 |
p1_open_popup |
Optional | Can be either 1 or 0 or true or false - Sets if the popup is starting opened or closed for the point 1 |
p2_name |
Optional | Custom heading for the popup of the point 2 |
p2_open_popup |
Optional | Can be either 1 or 0 or true or false - Sets if the popup is starting opened or closed for the point 2 |
<iframe src="../templates/map.html?p1_lat=45&p1_lng=3&p2_address=351 Av. des Massettes&p2_zipcode=73190&p2_city=Challes-les-Eaux" class="my-position mod-absolute mod-top-left u-w-100 u-h-100 u-b-none"></iframe>