Leaflet: Minimap and bottom center

I added a minimap on the leaflet page. Pretty easy to integrate:

• Host the 2 important file from the plugin
  • Control.MiniMap.js
  • Control.MiniMap.css
• Load them in your head balise

  • <!-- Minimap -->
    <!-- https://github.com/Norkart/Leaflet-MiniMap
    Copyright (c) 2012, Norkart AS
    All rights reserved. -->
    <script src="js/Minimap/Control.MiniMap.js"></script>
    <link  href="js/Minimap/Control.MiniMap.css" rel="stylesheet"/>
    

• Load in on the map (OpenStreetMap_France is a L.tileLayer already loaded before)

  • // Minimap
    var miniMap = new L.Control.MiniMap(OpenStreetMap_France, {
      position: 'bottomleft'
    }).addTo(map);
    

---

I added a scale in the center as well (needed a control plugin - topcenter)

Just load the css and js needed:

<!-- topcenter -->
<link  href="js/topcenter/leaflet-control-topcenter.css" rel="stylesheet"/>
<script src="js/topcenter/leaflet-control-topcenter.js"></script>

You will have 2 new values available for the position option of the Control from leaflet:

• bottomcenter
• topcenter

E.g. L.control.scale({imperial: false, position: 'bottomcenter'}).addTo(map);