Skip to content

Instantly share code, notes, and snippets.

@cornfact

cornfact/cityChicago.csv

Created December 4, 2015 02:50
Show Gist options
  • Save cornfact/4aa7737d71d93d5cd9a9 to your computer and use it in GitHub Desktop.
Save cornfact/4aa7737d71d93d5cd9a9 to your computer and use it in GitHub Desktop.
Download ZIP
Illinois counties, revised
Raw
cityChicago.csv
city longitude latitude population
Bloomington-88.9936900 -88.99369 40.4842 76610
Chicago -87.65005 41.85003 2695598
Springfield -89.64371 39.80172 116250
Raw
cornCounties.csv
county percent payment
Adams 120.2 0
Alexander 121.7 0
Bond 106.5 0
Boone 92 61.3
Brown 119.6 0
Bureau 92.1 61.85
Calhoun 103 0
Carroll 85.2 98.92
Cass 102.5 0
Champaign 105.2 0
Christian 107.5 0
Clark 108.8 0
Clay 104.2 0
Clinton 108.3 0
Coles 105 0
Cook 85.7 68.24
Crawford 103.8 0
Cumberland 104.9 0
Dekalb 90.2 78.35
Dewitt 102.1 0
Douglas 107.8 0
Dupage 80.8 83.58
Edgar 100.9 0
Edwards 104.5 0
Effingham 100.9 0
Fayette 102.4 0
Ford 110.5 0
Franklin 103.5 0
Fulton 106.6 0
Gallatin 103.3 0
Greene 99.4 4.4
Grundy 103.6 0
Hamilton 111.4 0
Hancock 119.8 0
Hardin 107 0
Henderson 102 0
Henry 91.7 64.7
Iroquois 95.7 30.61
Jackson 107.4 0
Jasper 103.8 0
Jefferson 109.1 0
Jersey 99.9 0.7
Jo Daviess 87.1 88.87
Johnson 96.2 20.53
Kane 88 90.46
Kankakee 90.7 65.91
Kendall 95.6 34.25
Knox 95 38.8
Lake 89 68.27
Lasalle 92.5 59
Lawrence 100 0.21
Lee 86.6 89.93
Livingston 103.2 0
Logan 109.2 0
Mcdonough 104 0
McHenry 94.3 40.86
Mclean 103.1 0
Macon 112.2 0
Macoupin 110.1 0
Madison 104.8 0
Marion 104.6 0
Marshall 98.5 12.05
Mason 112.4 0
Mason 114.5 0
Massac 99.7 1.97
Menard 108 0
Mercer 91.8 63.85
Monroe 109.9 0
Montgomery 108.3 0
Morgan 111.3 0
Moultrie 106.7 0
Ogle 88.7 90.29
Peoria 100.7 0
Perry 97.3 14.83
Piatt 113.8 0
Pike 107.2 0
Pope 110.3 0
Pulaski 101.4 0
Putnam 91.7 65.55
Randolph 116.8 0
Richland 108.2 0
Rock Island 87.5 90.99
St. Clair 95.7 28.66
Saline 100.7 0
Sangamon 109.2 0
Schuyler 112.9 0
Scott 109 0
Shelby 104.7 0
Stark 97.3 21.15
Stephenson 86.8 94.16
Tazewell 106.5 0
Union 122.3 0
Vermilion 101.2 0
Wabash 99.6 2.76
Warren 99.8 1.49
Washington 106.9 0
Wayne 114.9 0
White 107 0
Whiteside 88.5 88.05
Will 93.4 46.56
Williamson 97.8 13.07
Winnebago 92 60.45
Woodford 97 25.09
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Illinois by county</title>
<script type="text/javascript" src="//d3js.org/d3.v3.min.js"></script>
<style type="text/css">
body {
margin: 0;
background-color: lightGray;
font-family: Helvetica, Arial, sans-serif;
}
svg {
background-color: white;
}
h1 {
font-size: 20px;
margin: 0;
}
p {
font-size: 12px;
margin: 5px 0 5px 0;
}
#container {
width: 550px;
margin-left: auto;
margin-right: auto;
margin-top: 50px;
padding: 50px;
background-color: white;
}
div.tooltip {
visibility:hidden;
position:absolute;
background: #ffffff;
width: 155px;
height: 10px;
padding-bottom: .5em;
padding-top: .25em;
padding-left: .5em;
font-size: 12px;
font-family: Helvetica, Arial, sans-serif;
text-align: left;
border: 1px solid;
pointer-events: none;
}
</style>
</head>
<body>
<div id="container">
<h1>Crop performance by county</h1>
<p>2014 corn revenue of Illinois counties as percentage of calculated historical average. Dark green areas performed better than light green areas. For the new Agricultural Risk Coverage (ARC-CO) program launched with the 2014 Farm Bill, counties performing less than 100% received payments and counties performing more than 100% received no payments. Source:<a href="http://www.fsa.usda.gov/programs-and-services/arcplc_program/index">FSA/USDA, 2015.</a></p>
<p>Circles compare populations of Chicago, Bloomington and Springfield.</p>
</div>
<div class="tooltip"></div>
<script type="text/javascript">
//crop revenue to map
var percent = "percent"
//Width and height
var w = 500;
var h = 800;
var padding = [ 20, 10, 30, 35 ]; //Top, right, bottom, left
//Define map projection
var projection = d3.geo.albers()
.center([ 6.5, 40 ])
.translate([ w/2, h/2 ])
.scale([ w * 15 ]);
//Define path generator
var path = d3.geo.path()
.projection(projection);
//define quantize scale to sort data values into areas of color
var color = d3.scale.quantize()
.range([ "#CCFF99", "#CCFF66", "#99FF00", "#00FF00"]);
//Create SVG
var svg = d3.select("#container")
.append("svg")
.attr("width", w)
.attr("height", h);
//Load in revenue data
d3.csv("cornCounties.csv", function(data) {
//set input domain for color scale
color.domain ([
d3.min(data, function(d) {return +d[percent]; }),
d3.max(data, function(d) {return +d[percent]; })
]);
var nameToPercent = {}
data.forEach(function(d){
nameToPercent[d.county.toUpperCase()] = +d.percent
})
//Load in GeoJSON data
d3.json("mapshaper_illinois.json", function(json) {
json.features.forEach(function(d){
var name = d.properties.COUNTY_NAM
var dataValue = nameToPercent[name]
d.properties.percent = dataValue
})
//Merge the revenue data and GEOjson into a single array
//Loop through once for each revenue data value
// for (var i = 0; i < data.length; i++) {
// debugger
// //grab county name
// var dataCounty = data[i].COUNTY_NAM;
// //grab data value, and convert from string to float
// var dataValue = +data[i][percent];
// //find the corresponding county inside GeoJSON
// for (var j = 0; j < json.features.length; j++) {
// //link to the FIPS code
// var jsonCounty = json.features[j].properties.CO_FIPS;
// if (dataCounty == jsonCounty) {
// //copy the data value into the GeoJSON
// json.features[j].properties.percent = dataValue;
// //Stop looking through the JSON
// break;
// }
// }
// }
//console.log(json);
//Bind data and create one path per GeoJSON feature
svg.selectAll("path")
.data(json.features)
.enter()
.append("path")
.attr("d", path)
.attr("stroke", "black")
.attr("stroke-width", .75 )
.style("fill", function(d) {
//get data value
var value = d.properties.percent
if (value) {
//if value exists...
return color(value);
}
});
var tooltip = d3.select("div.tooltip");
//Create tooltips
svg.selectAll("path")
.data(json.features)
.on("mouseover", function() {
return tooltip.style("visibility", "visible");
})
.on("mousemove", function(d) {
//debugger
tooltip.html('')
tooltip
.style("top", (d3.event.pageY + 16) + "px")
.style("left", (d3.event.pageX + 16) + "px")
tooltip
.append('div')
.text(d.properties.COUNTY_NAM + ": " + d.properties.percent + "%")
// .html('<div class="countyName">'+d.properties.COUNTY_NAM+'</div>' + ": " + d.properties.percent + " percent");
})
.on("mouseout", function() {
return tooltip.style("visibility", "hidden");
})
//Load in cities data
d3.csv("cityChicago.csv", function(data) {
//Create a circle for each city
svg.selectAll("circle")
.data(data)
.enter()
.append("circle")
.attr("cx", function(d) {
return projection([d.longitude, d.latitude])[0];
})
.attr("cy", function(d) {
return projection([d.longitude, d.latitude])[1];
})
.attr("r", function(d) {
//Use Math.sqrt to scale by area (not radius)
return Math.sqrt(+d.population / w * .075);
})
//.attr("r", 10)
.style("fill", "none")
.attr("stroke", "black")
.attr("stroke-width", 1);
}); //end cities data
}); //end d3.json()
}); //end d3.csv
</script>
</body>
</html>
Display the source blob
Display the rendered blob
Raw
mapshaper_illinois.json
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment