Skip to content

Instantly share code, notes, and snippets.

Last active February 9, 2017 16:30
  • Star 2 You must be signed in to star a gist
  • Fork 3 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save ZJONSSON/5602552 to your computer and use it in GitHub Desktop.
Nelson's rivers (d3_geoJSON plugin)
<!DOCTYPE html>
<html lang="en"><head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0"/>
<title>Leaflet vector tile map of rivers</title>
<link rel="stylesheet" href="" />
<!--[if lte IE 8]>
<link rel="stylesheet" href="" />
<script src=""></script>
<script src=""></script>
<script src=""></script>
<script src="" charset="utf-8"></script>
<script src=""></script>
<script type="text/javascript" src=""></script>
<style type="text/css">
html, body { height: 100% }
#map { min-height: 100%; }
body {
margin: 0;
font-family: Helvetica, Arial, sans-serif; font-size: 12px;
overflow: hidden;
background-color: #f00;
.leaflet-popup-content-wrapper {
-webkit-border-radius: 5px;
border-radius: 5px;
.river {
fill : none;
stroke : blue;
<div id="map"></div>
<a href=""><img
width="149" height="149" src="" alt="Fork me on GitHub"
<script type="text/javascript">
// Construct map, center if no location provided
var map ='map', { maxZoom: 13 } );
var hash = new L.Hash(map);
if (!window.location.hash) {
map.setView([37.958, -120.976], 8);
// Make the base map; a raster tile relief map from ESRI
var esriRelief = '{z}/{y}/{x}'
var basemap = L.tileLayer(esriRelief, {
attribution: '<a href="">ESRI shaded relief</a>, <a href="">NHDPlus v2</a>',
maxZoom: 13
// Add a single GeoJSON vector file for state boundaries
// This was loaded statically as a script; could also be AJAX
var stateLayer = new L.geoJson(usStates);
stateLayer.setStyle({ "color": "#444",
"weight": 1,
"fill": false,
"opacity": 1.0 });
// Make the river overlay layer, vector tiles from our TileStache/Gunicorn server
var geojsonURL = "{z}/{x}/{y}.json";
new L.TileLayer.d3_geoJSON(geojsonURL,{class:"river"})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment