Skip to content

Instantly share code, notes, and snippets.

@wipfli

wipfli/maplibre-demotile-prefetch.html

Created July 16, 2024 15:19
Show Gist options
  • Save wipfli/0d0e1a90b6c66a4f0aead027cf829fad to your computer and use it in GitHub Desktop.
Save wipfli/0d0e1a90b6c66a4f0aead027cf829fad to your computer and use it in GitHub Desktop.
Download ZIP
Raw
maplibre-demotile-prefetch.html
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<script src='https://unpkg.com/[email protected]/dist/maplibre-gl.js'></script>
<link href='https://unpkg.com/[email protected]/dist/maplibre-gl.css' rel='stylesheet' />
<link href="https://demotiles.maplibre.org/style.json" rel="preload" as="fetch" />
<link href="https://demotiles.maplibre.org/tiles/tiles.json" rel="preload" as="fetch" />
<link href="https://demotiles.maplibre.org/tiles/1/1/1.pbf" rel="preload" as="fetch" />
<link href="https://demotiles.maplibre.org/tiles/1/1/0.pbf" rel="preload" as="fetch" />
<link href="https://demotiles.maplibre.org/tiles/1/0/1.pbf" rel="preload" as="fetch" />
<link href="https://demotiles.maplibre.org/tiles/1/0/0.pbf" rel="preload" as="fetch" />
<link href="https://demotiles.maplibre.org/font/Open%20Sans%20Semibold/0-255.pbf" rel="preload" as="fetch" />
<style>
#map {position: absolute; top: 0; right: 0; bottom: 0; left: 0;}
</style>
</head>
<body>
<div id="map"></div>
<script>
var map = new maplibregl.Map({
container: 'map',
style: 'https://demotiles.maplibre.org/style.json',
center: [0, 0],
zoom: 1
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment