Skip to content

Instantly share code, notes, and snippets.

@monkeycycle
Forked from gka/florida.csv
Created May 8, 2017 13:57
Show Gist options
  • Save monkeycycle/ec0e2332b572f9c9d0a94c6e6c5e821f to your computer and use it in GitHub Desktop.
Save monkeycycle/ec0e2332b572f9c9d0a94c6e6c5e821f to your computer and use it in GitHub Desktop.
bump chart tutorial, part 1
We can make this file beautiful and searchable if this error is corrected: No commas found in this CSV file in line 0.
live_state born_state 1900 1910 1920 1930 1940 1950 1960 1970 1980 1990 2000 2012
Florida Alabama 0.0477 0.0484 0.0541 0.0508 0.0555 0.0554 0.0458 0.0344 0.0259 0.0197 0.0145 0.0102
Florida Alaska 0.0000 0.0000 0.0000 0.0000 0.0001 0.0000 0.0002 0.0004 0.0005 0.0005 0.0005 0.0008
Florida Arizona 0.0000 0.0000 0.0000 0.0001 0.0004 0.0003 0.0004 0.0007 0.0008 0.0011 0.0014 0.0015
Florida Arkansas 0.0007 0.0009 0.0021 0.0035 0.0024 0.0040 0.0040 0.0043 0.0032 0.0030 0.0025 0.0022
Florida California 0.0003 0.0003 0.0009 0.0006 0.0017 0.0032 0.0056 0.0074 0.0086 0.0104 0.0131 0.0141
Florida Colorado 0.0001 0.0001 0.0006 0.0004 0.0008 0.0008 0.0013 0.0017 0.0018 0.0024 0.0024 0.0026
Florida Connecticut 0.0018 0.0025 0.0018 0.0032 0.0043 0.0058 0.0076 0.0089 0.0106 0.0111 0.0112 0.0097
Florida Delaware 0.0002 0.0004 0.0010 0.0004 0.0005 0.0007 0.0009 0.0012 0.0013 0.0013 0.0013 0.0014
Florida District of Columbia 0.0004 0.0005 0.0005 0.0012 0.0011 0.0019 0.0036 0.0028 0.0035 0.0037 0.0035 0.0028
Florida Florida 0.6524 0.6237 0.5757 0.5075 0.4872 0.4286 0.3759 0.3688 0.3123 0.3038 0.3253 0.3574
Florida Georgia 0.1090 0.1097 0.1031 0.1509 0.1469 0.1251 0.0920 0.0605 0.0473 0.0338 0.0248 0.0190
Florida Hawaii 0.0000 0.0000 0.0000 0.0000 0.0001 0.0003 0.0003 0.0008 0.0009 0.0009 0.0011 0.0013
Florida Idaho 0.0000 0.0000 0.0005 0.0001 0.0002 0.0002 0.0003 0.0004 0.0008 0.0004 0.0005 0.0004
Florida Illinois 0.0038 0.0038 0.0156 0.0149 0.0153 0.0203 0.0256 0.0282 0.0300 0.0310 0.0260 0.0223
Florida Indiana 0.0028 0.0020 0.0061 0.0099 0.0114 0.0126 0.0164 0.0172 0.0183 0.0179 0.0146 0.0128
Florida Iowa 0.0012 0.0008 0.0046 0.0036 0.0053 0.0042 0.0060 0.0055 0.0048 0.0052 0.0042 0.0033
Florida Kansas 0.0005 0.0007 0.0034 0.0024 0.0030 0.0029 0.0033 0.0032 0.0032 0.0029 0.0026 0.0022
Florida Kentucky 0.0042 0.0036 0.0084 0.0116 0.0103 0.0120 0.0140 0.0139 0.0130 0.0121 0.0093 0.0068
Florida Louisiana 0.0027 0.0023 0.0031 0.0046 0.0040 0.0033 0.0037 0.0041 0.0038 0.0052 0.0048 0.0040
Florida Maine 0.0015 0.0017 0.0022 0.0017 0.0020 0.0027 0.0035 0.0032 0.0039 0.0042 0.0038 0.0032
Florida Maryland 0.0016 0.0017 0.0035 0.0024 0.0029 0.0047 0.0074 0.0068 0.0091 0.0085 0.0080 0.0077
Florida Massachusetts 0.0027 0.0020 0.0070 0.0073 0.0097 0.0131 0.0170 0.0170 0.0209 0.0217 0.0202 0.0184
Florida Michigan 0.0026 0.0035 0.0064 0.0097 0.0095 0.0117 0.0181 0.0211 0.0241 0.0282 0.0241 0.0214
Florida Minnesota 0.0004 0.0003 0.0018 0.0020 0.0026 0.0028 0.0043 0.0051 0.0049 0.0050 0.0046 0.0042
Florida Mississippi 0.0040 0.0033 0.0052 0.0052 0.0056 0.0061 0.0082 0.0072 0.0062 0.0055 0.0045 0.0038
Florida Missouri 0.0022 0.0027 0.0056 0.0065 0.0067 0.0070 0.0080 0.0087 0.0077 0.0078 0.0067 0.0056
Florida Montana 0.0000 0.0004 0.0006 0.0002 0.0002 0.0005 0.0005 0.0007 0.0008 0.0006 0.0005 0.0004
Florida Nebraska 0.0007 0.0000 0.0016 0.0015 0.0020 0.0017 0.0021 0.0024 0.0019 0.0020 0.0017 0.0017
Florida Nevada 0.0000 0.0000 0.0000 0.0001 0.0000 0.0002 0.0001 0.0002 0.0006 0.0003 0.0005 0.0007
Florida New Hampshire 0.0007 0.0005 0.0009 0.0007 0.0011 0.0013 0.0023 0.0019 0.0025 0.0029 0.0026 0.0025
Florida New Jersey 0.0009 0.0020 0.0040 0.0052 0.0068 0.0136 0.0172 0.0206 0.0276 0.0290 0.0281 0.0249
Florida New Mexico 0.0000 0.0001 0.0000 0.0001 0.0003 0.0003 0.0006 0.0011 0.0011 0.0009 0.0010 0.0011
Florida New York 0.0080 0.0113 0.0171 0.0177 0.0282 0.0441 0.0607 0.0653 0.0985 0.0979 0.0933 0.0817
Florida North Carolina 0.0248 0.0247 0.0156 0.0176 0.0165 0.0162 0.0193 0.0170 0.0144 0.0114 0.0097 0.0084
Florida North Dakota 0.0000 0.0000 0.0002 0.0001 0.0009 0.0007 0.0008 0.0008 0.0010 0.0010 0.0008 0.0007
Florida Ohio 0.0053 0.0085 0.0153 0.0139 0.0192 0.0277 0.0346 0.0367 0.0408 0.0397 0.0325 0.0278
Florida Oklahoma 0.0002 0.0001 0.0009 0.0012 0.0012 0.0026 0.0031 0.0029 0.0029 0.0032 0.0028 0.0023
Florida Oregon 0.0001 0.0004 0.0001 0.0002 0.0004 0.0004 0.0007 0.0007 0.0007 0.0008 0.0009 0.0008
Florida Pennsylvania 0.0037 0.0068 0.0122 0.0184 0.0214 0.0323 0.0423 0.0413 0.0448 0.0423 0.0361 0.0286
Florida Rhode Island 0.0002 0.0003 0.0006 0.0016 0.0007 0.0030 0.0033 0.0032 0.0036 0.0038 0.0038 0.0034
Florida South Carolina 0.0499 0.0603 0.0355 0.0346 0.0245 0.0188 0.0177 0.0143 0.0104 0.0083 0.0067 0.0053
Florida South Dakota 0.0001 0.0001 0.0002 0.0004 0.0009 0.0007 0.0009 0.0010 0.0009 0.0010 0.0009 0.0007
Florida Tennessee 0.0043 0.0056 0.0074 0.0136 0.0121 0.0169 0.0180 0.0166 0.0121 0.0109 0.0081 0.0066
Florida Texas 0.0019 0.0031 0.0025 0.0033 0.0050 0.0057 0.0090 0.0090 0.0095 0.0117 0.0115 0.0103
Florida Utah 0.0000 0.0000 0.0000 0.0004 0.0006 0.0002 0.0004 0.0006 0.0004 0.0007 0.0008 0.0007
Florida Vermont 0.0004 0.0004 0.0010 0.0013 0.0015 0.0011 0.0020 0.0021 0.0021 0.0018 0.0017 0.0013
Florida Virginia 0.0064 0.0054 0.0078 0.0087 0.0084 0.0106 0.0132 0.0127 0.0128 0.0109 0.0103 0.0102
Florida Washington 0.0002 0.0003 0.0001 0.0004 0.0008 0.0010 0.0012 0.0013 0.0021 0.0022 0.0021 0.0021
Florida West Virginia 0.0002 0.0021 0.0035 0.0040 0.0035 0.0061 0.0120 0.0134 0.0112 0.0104 0.0076 0.0055
Florida Wisconsin 0.0024 0.0013 0.0036 0.0033 0.0034 0.0054 0.0064 0.0078 0.0081 0.0089 0.0074 0.0061
Florida Wyoming 0.0000 0.0000 0.0001 0.0003 0.0004 0.0001 0.0001 0.0003 0.0003 0.0004 0.0004 0.0005
Florida US Other 0.0000 0.0001 0.0001 0.0001 0.0001 0.0010 0.0031 0.0035 0.0065 0.0118 0.0175 0.0207
Florida Foreign Born 0.0468 0.0514 0.0567 0.0506 0.0506 0.0583 0.0574 0.0946 0.1144 0.1377 0.1754 0.2058
<html>
<head>
</head>
<body>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script type="text/javascript">
var margin = {top: 10, right: 10, bottom: 10, left: 10 },
width = innerWidth - margin.left - margin.right,
height = innerHeight - margin.top - margin.bottom;
var svg = d3.select('body')
.append('svg')
.attr({ width: innerWidth, height: innerHeight })
.append('g')
.attr('transform', 'translate(' + [margin.left, margin.top] + ')');
var x = d3.scale.linear().range([0, width]),
y = d3.scale.linear().range([height, 0]);
var area = d3.svg.area()
.x(function(d) { return x(d.x); })
.y0(function(d) { return y(d.y0); })
.y1(function(d) { return y(d.y0 + d.y); });
var color = d3.scale.ordinal()
.range(['#ecc', '#dbb', '#caa', '#b99', '#a88']);
d3.tsv('florida.csv', function(data) {
var years = d3.keys(data[0])
.filter(function(key) { return !isNaN(key); })
.map(function(key) { return +key; });
var layers = data.map(function(s) {
return {
name: s.born_state,
region: s.born_region,
values: years.map(function(yr) {
return { x: +yr, y: +s[yr] };
})
};
});
var stack = d3.layout.stack()
.values(function(d) { return d.values; });
layers = stack(layers);
x.domain(d3.extent(years));
var maxY = d3.max(layers, function(layer) {
return d3.max(layer.values, function(d) {
return d.y + d.y0; });
});
y.domain([0, maxY]);
var state = svg.selectAll(".state")
.data(layers)
.enter().append("g")
.attr("class", "state");
state.append("path")
.attr("class", "area")
.attr("d", function(d) { return area(d.values); })
.style("fill", function(d) { return color(d.region); });
state
.filter(function(d) { return d3.max(d.values, function(d) { return d.y; }) > 0.05; })
.append("text")
.datum(function(d) { return {
name: d.name,
value: d.values[d.values.length - 1]};
})
.attr("transform", function(d) { return "translate(" + x(d.value.x) + "," + y(d.value.y0 + d.value.y / 2) + ")"; })
.attr("x", -6)
.attr("dy", ".35em")
.text(function(d) { return d.name; });
});
</script>
<style type="text/css">
body { margin: 0; padding: 0; }
svg text { font-family: Helvetica Neue, Helvetica; font-weight: 400;}
svg .state text { text-anchor: end; font-size: 11px;}
svg .state path { stroke: #fff; stroke-width: 0.5px;}
</style>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment