Generate static, dynamic and editable maps from semantic HTML

Hotlink the script

Copy these 2 lines into the head section of your HTML.

Check out the source

Everything is available at GitHub. Check out Clone it, fork it, use it!

Bootmap on GitHub


Simple Maps

Bootmap turns this

<div id="map1" style="width: 400px; height: 300px" data-map data-lat="40" data-lng="4" data-zoom="5"></div>

into this


Editable polygon

Bootmap turns this

<div id="map2" data-map data-input="#map3_data" style="width: 400px; height: 300px"></div>
<textarea data-map="map2" data-format="wkt">
    POLYGON((4 40, 5 40, 5 45, 4 45, 4 40), (4.2 41, 4.8 44, 4.8 41, 4.2 41))

If you edit the polygon on the right, you will see the textarea below it change.

into this


Load KML files

Bootmap turns this

<div id="map3" data-map data-format="wkt-file" style="width: 400px; height: 300px"></div>

into this