leaflet_wms_crs

by abubelinha

HTML

<div id="map" style="width: 600px; height: 400px"></div>
<div><span id="zoomlevel"></span>
</div>
<script src=" http://leafletjs.com/examples/sample-geojson.js" type="text/javascript "></script>
<script src="http://leafletjs.com/dist/leaflet.js"></script>

CSS

</style> <!-- access to the HEAD element --> <link rel="stylesheet" href="http://leafletjs.com/dist/leaflet.css" /> <!--[if lte IE 8]><link rel="stylesheet" href="http://leafletjs.com/dist/leaflet.ie.css" /><![endif]--> <style>

JavaScript

var map = L.map('map').setView([42.5510550665, -9.0208868238], 5);

//L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);

var temperature = new  L.tileLayer.wms('http://gis.srh.noaa.gov/arcgis/services/NDFDTemps/MapServer/WMSServer', {
    format: 'img/png',
    transparent: false,
    layers: 16
}).addTo(map);

var precipitation = new  L.tileLayer.wms('http://nowcoast.noaa.gov/wms/com.esri.wms.Esrimap/obs', {
    format: 'image/png',
    transparent: false,
    layers: 'RAS_RIDGE_NEXRAD'
}).addTo(map);

var wms3 = new L.TileLayer.WMS("http://www.ign.es/wms-inspire/pnoa-ma", {
    layers: "pnoa",
    format: "image/jpeg",
    transparent: false,
    minZoom: 18,
    maxZoom: 20,
    attribution: "this is wms 3"
}).addTo(map);
var wms4 = new L.TileLayer.WMS("http://www.idee.es/wms/MTN-Raster/MTN-Raster", {
    layers: "mtn_rasterizado",
    format: "image/png",
    transparent: false,
    maxZoom: 17,
    attribution: "this is wms 4"
}).addTo(map);

map.addEventListener('zoomend', onMapZoom);

function onMapZoom(e) {
    $("#zoomlevel").html(' zoom ' + map.getZoom());
}