Skip to content

Instantly share code, notes, and snippets.

@js418

js418/.block

Last active February 9, 2017 17:41
Show Gist options
  • Save js418/7e969480c0092c56955d7e859648855d to your computer and use it in GitHub Desktop.
Save js418/7e969480c0092c56955d7e859648855d to your computer and use it in GitHub Desktop.
Download ZIP
Correlation matrix for education attainment over ages
Raw
.block
license: mit
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Correlation Matrix</title>
<style>
.node {
stroke: #fff;
stroke-width: 1.5px;
}
.link {
fill: none;
stroke: #000;
stroke-width: 1.5px;
opacity: 0.4;
marker-end: url(#end-arrow);
}
</style>
</head>
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.16/d3.min.js"></script>
<script>
//These attributes could be derived from the data
attributes = ["All","25-34","35-54","55+"];
attributeMatrix = [];
attributes.forEach(function (a, x) {
attributes.forEach(function (b, y) {
//create an n-by-n matrix based on pairs of attributes
attributeMatrix.push({a: a, b: b, x: x, y: y})
})
})
colors = d3.scale.category20();
d3.csv("year school_races.csv", small_scatterplots);
d3.select("body").append("svg").attr("height", 1000).attr("width", 1000);
function small_scatterplots(data) {
//d3.csv pulls in data as strings so they need to be formatted as numbers
data.forEach(function (d) {
attributes.forEach(function (att) {
d[att] = parseFloat(d[att])
})
})
//create scales dynamically for each attribute's extent
scale = {};
attributes.forEach(function (att) {
scale[att] = d3.scale.linear();
attExtent = d3.extent(data, function (d) {return d[att]});
scale[att].domain(attExtent).range([5,195]);
})
//bind the matrix array to a grid of g elements
d3.select("svg")
.selectAll("g")
.data(attributeMatrix)
.enter()
.append("g")
.attr("transform", function (d) {return "translate(" + (d.x * 200) + "," + (d.y * 200) + ")" });
d3.selectAll("g")
.each(function (matrix, i) {
//index i is only used for coloring
//background/border
d3.select(this).append("rect").style("fill", "white").style("stroke", "black").style("stroke-width", 1)
.attr("height", 200)
.attr("width", 200);
//label
d3.select(this).append("text")
.attr("x", 100)
.style("text-anchor", "middle")
.attr("y", 15)
.attr("font-size", 15)
.text(matrix.a + " vs " + matrix.b);
//scatterplot points
d3.select(this).selectAll("circle")
.data(data)
.enter()
.append("circle")
.attr("r", 2)
.style("fill", colors(i))
.attr("cx", function (d) {return scale[matrix.a](d[matrix.a])})
.attr("cy", function (d) {return 195 - scale[matrix.b](d[matrix.b])})
})
}
</script>
</body>
</html>
Raw
year school_races.csv
education All Males Females 25-34 35-54 55+ White Non-His White Black Asian Hispanic
Less than 1 year, no diploma 0.40000000000000002 0.40000000000000002 0.40000000000000002 0.20000000000000001 0.40000000000000002 0.5 0.29999999999999999 0.10000000000000001 0.29999999999999999 1.1000000000000001 1.3999999999999999
1st-4th grade, no diploma 0.80000000000000004 0.90000000000000002 0.80000000000000004 0.5 0.69999999999999996 1.2 0.80000000000000004 0.20000000000000001 0.59999999999999998 1.3 3.8999999999999999
5th-6th grade, no diploma 1.6000000000000001 1.7 1.5 1.0 1.8 1.7 1.7 0.29999999999999999 0.90000000000000002 1.8999999999999999 8.4000000000000004
7th-8th grade, no diploma 1.8 1.8999999999999999 1.8 1.0 1.5 2.5 1.8999999999999999 1.2 1.5 1.8 5.0999999999999996
9th grade, no diploma 1.6000000000000001 1.6000000000000001 1.6000000000000001 1.5 1.7 1.6000000000000001 1.7 0.90000000000000002 1.3 1.1000000000000001 5.2999999999999998
10th grade, no diploma 1.8 1.8999999999999999 1.8 1.5 1.6000000000000001 2.2000000000000002 1.7 1.5 2.7000000000000002 1.3999999999999999 3.0
11th grade, no diploma 2.0 2.1000000000000001 2.0 2.2000000000000002 1.8999999999999999 2.1000000000000001 1.8999999999999999 1.6000000000000001 3.3999999999999999 1.0 3.3999999999999999
12th grade, no diploma 1.3999999999999999 1.5 1.3999999999999999 1.6000000000000001 1.3999999999999999 1.3999999999999999 1.3 1.0 2.2000000000000002 1.3 3.0
Less than 1 year, GED 0.0 0.0 0.0 0.0 0.0 0.0 0.0 0.0 0.0 0.0 0.0
1st-4th grade, GED 0.0 0.0 0.0 0.0 0.0 0.0 0.0 0.0 0.10000000000000001 0.0 0.10000000000000001
5th-6th grade, GED 0.0 0.0 0.0 0.0 0.0 0.0 0.0 0.0 0.0 0.0 0.10000000000000001
7th-8th grade, GED 0.20000000000000001 0.20000000000000001 0.10000000000000001 0.10000000000000001 0.10000000000000001 0.20000000000000001 0.20000000000000001 0.20000000000000001 0.10000000000000001 0.0 0.20000000000000001
9th grade, GED 0.29999999999999999 0.29999999999999999 0.29999999999999999 0.29999999999999999 0.29999999999999999 0.29999999999999999 0.29999999999999999 0.29999999999999999 0.20000000000000001 0.0 0.29999999999999999
10th grade, GED 0.80000000000000004 0.90000000000000002 0.69999999999999996 0.80000000000000004 0.80000000000000004 0.80000000000000004 0.80000000000000004 0.90000000000000002 0.69999999999999996 0.10000000000000001 0.59999999999999998
11th grade, GED 1.0 1.2 0.80000000000000004 1.1000000000000001 1.1000000000000001 0.90000000000000002 1.0 1.0 1.3 0.20000000000000001 1.0
12th grade, GED 0.59999999999999998 0.69999999999999996 0.59999999999999998 0.69999999999999996 0.69999999999999996 0.5 0.59999999999999998 0.5 0.80000000000000004 0.5 0.90000000000000002
High school diploma 26.5 27.100000000000001 26.0 22.5 24.899999999999999 30.100000000000001 26.600000000000001 26.5 31.0 18.199999999999999 26.699999999999999
Less than 1 year college, no degree 2.5 2.3999999999999999 2.5 2.7000000000000002 2.2000000000000002 2.6000000000000001 2.5 2.7000000000000002 2.6000000000000001 1.1000000000000001 1.8999999999999999
One year of college, no degree 5.2999999999999998 5.0 5.5 5.5999999999999996 5.0 5.2999999999999998 5.2999999999999998 5.4000000000000004 6.4000000000000004 1.8999999999999999 4.5
Two years of college, no degree 6.5 6.5 6.4000000000000004 6.7999999999999998 6.2999999999999998 6.4000000000000004 6.2999999999999998 6.4000000000000004 8.4000000000000004 4.5999999999999996 5.7000000000000002
Three years of college, no degree 1.7 1.8 1.7 2.2999999999999998 1.6000000000000001 1.6000000000000001 1.7 1.7 2.2999999999999998 1.2 1.5
Four or more years of college, no degree 0.69999999999999996 0.80000000000000004 0.59999999999999998 1.1000000000000001 0.69999999999999996 0.5 0.69999999999999996 0.69999999999999996 0.80000000000000004 0.69999999999999996 0.69999999999999996
Less than 1 year college, vocational/associates 0.29999999999999999 0.20000000000000001 0.29999999999999999 0.29999999999999999 0.20000000000000001 0.29999999999999999 0.29999999999999999 0.29999999999999999 0.20000000000000001 0.0 0.20000000000000001
One year of college, vocational/associates 0.59999999999999998 0.5 0.59999999999999998 0.59999999999999998 0.59999999999999998 0.5 0.59999999999999998 0.59999999999999998 0.59999999999999998 0.40000000000000002 0.59999999999999998
Two years of college, vocational/associates 2.7000000000000002 2.6000000000000001 2.7999999999999998 2.6000000000000001 2.8999999999999999 2.5 2.7000000000000002 2.8999999999999999 2.7999999999999998 1.6000000000000001 1.8
Three years of college, vocational/associates 0.40000000000000002 0.40000000000000002 0.40000000000000002 0.5 0.5 0.40000000000000002 0.40000000000000002 0.5 0.5 0.20000000000000001 0.29999999999999999
Four or more years of college, vocational/associates 0.40000000000000002 0.40000000000000002 0.40000000000000002 0.40000000000000002 0.40000000000000002 0.40000000000000002 0.40000000000000002 0.40000000000000002 0.29999999999999999 0.29999999999999999 0.29999999999999999
Less than 1 year college, academic/associates 0.10000000000000001 0.10000000000000001 0.10000000000000001 0.10000000000000001 0.10000000000000001 0.10000000000000001 0.10000000000000001 0.10000000000000001 0.0 0.10000000000000001 0.10000000000000001
One year of college, academic/associates 0.29999999999999999 0.29999999999999999 0.40000000000000002 0.29999999999999999 0.29999999999999999 0.29999999999999999 0.40000000000000002 0.40000000000000002 0.29999999999999999 0.10000000000000001 0.29999999999999999
Two years of college, academic/associates 3.7000000000000002 3.1000000000000001 4.2000000000000002 3.7000000000000002 4.0999999999999996 3.2999999999999998 3.7000000000000002 3.8999999999999999 3.8999999999999999 2.7000000000000002 2.6000000000000001
Three years of college, academic/associates 0.80000000000000004 0.69999999999999996 0.90000000000000002 1.0 0.80000000000000004 0.69999999999999996 0.80000000000000004 0.80000000000000004 0.69999999999999996 0.59999999999999998 0.59999999999999998
Four or more years of college, academic/associates 0.69999999999999996 0.59999999999999998 0.69999999999999996 0.90000000000000002 0.69999999999999996 0.5 0.69999999999999996 0.69999999999999996 0.59999999999999998 0.40000000000000002 0.40000000000000002
Bachelors degree 20.5 20.300000000000001 20.699999999999999 25.300000000000001 21.899999999999999 16.899999999999999 20.699999999999999 22.699999999999999 14.300000000000001 32.5 10.800000000000001
Master's degree /2 8.6999999999999993 8.0 9.4000000000000004 8.3000000000000007 9.4000000000000004 8.3000000000000007 8.6999999999999993 9.8000000000000007 6.5999999999999996 14.4 3.5
Professional degree 1.6000000000000001 1.8999999999999999 1.3 1.3999999999999999 1.6000000000000001 1.7 1.7 1.8999999999999999 0.80000000000000004 2.7000000000000002 0.69999999999999996
Doctorate degree 1.7 2.1000000000000001 1.3999999999999999 1.2 1.8 1.8999999999999999 1.7 1.8999999999999999 0.80000000000000004 4.2999999999999998 0.5
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment