leaflet-wms-header
Version:
Custom headers on Leaflet TileLayer WMS
29 lines (28 loc) • 1.23 kB
HTML
<html>
<head>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css"/>
<style>
#mapid { height: 800px; }
</style>
</head>
<body>
<div id="mapid"></div>
<button id="abort">Abort</button>
<script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/2.5.3/rx.all.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs-dom/7.0.3/rx.dom.min.js"></script>
<script src="../index.js"></script>
<script>
var mymap = L.map('mapid').setView([51.505, -0.09], 13);
var abortButton = document.getElementById('abort');
var cl = Rx.DOM.click(abortButton)
L.TileLayer.wmsHeader('https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png', {
maxZoom: 17,
attribution: 'Map data: © <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, <a href="http://viewfinderpanoramas.org">SRTM</a> | Map style: © <a href="https://opentopomap.org">OpenTopoMap</a> (<a href="https://creativecommons.org/licenses/by-sa/3.0/">CC-BY-SA</a>)'
},
null,
cl
).addTo(mymap);
</script>
</body>
</html>