Leaflet with google maps
by Leo
HTML
<script src="https://maps.google.com/maps/api/js?sensor=false&dummy=.js"></script>
<script src="https://rawgithub.com/shramov/leaflet-plugins/master/layer/tile/Google.js"></script>
<link rel="stylesheet" href="//cdn.leafletjs.com/leaflet-0.7.3/leaflet.css">
<script src="//cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
<body>
<div id="map" ></div>
</body>
CSS
html, body, #map {
margin: 0;
width: 100%;
height: 100%;
}
JavaScript
debugger;
var pos1 = new L.LatLng(45.5,-73.5);
var pos2 = new L.LatLng(45.5002,-73.5002);
var map = new L.Map('map', {
center: pos1,
zoom: 16,
// markerZoomAnimation:false
});
//var ggl = new L.Google('ROADMAP');
//map.addLayer(ggl);
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'}).addTo(map);
var icon1 = L.marker(pos1);
var icon2 = L.marker(pos2);
var iconLayer1 = L.layerGroup([icon1]);
var iconLayer2 = L.layerGroup([icon2]);
debugger;
iconLayer1.setZIndex(2000);
iconLayer2.setZIndex(1000);
iconLayer1.addTo(map);
iconLayer2.addTo(map);