How to make use of it:

1. Load the mandatory jQuery library and Leaflet Map within the doc.

<link rel="stylesheet" href="/path/to/cdn/leaflet.css" />
<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/cdn/leaflet.js"></script>

2. Load the Leaflet.UTM for those who use UTM coordinates.

<script src="/path/to/cdn/L.LatLng.UTM.min.js"></script>

3. Load the Stamen Maps for those who want a particular background: ‘terrain’ | ‘toner’ | ‘watercolor’.

<script src="//maps.stamen.com/js/tile.stamen.js"></script>

4. Create a container wherein you need to embed the Leaflet map.

<div id="myMap"></div>

5. Create a primary Leaflet map on your web page.

$("#myMap").am_map({
  // options here
});

6. Customize the Leaflet map with the next properties.

$("#myMap").am_map({

  // center of the map
  center: [41.55, 2.45],

  // map height
  height: '400px',

  // 'terrain' | 'toner' | 'watercolor' | 'osm'
  background: 'osm',

  // initial zoom level
  iniZoom: 12
  
});

7. Add customized layer markers to the map.

$("#myMap").am_map('addLayer', { 
  
  // unique name
  'name' : 'myLayer', 

  // marker point
  'points' : [ 41.55, 2.45, { 
    'code' : 1, 
    'name' : 'Title', 
    'desc' :'Description' 
  }], 

  // UTM zone code
  'UTMzone' : 33, 

  // is south hemisphere
  'UTMsouth' : true,

  // custom icon HTML
  icon: '',

  // initial zoom level
  zoom: 10,

  // zoom level at which the layer is visible
  limitZoom: 12,

  // url
  'url' : ' ',

});

Create A Leaflet Map With Interactive Layers, am_map.js Plugin/Github

See Demo And Download