martin/tests/debug.html
2019-08-30 18:42:24 +03:00

63 lines
1.3 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Martin Debug Page</title>
<meta
name="viewport"
content="initial-scale=1,maximum-scale=1,user-scalable=no"
/>
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.js"></script>
<link
href="https://api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.css"
rel="stylesheet"
/>
<style>
body {
margin: 0;
padding: 0;
}
#map {
position: absolute;
top: 0;
bottom: 0;
width: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
mapboxgl.accessToken =
'pk.eyJ1Ijoic3RlcGFua3V6bWluIiwiYSI6Ik1ieW5udm8ifQ.25EOEC2-N92NCWT0Ci9w-Q';
var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/light-v9',
zoom: 0,
center: [0, 0]
});
map.on('load', function() {
map.addLayer({
id: 'public.points',
type: 'circle',
source: {
type: 'vector',
url: 'http://0.0.0.0:3000/public.points.json'
},
'source-layer': 'public.points'
});
map.on('click', 'public.points', function(event) {
console.log(event.features);
});
});
</script>
</body>
</html>