Leaf Map
Preparing your page
-
Include Leaflet CSS & JavaScript file in your document aftter that Put a div element with a certain id where you want your map to be:
<!-- Leaf Map css -->
<link rel="stylesheet" type="text/css" href="assets/css/vendors/leaflet-map.css" />
<!-- Leaf Map js -->
<script src="assets/js/leaflet-map.js"></script>
<script src="assets/js/leaflet-map-custom.js"></script>
<div id="map"></div>
-
Make sure the map container has a defined height, for example by setting it in CSS:
#map{ height: 180px; }
-
Visit Full Documentation
Google Map
Preparing your page
-
Include below iframe and give it height and width.
Bing Map
Preparing your page
-
Include below iframe and give it height and width.
<iframe class="map-iframe"
src="https://www.bing.com/maps/embed?h=245&w=766&cp=51.94946643539271~-0.9383425026094301&lvl=9&typ=d&sty=r&src=SHELL&FORM=MBEDV8">
</iframe>