Uses d3.geo, topojson, and d3.queue to animate location data on a map of the U.S.
This is my first D3.JS visualization, originally made in 2013. Updated in 2016.
xxxxxxxxxx
<html class=" js flexbox flexboxlegacy canvas canvastext webgl no-touch geolocation postmessage websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients cssreflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers applicationcache svg inlinesvg smil svgclippaths js flexbox flexboxlegacy canvas canvastext webgl no-touch geolocation postmessage websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients cssreflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers applicationcache svg inlinesvg smil svgclippaths">
<head>
<title>From Coast to Coast</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="author" content="Chris Henrick">
<meta name="description" content="data-viz of my mobile data during my move from Oakland, CA to Brooklyn, NY 2013">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="normalize.css">
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="main.css">
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script type="text/javascript" src="modernizr.js"></script>
<!--tell user if browser doesn't support SVG!-->
<script type="text/javascript" src="modernizr.js">
Modernizr.load({
test: Modernizr.svg && Modernizr.inlinesvg,
yep : [ 'js/d3.v3.min.js',
'js/script.js' ]
nope : alert("You're browser is outdated and does not support SVG. Please upgrade.");
});
</script>
<script src="d3.v3.min.js"></script>
<script src="https://d3js.org/d3-queue.v3.min.js"></script>
<script src="topojson.v1.min.js"></script>
</head>
<body cz-shortcut-listen="true">
<div id="wrapper">
<h1>From Coast to Coast</h1>
<h3>Visualizing my mobile device's location data <br>
during my move from Oakland, CA to Brooklyn, NY 2013</h3>
</div>
<script type="text/javascript" src="main.js"></script>
</body>
</html>
https://html5shiv.googlecode.com/svn/trunk/html5.js
https://d3js.org/d3-queue.v3.min.js