Extent indicator globe using d3.geo.orthographic and radial gradients - EVERYTHING OF IMPORT HERE IS THE WORK OF @dwtkns
Slippy map code from:
http://bl.ocks.org/3943330 by tmcw
http://bl.ocks.org/4132797 by mbostock
Map tiles from Stamen
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <script src='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.js'></script> | |
| <script src='http://code.jquery.com/jquery-1.8.3.min.js'></script> | |
| <link href='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.css' rel='stylesheet' /> | |
| <style> | |
| body { margin:0; padding:0; } | |
| #map { position:absolute; top:0; bottom:0, width:100%; } | |
| #switch { position:absolute; top:0; bottom:0; left: 300px width:300px; } |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <script src='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.js'></script> | |
| <script src='http://code.jquery.com/jquery-1.8.3.min.js'></script> | |
| <link href='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.css' rel='stylesheet' /> | |
| <style> | |
| body { margin:0; padding:0; } | |
| #map { position:absolute; top:0; bottom:0; width:100%; } | |
| #switch { position:absolute; top:0; bottom:0; left: 300px width:300px; } |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <script src='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.js'></script> | |
| <script src='http://code.jquery.com/jquery-1.8.3.min.js'></script> | |
| <link href='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.css' rel='stylesheet' /> | |
| <style> | |
| body { margin:0; padding:0; } | |
| #map { position:absolute; top:0; bottom:0; width:100%; } | |
| #switch { position:absolute; top:0; bottom:0; left: 300px width:300px; } |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>Leaflet Switching + CartoDB</title> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> | |
| <link rel="stylesheet" href="http://geosprocket.com/assets/leaflet/dist/leaflet.css" /> | |
| <!--[if lte IE 8]><link rel="stylesheet" href="http://geosprocket.com/assets/leaflet/dist/leaflet.ie.css" /><![endif]--> |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <script src='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.js'></script> | |
| <link href='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.css' rel='stylesheet' /> | |
| <style> | |
| body { margin:0; padding:0; } | |
| #map { position:absolute; top:0; bottom:0; width:100%; } | |
| </style> | |
| </head> |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <script src='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.js'></script> | |
| <link href='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.css' rel='stylesheet' /> | |
| <style> | |
| body { margin:0; padding:0; } | |
| #map { position:absolute; top:0; bottom:0; width:100%; } | |
| </style> | |
| </head> |
| <html> | |
| <head> | |
| <link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v2/themes/css/cartodb.css" /> | |
| <!--[if lte IE 8]> | |
| <link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v2/themes/css/cartodb.ie.css" /> | |
| <![endif]--> | |
| <script src="http://libs.cartocdn.com/cartodb.js/v2/cartodb.js"></script> | |
| <style> | |
| html, body {width:100%; height:100%; padding: 0; margin: 0;} | |
| #map {width: 100%; height:100%; background: black; z-index:1;} |
| <!DOCTYPE html> | |
| <meta charset="utf-8"> | |
| <style> | |
| .graticule { | |
| fill: none; | |
| stroke: #777; | |
| } | |
| .boundary { |
Extent indicator globe using d3.geo.orthographic and radial gradients - EVERYTHING OF IMPORT HERE IS THE WORK OF @dwtkns
Slippy map code from:
http://bl.ocks.org/3943330 by tmcw
http://bl.ocks.org/4132797 by mbostock
Map tiles from Stamen
Tom MacWright's demonstration of jenks natural breaks implemented in simple-statistics.
Rendered by d3js, based on an example by Mike Bostock.