# Leaflet / Sélecteur de fonds de carte

Carte leaflet avec fonds de carte issus de flux de tuiles raster et de flux WMS

<html>
<head>
<title>A Leaflet map!</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.0.3/dist/leaflet.js"></script>

</head>

<body>

//Appel et configuration carte
  
var map = L.map('map', {
                 center: [48.11, -1.66],
                 zoom: 13 });
   
   
  // Ajout fonds de carte (tile et WMS)

var baselayers = {
     
// Services de tuiles
	
     OSM: L.tileLayer('https://{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png',{attribution: '&copy; Openstreetmap France | &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}),
     ESRI: L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}', ),
     Hydda: L.tileLayer('https://{s}.tile.openstreetmap.se/hydda/base/{z}/{x}/{y}.png'),
     CartoDB: L.tileLayer('https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png'),
     
// WMS
	
OrthoRM:L.tileLayer.wms('https://public.sig.rennesmetropole.fr/geoserver/ows?', {layers: 'raster:ortho2014',  opacity: 0.5}),
Ancien:L.tileLayer.wms('https://geobretagne.fr/geoserver/photo/wms?', {layers: 'satellite-ancien'})

};baselayers.OSM.addTo(map);

// Selecteur fonds de carte
 
L.control.layers(baselayers, null, {position: 'topright', collapsed : false }).addTo(map);
  
  // Echelle cartographique
  
L.control.scale().addTo(map);

</script>
   
</body>
</html>

https://unpkg.com/leaflet@1.0.3/dist/leaflet.js