Skip to content

Instantly share code, notes, and snippets.

@uafrazier
Created November 23, 2015 04:30
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save uafrazier/2f4c326ae8f0fb78da8c to your computer and use it in GitHub Desktop.
Save uafrazier/2f4c326ae8f0fb78da8c to your computer and use it in GitHub Desktop.
D3: Texas Tornado Map (2014) v2
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>D3: Texas Tornados</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
<style type="text/css">
@import url(http://fonts.googleapis.com/css?family=Oswald:700,400);
body {
font-family: oswald, arial, sans-serif;
color: #333;
}
a:link {
color: #3A96B7;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a:visited {
color: #3A96B7;
}
a:active {
color: steelBlue;
}
#container {
width: 900px;
margin-left: auto;
margin-right: auto;
margin-top: 50px;
margin-bottom: 50px;
padding: 20px 50px;
background: #d3d3d3;
box-shadow: 0 0 5px #999999;
}
#container h1 {
text-align: center;
}
svg {
background: #d3d3d3;
}
.source {
font-family: oswald, arial, sans-serif;
font-weight: bold;
font-size: .75em;
text-align: center;
}
</style>
</head>
<body>
<div id="container">
<h1>Tornados in Texas - 2014</h1>
<p class="source">Source: <a href='http://www.tornadohistoryproject.com/'>Tornado History Project</a></p>
</div>
<script type="text/javascript">
//Width and height
var w = 900,
h = 500;
//Define projection
var projection = d3.geo.mercator()
.center([ -99.43,31.47 ])
.translate([ w/2, h/2 ])
.scale([ 2000 ]);
//Define path generator
var path = d3.geo.path()
.projection(projection);
//Create SVG
var svg = d3.select("#container")
.append("svg")
.attr("width", w)
.attr("height", h);
//Load in GeoJSON data
d3.json("texas.json", function(json) {
//Bind data and create one path per GeoJSON feature
svg.selectAll("path")
.data(json.features)
.enter()
.append("path")
.attr("d", path)
.attr("fill","#fff");
// .attr("stroke-width","5")
// .attr("stroke","#fff");
//Load in Texas tornado data
d3.csv("tornadoData2014.csv",function(data) {
var imgs = svg.selectAll("image")
.data(data)
.enter()
.append("svg:image")
.attr("xlink:href", "tornado.svg")
.attr("x", function(d) {
//[0] returns the first coordinate (x) of the projected value
return projection([d.TouchdownLon, d.TouchdownLat])[0];
})
.attr("y", function(d) {
//[1] returns the second coordinate (y) of the projected value
return projection([d.TouchdownLon, d.TouchdownLat])[1]-15;
})
.attr("width", "15")
.attr("height", "15");
//.style("opacity",0.75);
});
});
</script>
</body>
</html>
Display the source blob
Display the rendered blob
Raw
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Index Segment Date Time TimeZone State1 State2 State3 Fujita Fatalities Injuries Width Length County1 County2 County3 County4 County5 County6 County7 County8 County9 County10 County11 County12 Damage CropLoss TouchdownLat TouchdownLon LiftoffLat LiftoffLon NumberOfStates StateTor TorNum RecordStatus
20140403.48.509155 Summary 2014-04-03 18:27:00 3 Texas - - 0 0 1 40 0.94 Collin - - - - - - - - - - - $0.2 33.1851 -96.5234 33.1772 -96.5101 1 0 509155 Unmodified
20140403.48.509156 Summary 2014-04-03 19:03:00 3 Texas - - 1 0 4 750 11.8 Hunt - - - - - - - - - - - $0.9 33.1959 -96.2488 33.2643 -96.0618 1 0 509156 Unmodified
20140403.48.509157 Summary 2014-04-03 20:20:00 3 Texas - - 0 0 1 250 0.56 Hopkins - - - - - - - - - - - $0.425 33.2671 -95.587 33.2736 -95.5813 1 0 509157 Unmodified
20140413.48.501736 Summary 2014-04-13 14:46:00 3 Texas - - 0 0 0 25 0.28 Camp - - - - - - - - - - - $0.5 33.0181 -94.9673 33.0212 -94.9643 1 0 501736 Unmodified
20140413.48.500766 Summary 2014-04-13 15:45:00 3 Texas - - 1 0 1 20 0.79 Houston - - - - - - - - - - - $0.12 31.1251 -95.4477 31.1365 -95.4479 1 0 500766 Unmodified
20140420.48.501722 Summary 2014-04-20 16:30:00 3 Texas - - 0 0 0 50 0.2 Childress - - - - - - - - - - - - 34.51 -100.07 34.51 -100.07 1 0 501722 Unmodified
20140507.48.521862 Summary 2014-05-07 18:03:00 3 Texas - - 0 0 0 75 0.2 Wichita - - - - - - - - - - - - 34.033 -98.602 34.033 -98.602 1 0 521862 Unmodified
20140508.48.520186 Summary 2014-05-08 14:15:00 3 Texas - - 0 0 0 120 0.46 Dallas - - - - - - - - - - - $0.08 32.757 -96.889 32.76 -96.882 1 0 520186 Unmodified
20140524.48.521869 Summary 2014-05-24 16:21:00 3 Texas - - 0 0 0 50 0.12 Crockett - - - - - - - - - - - - 30.9255 -101.836 30.9262 -101.834 1 0 521869 Unmodified
20140525.48.514385 Summary 2014-05-25 12:45:00 3 Texas - - 0 0 0 200 1.16 Pecos - - - - - - - - - - - - 30.3808 -102.874 30.3879 -102.857 1 0 514385 Unmodified
20140526.48.518331 Summary 2014-05-26 10:46:00 3 Texas - - 0 0 0 30 0.5 Bastrop - - - - - - - - - - - $0.01 30.0941 -97.4599 30.0954 -97.4518 1 0 518331 Unmodified
20140526.48.516993 Summary 2014-05-26 14:38:00 3 Texas - - 0 0 0 200 0.6 Martin - - - - - - - - - - - - 32.4985 -102.105 32.5054 -102.099 1 0 516993 Unmodified
20140526.48.519254 Summary 2014-05-26 15:20:00 3 Texas - - 0 0 0 50 0.12 San Patricio - - - - - - - - - - - - 28.0553 -97.6463 28.0553 -97.6444 1 0 519254 Unmodified
20140526.48.516963 Summary 2014-05-26 16:38:00 3 Texas - - 2 0 0 400 1.01 Howard - - - - - - - - - - - $0.045 32.2946 -101.286 32.3084 -101.28 1 0 516963 Unmodified
20140526.48.508961 Summary 2014-05-26 16:52:00 3 Texas - - 0 0 0 30 2.05 Hockley - - - - - - - - - - - $0.0005 33.5125 -102.198 33.4979 -102.167 1 0 508961 Unmodified
20140526.48.516964 Summary 2014-05-26 16:57:00 3 Texas - - 0 0 0 500 1.33 Glasscock - - - - - - - - - - - - 31.8935 -101.594 31.909 -101.58 1 0 516964 Unmodified
20140526.48.516966 Summary 2014-05-26 17:26:00 3 Texas - - 0 0 0 200 0.67 Glasscock - - - - - - - - - - - - 31.87 -101.381 31.8784 -101.375 1 0 516966 Unmodified
20140526.48.516967 Summary 2014-05-26 17:42:00 3 Texas - - 0 0 0 300 0.79 Glasscock - - - - - - - - - - - - 31.8462 -101.355 31.8552 -101.347 1 0 516967 Unmodified
20140526.48.521580 Summary 2014-05-26 17:47:00 3 Texas - - 0 0 0 40 0.22 Sterling - - - - - - - - - - - - 31.72 -101.21 31.7197 -101.206 1 0 521580 Unmodified
20140527.48.521134 Summary 2014-05-27 17:30:00 3 Texas - - 1 0 0 550 2.34 Jim Wells - - - - - - - - - - - $1.6 27.7519 -98.0538 27.719 -98.0631 1 0 521134 Unmodified
20140527.48.521135 Summary 2014-05-27 18:45:00 3 Texas - - 1 0 0 650 5.26 Jim Wells - - - - - - - - - - - $0.25 27.3649 -98.1278 27.2893 -98.1376 1 0 521135 Unmodified
20140606.48.527749 Summary 2014-06-06 18:15:00 3 Texas - - 0 0 0 25 2.46 Hartley - - - - - - - - - - - - 35.6958 -102.513 35.727 -102.492 1 0 527749 Unmodified
20140606.48.527750 Summary 2014-06-06 18:52:00 3 Texas - - 0 0 0 70 1.65 Ochiltree - - - - - - - - - - - - 36.0816 -100.927 36.1039 -100.916 1 0 527750 Unmodified
20140609.48.518934 Summary 2014-06-09 07:16:00 3 Texas - - 0 0 0 200 1.71 Red River - - - - - - - - - - - $0.01 33.5532 -94.8031 33.5523 -94.7735 1 0 518934 Unmodified
20140611.48.529126 Summary 2014-06-11 19:20:00 3 Texas - - 0 0 0 50 0.69 Tom Green - - - - - - - - - - - - 31.49 -100.39 31.48 -100.39 1 0 529126 Unmodified
20140611.48.529139 Summary 2014-06-11 19:24:00 3 Texas - - 0 0 0 75 0.59 Tom Green - - - - - - - - - - - - 31.4479 -100.378 31.4409 -100.372 1 0 529139 Unmodified
20140612.48.529454 Summary 2014-06-12 19:18:00 3 Texas - - 0 0 0 50 0.12 Burnet - - - - - - - - - - - - 30.9321 -98.0402 30.9303 -98.04 1 0 529454 Unmodified
20140612.48.529456 Summary 2014-06-12 19:25:00 3 Texas - - 2 0 0 100 1.68 Burnet - - - - - - - - - - - $0.2 30.8685 -98.0875 30.8507 -98.1068 1 0 529456 Unmodified
20140622.48.527700 Summary 2014-06-22 17:57:00 3 Texas - - 0 0 0 50 2 Lipscomb - - - - - - - - - - - - 36.4234 -100.416 36.3944 -100.415 1 0 527700 Unmodified
20140622.48.527701 Summary 2014-06-22 18:22:00 3 Texas - - 0 0 0 75 1 Lipscomb - - - - - - - - - - - - 36.3226 -100.335 36.3081 -100.335 1 0 527701 Unmodified
20140622.48.545589 Summary 2014-06-22 20:50:00 3 Texas - - 1 0 0 100 1.86 Roberts Hemphill - - - - - - - - - - - 35.9433 -100.558 35.9498 -100.526 1 0 545589 Unmodified
20140625.48.525393 Summary 2014-06-25 15:14:00 3 Texas - - 0 0 0 50 0.37 Refugio - - - - - - - - - - - $0.05 28.3177 -97.2761 28.3199 -97.2706 1 0 525393 Unmodified
20140626.48.528936 Summary 2014-06-26 13:22:00 3 Texas - - 0 0 1 75 0.04 Galveston - - - - - - - - - - - - 29.3369 -94.9646 29.3375 -94.9646 1 0 528936 Unmodified
20140627.48.528939 Summary 2014-06-27 10:07:00 3 Texas - - 0 0 0 20 0.01 Liberty - - - - - - - - - - - $0.015 30.1343 -94.9272 30.1343 -94.9272 1 0 528939 Unmodified
20140627.48.528940 Summary 2014-06-27 10:24:00 3 Texas - - 0 0 0 25 0.03 Liberty - - - - - - - - - - - - 30.35 -94.9994 30.35 -94.9994 1 0 528940 Unmodified
20140628.48.528941 Summary 2014-06-28 13:25:00 3 Texas - - 0 0 0 10 0.73 Harris - - - - - - - - - - - $0.045 29.8018 -95.4824 29.8124 -95.4804 1 0 528941 Unmodified
20140702.48.536891 Summary 2014-07-02 16:00:00 3 Texas - - 0 0 0 50 0.22 Haskell - - - - - - - - - - - - 33.1018 -99.613 33.1004 -99.6096 1 0 536891 Unmodified
20140716.48.528096 Summary 2014-07-16 18:08:00 3 Texas - - 0 0 0 50 0.01 Sherman - - - - - - - - - - - - 36.3478 -102.054 36.3478 -102.054 1 0 528096 Unmodified
20140716.48.528097 Summary 2014-07-16 18:26:00 3 Texas - - 0 0 0 100 1.34 Sherman - - - - - - - - - - - - 36.3128 -102.053 36.2998 -102.071 1 0 528097 Unmodified
20140716.48.528098 Summary 2014-07-16 19:23:00 3 Texas - - 0 0 0 100 3.07 Moore - - - - - - - - - - - - 36.0292 -102.084 35.9849 -102.08 1 0 528098 Unmodified
20140721.48.533032 Summary 2014-07-21 12:35:00 3 Texas - - 0 0 0 20 0.1 Galveston - - - - - - - - - - - $0.015 29.3788 -94.9056 29.3788 -94.9056 1 0 533032 Unmodified
20141009.48.540395 Summary 2014-10-09 20:10:00 3 Texas - - 1 0 0 125 7.03 Gray - - - - - - - - - - - - 35.4213 -101.045 35.4845 -100.947 1 0 540395 Unmodified
20141013.48.543118 Summary 2014-10-13 03:52:00 3 Texas - - 1 0 0 275 5.8 Upshur - - - - - - - - - - - <$50 32.7681 -95.0456 32.784 -94.9475 1 0 543118 Unmodified
20141227.48.548020 Summary 2014-12-27 13:12:00 3 Texas - - 0 0 0 75 0.23 Liberty - - - - - - - - - - - $0.01 30.3853 -94.7823 30.3855 -94.781 1 0 548020 Unmodified
20141227.48.547887 Summary 2014-12-27 14:00:00 3 Texas - - 1 0 0 50 4.25 Tyler - - - - - - - - - - - $0.015 30.6829 -94.2553 30.7163 -94.1952 1 0 547887 Unmodified
20141227.48.547888 Summary 2014-12-27 14:35:00 3 Texas - - 1 0 0 150 1.98 Jasper - - - - - - - - - - - $0.1 30.864 -93.979 30.884 -93.955 1 0 547888 Unmodified
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment