Using d3.geo.tile to display raster image tiles underneath some TopoJSON vectors, and d3.behavior.zoom for pan & zoom. This version reprojects the geometry on interaction; compare to updating the transform.
The series hover interactivity uses the technique from lgrammel seen here: http://bl.ocks.org/1963983
It isn't necessarily a tooltip, but data is displayed by inverting the x-axis value into a date, and mapping the date to the corresponding data value for the series.
Building on this - experimenting with fake 3d svg arcs using two nested orthographic projections and cardinal line interpolation.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<head> | |
<style> | |
body { | |
font: 10px sans-serif; | |
} | |
#main { | |
left: 25%; | |
position: absolute; | |
} |
Extent indicator globe using d3.geo.orthographic and radial gradients.
Slippy map code from:
http://bl.ocks.org/3943330 by tmcw
http://bl.ocks.org/4132797 by mbostock
Map tiles from Stamen