Skip to content

Instantly share code, notes, and snippets.

@stevenwmarks

stevenwmarks/.block

Last active March 13, 2018 03:30
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save stevenwmarks/c392c53fdf9ab1db1bb33e57770e1c8a to your computer and use it in GitHub Desktop.
Save stevenwmarks/c392c53fdf9ab1db1bb33e57770e1c8a to your computer and use it in GitHub Desktop.
Download ZIP
Poverty levels in Connecticut
Raw
.block
license: mit
Display the source blob
Display the rendered blob
Raw
connTowns4.json
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Poverty Levels in Connecticut Towns</title>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3-legend/2.25.4/d3-legend.js"></script>
<style>
#dataSource {
font-family: Verdana, Tahoma, sans-serif;
font-weight: bold;
font-size: 60%;
}
#hede {
font-family: Verdana, Tahoma, sans-serif;
font-weight: bold;
font-size: 110%;
}
</style>
</head>
<body>
<script type="text/javascript">
// width, height, margins and padding
var margin = {top: 20, right: 20, bottom: 20, left: 20},
padding = {top: 20, right: 20, bottom: 30, left: 30},
width = 1200 - margin.left - margin.right,
height = 600 - margin.top - margin.bottom;
// define map projection
var projection = d3.geoMercator()
.center([-73, 41.6])
.scale([21500]);
// define path generator
var path = d3.geoPath()
.projection(projection);
// define quantize scale to sort data values into buckets of color
var color = d3.scaleQuantize()
.domain([0.5, 31.9])
.range(["#ffffb2","#fecc5c","#fd8d3c","#f03b20","#bd0026"]);
// create SVG element
var svg = d3.select("body")
.append("svg")
.attr("width", width)
.attr("height", height);
// load in poverty levels
d3.csv("povertyLevels.csv", function(data) {
// load in GeoJSON data
d3.json("connTowns4.json", function(json) {
// then merge; make object with all nine years in pov levels or json
for (var i = 0; i < data.length; i++) {
var dataTown = data[i].town;
var dataYear = parseFloat(data[i].yr2016);
// find state in JSON
for (var j = 0; j < json.features.length; j++) {
var jsonTown = json.features[j].properties.NAME;
if (dataTown == jsonTown) {
// copy the data value into the JSON
json.features[j].properties.yr2016 = dataYear;
// stop looking through the JSON
break;
}
}
}
// bind data and create one path per GeoJSON feature
svg.selectAll("path")
.data(json.features)
.enter()
.append("path")
.attr("d", path)
.style("stroke", "black")
.style("fill", function(d) {
var yr2016 = d.properties.yr2016;
if (yr2016) {
// if value exists…
return color(yr2016);
} else {
return "#ccc";
}
})
// tooltip
.on("mouseover", function(d) {
var xPosition = d3.mouse(this)[0];
var yPosition = d3.mouse(this)[1] - 30;
svg.append("text")
.attr("id", "tooltip")
.attr("x", xPosition)
.attr("y", yPosition)
.attr("text-anchor", "middle")
.attr("font-family", "sans-serif")
.attr("font-size", "14px")
.attr("font-weight", "bold")
.attr("fill", "black")
.text(d.properties.NAME);
svg.append("text")
.attr("id", "tooltip2")
.attr("x", xPosition)
.attr("y", yPosition + 15)
.attr("text-anchor", "middle")
.attr("font-family", "sans-serif")
.attr("font-size", "14px")
.attr("font-weight", "bold")
.attr("fill", "black")
.text(d.properties.yr2016);
d3.select(this)
.style("fill", "#ffff00");
})
.on("mouseout", function(d) {
d3.select("#tooltip").remove();
d3.select("#tooltip2").remove();
d3.select(this)
.transition()
.duration(250)
.style("fill", function(d) {
var yr2016 = d.properties.yr2016;
if (yr2016) {
return color(yr2016);
} else {
return "#ddd";
}
});
});
// create a legend
var lgndColor = d3.scaleQuantize()
.domain([0.5, 31.9])
.range(["#ffffb2","#fecc5c","#fd8d3c","#f03b20","#bd0026"]);
var lgnd = d3.select("svg");
lgnd.append("g")
.attr("class", "legendQuant")
.attr("transform", "translate(80,100)");
var legend = d3.legendColor()
.labelFormat(d3.format(".1f"))
.useClass(false)
.titleWidth(100)
.scale(lgndColor);
svg.select(".legendQuant")
.call(legend);
}); // end JSON data load-in
}); // end csv load-in
// add data source
svg.append("text")
.attr("transform",
"translate(" + (width / 1.75) + " ," +
(height - 20) + ")")
.attr("id", "dataSource")
.style("text-anchor", "middle")
.text("Data Source: U.S. Census Bureau, 2012-2016 American Community Survey Five-Year Estimates");
// add hede
svg.append("text")
.attr("transform",
"translate(" + (width / 17) + " ," +
(height - 500) + ")")
.attr("id", "hede")
.style("text-anchor", "left")
.text("Percentage of People")
svg.append("text")
.attr("transform",
"translate(" + (width / 17) + " ," +
(height - 480) + ")")
.attr("id", "hede")
.style("text-anchor", "left")
.text("Below Poverty Level");
</script>
</body>
</html>
Raw
povertyLevels.csv
town yr2016 yr2015 yr2014 yr2013 yr2012 yr2011 yr2010
Andover 0.5 2.6 3.7 4.3 4.9 5.7 4.7
Ansonia 20.7 19 19.2 18.6 13.9 11.6 9.7
Ashford 8.9 8 7.4 5.5 4.2 5 4
Avon 2.6 2.7 4.4 4.1 4.8 5 5.1
Barkhamsted 2.5 2 1.5 1.2 0.6 0.9 1
Beacon Falls 5.1 4.1 1.8 3.1 3.8 3.5 3.8
Berlin 3.4 4.2 4.1 4.8 6.4 6.4 5.3
Bethany 2.5 3.5 3.9 3.3 5.4 5.1 2.1
Bethel 3.2 3.2 3.8 3.9 2.8 4.2 3.9
Bethlehem 8.6 7.8 7.7 4.8 4.4 3.5 2
Bloomfield 6.7 6.4 7.9 6.8 8.5 7.6 7.4
Bolton 3.2 3.3 3.4 1.9 2.1 1.3 2.2
Bozrah 4.2 5.6 5.4 5.9 4.4 5.7 3.2
Branford 6 6.5 7.7 7.2 6.7 5.8 5.8
Bridgeport 22.1 22.9 23.6 23.3 23.6 21.9 20.8
Bridgewater 2.4 2.9 2.5 2.4 2.2 3 2.6
Bristol 10.3 10.4 9.6 10.5 9 8.2 7.7
Brookfield 3.5 2.9 2.7 2.6 2.8 3.1 2.9
Brooklyn 11.3 10 12.6 10.6 10.2 8 9.4
Burlington 1.7 2.2 4.5 3.6 3.6 4 2.1
Canaan 5.2 5.5 6.2 7.1 6.8 6.4 5.8
Canterbury 5 4.9 4 3.1 2.9 1.5 2.1
Canton 2.9 2.1 3.1 3.8 3.9 4.2 4
Chaplin 5.7 5 4.6 4.6 4.2 3.7 3.5
Cheshire 2.4 2.3 2.1 2.5 2.8 2.5 2.4
Chester 4.8 4 4.9 5 6 6.3 4
Clinton 9.9 8.6 9 7.7 5.9 3.6 2.7
Colchester 4.5 4.5 3.8 3.2 2.7 2.5 2.6
Colebrook 3.7 4.4 4.1 3.6 3.4 4.3 3.6
Columbia 2.9 4.2 4.8 4 3.8 3.9 3.2
Cornwall 5.7 10.5 8.6 12.3 12.3 11.4 5.7
Coventry 3.2 3.1 2.7 3.1 3.5 3.8 4.6
Cromwell 5.2 3.3 4.5 4.2 3.4 2.6 4.8
Danbury 11.2 12 11.1 10.6 10.1 10 8.4
Darien 4.8 5.4 6.9 6.6 5.2 5.1 3.8
Deep River 4.8 5.8 5.5 2.8 2.5 3.1 6.5
Derby 12.7 15.4 12.8 13.3 13.3 12.8 9.8
Durham 3 2.6 2.5 0.9 1.3 1.5 1.6
Eastford 3.8 3.2 3 3 5.5 4.3 5.2
East Granby 2.1 2.5 2.7 3.6 3 3 2.9
East Haddam 4 3.9 4.9 5.6 5.4 5.2 5.1
East Hampton 5.6 4.7 3.5 3.5 4.1 3.8 4.1
East Hartford 14.3 15.4 14.3 13.4 15.3 16 14.8
East Haven 9.2 9.8 9.9 9.8 9.3 7.8 8.3
East Lyme 3.9 4.6 3.4 3.3 3.6 3.2 2.3
Easton 4.3 4.1 3.3 2.1 1.3 0.9 1.3
East Windsor 5.1 4.8 5.9 5.5 5 5.1 5.3
Ellington 3.2 3 2.6 1.9 2.7 2.8 2.9
Enfield 8.2 8.3 8 7 6.5 7.2 7.1
Essex 4.8 5 5.4 5.2 4.4 4.3 3.6
Fairfield 4.4 4.3 4.7 4.7 4.1 3.5 3.3
Farmington 6.1 5.5 5.8 5 5.4 4.5 5.4
Franklin 6.1 5.5 4.7 4.1 2.9 3.4 3.2
Glastonbury 3.8 3.7 3.7 3.2 2.6 3.2 3.3
Goshen 10.4 14.7 14.2 11.5 7.9 5.7 2.5
Granby 3 2.8 2.5 2 1.7 1.3 1.5
Greenwich 6.3 5.6 5 4.4 3.8 3.7 3.6
Griswold 10.5 10.8 12.2 8.3 9.1 7.9 7.3
Groton 13.4 13.8 14 14.2 12.7 11.7 11.5
Guilford 4.2 4.8 5.1 3.7 4 3.7 2.8
Haddam 5.3 6.6 3.6 3.9 3.8 3.4 2
Hamden 8.4 8.3 8.4 8.2 7.8 7.7 6.8
Hampton 3.1 5 5.9 6.4 6.5 5.3 3.7
Hartford 31.9 33.4 34.4 33.6 33.9 32.9 32.1
Hartland 5.7 6.2 5.2 5.1 3.7 1.6 0.3
Harwinton 4.7 6.8 6.4 4.2 4.6 4.6 5.1
Hebron 2 1.4 1.4 1.3 0.9 2.3 1.6
Kent 7.9 8.4 9.1 9.4 10.5 9 7.8
Killingly 11.1 10.2 9.6 11.3 10.3 9.3 10.3
Killingworth 2.4 1.7 1.3 0.3 0.2 0.2 0.2
Lebanon 5.7 6.5 4.4 4.8 4.1 3.8 3.1
Ledyard 3.9 5.6 5.6 3.9 3.3 2.6 2
Lisbon 2.8 1.5 2.1 2.7 4.7 4.5 4.7
Litchfield 7.6 5.7 5.2 6.9 6.8 5.1 4.1
Lyme 2 4.8 4.3 3.7 4.2 4.4 1.8
Madison 2.4 4 3.1 2.9 2.4 2.1 0.7
Manchester 12.1 11.8 11.6 10.5 8.9 8.2 8.1
Mansfield 16.8 17.1 16.5 17.6 17.9 17.4 18
Marlborough 2.1 1.1 0.8 1 1.1 1.3 12
Meriden 12.5 14.6 14.9 14.4 14.5 14.8 13.8
Middlebury 4.2 4 4.2 3.6 2.6 2.7 2
Middlefield 2.5 3.3 3.6 2.8 2.4 2.5 2.2
Middletown 11.4 11 12.5 11.7 10.9 11.5 12
Milford 7 6.6 5.6 5.3 4.7 3.9 3.9
Monroe 3.6 4.1 4.7 5.1 4 3.3 3
Montville 8.3 7.2 5.4 5.3 5.5 5.2 4.6
Morris 3.6 4 4.3 5.7 5.6 4.8 4.9
Naugatuck 9.6 8.8 9.7 9.9 8.6 8.5 7.5
New Britain 22.9 23.3 23.5 22.4 22.9 20.9 20.5
New Canaan 3 2.5 2.8 2.3 2.2 2.2 2.4
New Fairfield 3.3 2.9 2.9 1.6 1.5 1.4 1.4
New Hartford 2.8 3.2 1.6 2.4 3.2 3.2 2.9
New Haven 26.1 26.6 26.4 26.5 26.9 26.3 25.2
Newington 4.3 4.4 4.9 4.4 4.3 4.6 5.6
New London 28.2 28.6 25.3 24.9 20 17.9 17.3
New Milford 6.3 5.7 7.3 5.8 4.6 4.1 3.7
Newtown 4.5 3.9 5.2 4.6 3.4 3.3 3.3
Norfolk 5.1 9.2 9.2 7.2 6.6 5.2 3.1
North Branford 3.4 3.6 3.6 3 2.1 1.3 0.7
North Canaan 7.1 8.1 8.7 9.3 10.2 13.9 13.6
North Haven 3.9 3.9 4 3.9 3.8 4.3 3.9
North Stonington 4.2 6.5 5.7 5.7 5.8 5.5 4
Norwalk 8.5 8.4 8.1 9.7 9.4 8 8.2
Norwich 15.8 15.7 15.1 15 15.2 14.6 14.4
Old Lyme 2.3 1.5 1.2 3.1 3.3 3.5 3.5
Old Saybrook 5.1 5.7 4.1 5.4 5.9 5.9 5.5
Orange 3.5 3.8 3.8 2.4 2.6 2.6 2.1
Oxford 3.3 3.6 3.7 4 4.5 1.7 2.2
Plainfield 7.1 7.6 10.8 9.7 8.8 10.7 9.4
Plainville 7.8 9 8.8 6.7 7.6 6.7 4.9
Plymouth 6.4 6.5 6.9 6.6 6.7 5.7 6.5
Pomfret 3.6 2.2 3.1 2.9 6.3 5.3 6
Portland 5.5 6.2 6.2 5.1 5.1 5.3 5.2
Preston 7.8 5 8 10.2 11.4 10.6 10.5
Prospect 3.8 3.8 4.3 3.8 3.2 2.4 2.4
Putnam 9.8 10.1 9.6 11.2 16 15.4 13.7
Redding 2.6 3.8 3.7 3.5 4 3.7 1.8
Ridgefield 2.8 2.8 3.1 3.1 2.4 1.9 2.5
Rocky Hill 7.3 8.2 7.8 7.8 6 6 5.7
Roxbury 2.9 3.1 3.4 3.2 2.5 1.6 4.1
Salem 3.9 4.5 3.9 2.7 2.7 3.2 2.1
Salisbury 3.4 2.4 3.3 4.7 4.5 6.8 6.9
Scotland 3.6 3.8 2.5 2 1.1 1.1 1.2
Seymour 5.7 6.3 5.6 7.2 6.8 5.2 4.8
Sharon 9.7 9.6 6.2 6.3 6 5.3 8.6
Shelton 5 5.1 5 4.7 4.4 4.1 3.9
Sherman 1.4 1.5 1.7 2.3 2.6 1.8 1.9
Simsbury 3.5 3.4 3.1 1.9 2.2 2 2.1
Somers 4.3 4.5 4.6 4.3 4.8 4.4 4
Southbury 9.2 8.4 8.4 5.9 6.4 5.2 5.9
Southington 3.9 3.7 4.4 4.3 3.6 3.5 4.4
South Windsor 3 4.3 4 4.5 4.3 3.7 1.6
Sprague 8.2 8.4 7.1 8.7 7.6 8.5 7.8
Stafford 11.2 11.4 10.8 9.5 6.7 6.1 5.1
Stamford 8.9 9.4 9.9 11.1 10.8 11 11.1
Sterling 8.1 10.4 11.7 11.5 11.8 12.8 16
Stonington 8.5 7.8 5.9 4.6 4.8 5.1 5.4
Stratford 9 7.9 7.4 6.3 6.4 5.5 4.8
Suffield 6 5.3 5.8 4.2 1.6 2.2 2.6
Thomaston 6.1 5.4 3.4 2.9 2.7 2.8 1.3
Thompson 7.6 5.2 7.3 7.6 7.5 6.2 9.6
Tolland 2.5 2.8 1.9 2.1 3.7 3.2 2.4
Torrington 10 10.7 11.1 11.1 11.2 12 11.3
Trumbull 2 2.2 2.5 2.1 2.2 2.3 2.5
Union 0.6 1 0.7 0.8 1.1 0.7 2
Vernon 9.2 9.8 9.3 9.3 9.2 8.5 7.8
Voluntown 4.8 5.2 2.8 2.3 1.4 2.2 1.4
Wallingford 4 4.7 4.8 6.1 6 6 6.8
Warren 10.2 10.3 10.2 7.3 6.3 4.2 4.9
Washington 3.6 4.6 5.9 5.6 7 6.3 3.5
Waterbury 25.4 25.1 24.2 23.3 21.9 20.6 20.9
Waterford 6.2 6.2 6.3 5.4 5.2 4.3 3.8
Watertown 4.1 4.6 3.6 3.3 3.4 3.4 3.1
Westbrook 8 8.2 6 4.9 3.6 4.3 4.5
West Hartford 7.7 8 7.9 7.3 6.6 6.1 6.1
West Haven 15.4 14.4 13.2 11.6 11.7 10.5 10.1
Weston 1.9 1.6 2.2 1.8 2.7 2.4 1.9
Westport 4.4 4.7 4.3 3.5 3.7 3.5 3.1
Wethersfield 5.1 4.7 5.3 5.8 5.2 4.5 4.3
Willington 15.2 14 10.8 12.3 18.1 16.5 16.4
Wilton 3.4 3.1 3.6 3.7 2.5 2.1 2.1
Winchester 14.6 12.1 8.2 7 5.5 6.7 8.1
Windham 25.4 24.3 25.2 24.7 24.6 21.9 22.8
Windsor 5.8 6.1 5.7 5.3 5.1 4 3.6
Windsor Locks 6.5 5.7 6.4 7.9 8.3 8.2 6.9
Wolcott 4.4 4.3 3.1 2.9 3.4 3.3 2.6
Woodbridge 4 3.3 2.7 2.6 1.2 2.2 1.7
Woodbury 5.1 5.2 6 5.9 4.6 4.7 5.6
Woodstock 2.9 3.3 2.3 3 4.7 5.2 5.1
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment