Skip to content

Instantly share code, notes, and snippets.

@Sumbera
Last active January 6, 2017 22:15
Show Gist options
  • Save Sumbera/dcfcc3887ff56a9e1928 to your computer and use it in GitHub Desktop.
Save Sumbera/dcfcc3887ff56a9e1928 to your computer and use it in GitHub Desktop.
SVG default overlay in Leaflet v 1.0
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>SVG default SVG in Leaflet 1.0</title>
<link rel="stylesheet" href="http://www.sumbera.com/gist/js/leaflet/svg/scaled/leaflet.css" />
<style>
body {
margin: 0px;
}
#map {
position: absolute;
height: 100%;
width: 100%;
background-color: #333;
}
</style>
</head>
<body>
<script src="http://www.sumbera.com/gist/js/leaflet/svg/scaled/leaflet.js"></script>
<script src="http://www.sumbera.com/gist/data.js" charset="utf-8"></script>
<div id="map">
</div>
<div id="tooltip" style="width:230px; height:100px;">
</div>
<script>
var lmap = new L.map('map').setView([50.00, 14.44], 9)
.addLayer(L.tileLayer("http://{s}.sm.mapstack.stamen.com/(toner-lite,$fff[difference],$fff[@23],$fff[hsl-saturation@20])/{z}/{x}/{y}.png"));
var circles = new L.LayerGroup();
var radius = 3;
for (var i = 0; i <data.length; i++) {
var d = data[i];
var circle = L.circle([d[0],d[1]], radius, {
color: 'red',
fillColor: '#f03',
fillOpacity: 0.5
}).addTo(circles);
}
circles.addTo(lmap);
/***********************/
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment