Skip to content

Instantly share code, notes, and snippets.

@robshep

robshep/index.html

Created April 24, 2018 09:40
Show Gist options
  • Save robshep/32aab96c67b82734ddb9f4edf9787469 to your computer and use it in GitHub Desktop.
Save robshep/32aab96c67b82734ddb9f4edf9787469 to your computer and use it in GitHub Desktop.
Download ZIP
UKHO Bathymetry Tiles
Raw
index.html
<html>
<head>
<title>Demo leaflet.TileLayer.WMTS</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.js"></script>
<script src="https://rawgithub.com/mylen/leaflet.TileLayer.WMTS/master/leaflet-tilelayer-wmts.js"></script>
</head>
<body>
<div id="map" style="height: 100%; width: 100%"></div>
<script>
/** Define the layer type
*/
var layerIGNScanStd = "DAC_RASTERS.Bathymetry_Mosaic_Depth";
// The WMTS URL
var url = "http://aws2.caris.com/sfs/services/ows/wmts/UKHO_WMTS?request=GetCapabilities&service=WMTS";
var ign = new L.TileLayer.WMTS( url ,
{
layer: layerIGNScanStd,
style: "normal",
tilematrixSet: "PM",
format: "image/jpeg",
attribution: "<a href='https://github.com/mylen/leaflet.TileLayer.WMTS'>GitHub</a>&copy; <a href='http://www.ign.fr'>IGN</a>"
}
);
var map = L.map('map').setView([55.0, 0], 13);
L.control.scale({'position':'bottomleft','metric':true,'imperial':false}).addTo(map);
map.addLayer(ign);
var baseLayers = {"UKHO Bathymetry" : ign};
L.control.layers(baseLayers, {}).addTo(map);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment