Leaflet z index (markernd polygons) - leaflet 1.0 beta 2

by Leo

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.0-beta.2/leaflet-src.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.0-beta.2/leaflet.css">
<body>
<button onclick="addMarker()">add marker</button>
<button onclick="aaa()">set cursor</button>
<div id="map" ></div>
</body>

CSS

html, body, #map {
        margin: 0;
        width: 100%;
        height: 100%;
}

JavaScript

var map = new L.Map('map', {
                center: new L.LatLng(45.5 + 0.003,-73.5 + 0.003),
                zoom: 16
            });

L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'}).addTo(map);

var marker1 = L.marker(
    new L.LatLng(45.5 + 0.003,-73.5 + 0.003)
);
var marker2 = L.marker(
    new L.LatLng(45.5 + 0.004,-73.5 + 0.004)
);
map.addLayer(marker1);


window.addMarker = function()
{
    var ic = new L.Icon({
    "iconUrl": "//www.gravatar.com/avatar/9dab13125122876602e52b264434b155/?default=&s=64",
     "cursor": "pointer",
     "interactive": true,
     "draggabel": true
    });
    marker1.setIcon(ic);
    marker1._initInteraction()
    //L.DomUtil.addClass(marker1._icon, 'leaflet-interactive');
    map.addLayer(marker2);
}


window.aaa = function()
{     
    var a = document.getElementById('map');
    a.style.cursor ='crosshair'
}