Skip to content

Instantly share code, notes, and snippets.

@andnorda
Last active August 29, 2015 14:17
Show Gist options
  • Save andnorda/4e0c2b4631bb8987070e to your computer and use it in GitHub Desktop.
Save andnorda/4e0c2b4631bb8987070e to your computer and use it in GitHub Desktop.
top24
12 24 36
15 5
15
13 11
12
12 5
11 3
11 2
11 2
11 3
11 9
11 8
11 5
10 8 4
10 4 2
10 1 3
10 8
10 10
10 6
9 0
9 4
9 10
9
9
9
9 8
8 1 5
8
8 8
8 6
8 5
8
8
8
8
8 8
8 7
7 11 1
7 8 13
7 6 4
7 4 3
7 4 4
7 3
7 3 6
7 2
7 1 6
7 0
7 2
7 11
7 2
7 8
7 3
7 10
7 3
7
7 5
7 4
7
7 0
7 5
7 3
7
7 3
7 3
6 11 15
6 8 7
6 5 9
6 5 5
6 4 4
6 1 1
6 2
6 7
6 4
6 6
6 7
6 2
6
6 8
6
6
6 1
6 0
6 7
6 8
6 4
6 10
6
6 2
6
6 4
6 8
6 3
6 1
6
6 3
6
6 5
5 15 4
5 10 6
5 10 5
5 9 9
5 7
5 5
5 5 2
5 5 7
5 5
5 3 8
5 2
5 2 11
5 2
5
5 4
5 3
5 3
5 4
5
5 3
5 2
5 6
5 3
5 8
5
5 8
5
5 8
5 3
5
5 3
5 6
5 3
5 2
5 6
5 4
5
5 7
5
5 7
5 4
5 9
5 5
5 4
5 4
5
5 1
5 8
5 2
5 3
5 1
5 8
5
5
5 0
4 11
4 9
4 9 3
4 8 7
4 7 6
4 6 6
4 6
4 6 2
4 6 2
4 6
4 5 4
4 4 3
4 4 6
4 3 5
4 3
4 2
4 2
4 1 6
4 1 3
4 1
4 1 4
4 0 7
4 1
4
4 4
4 4
4 5
4 7
4 4
4 4
4 3
4 8
4
4 1
4 2
4 1
4 7
4
4 5
4 6
4 8
4 2
4 4
4 2
4 3
4
4 4
4 5
4 2
4
4 7
4 3
4 4
4 4
4
4
4 1
4 3
4 4
4
4 5
4 2
4
4 2
4
4
4 1
4
4 6
4 8
4
4 7
4 4
4
4 1
4 2
4 6
4 1
4 6
4 7
4 2
4 8
4 5
4
4 14
4 8
4
4 5
4 2
4 1
4
4 1
4 5
4 5
4 9
4 13
3 10 8
3 10 0
3 8 5
3 8 7
3 7 10
3 7 2
3 6 6
3 6 5
3 6 6
3 5 1
3 5 4
3 5 5
3 4 4
3 4
3 4 3
3 4 4
3 4 6
3 3 0
3 3 3
3 3 3
3 3 8
3 3 3
3 3 2
3 3 5
3 2 3
3 2
3 1 8
3 1 8
3 1 4
3 0
3 0 2
3 4
3
3 3
3 9
3
3 1
3 3
3
3 3
3 2
3 4
3
3
3 0
3 4
3 4
3
3 1
3 4
3 2
3 6
3
3
3 3
3 1
3 3
3 6
3 5
3 3
3 3
3 1
3 6
3 0
3 6
3 9
3 4
3 6
3 4
3 3
3 3
3 1
3 3
3
3 3
3 1
3 4
3 6
3 2
3 4
3 8
3 5
3 7
3 3
3 9
3
3
3
3 3
3 4
3 3
3
3 4
3 7
3 2
3 2
3 4
3 0
3 2
3 2
3
3 5
3 1
3
3 4
3
3 5
3 9
3
3 3
3 4
3 7
3 1
3 3
3 4
3 4
3 3
3
3
3 6
3
3 1
3
3 1
3 4
3
2 11 9
2 10
2 9 7
2 9 2
2 8 3
2 8 8
2 7 3
2 7
2 5 8
2 5 3
2 5 2
2 5 4
2 5 4
2 5 8
2 5 7
2 5 2
2 4 11
2 4 7
2 4 8
2 3 4
2 3 6
2 3 4
2 3 2
2 2 7
2 2
2 2 7
2 2
2 2 4
2 1 7
2 1
2 1 4
2 1
2 1 4
2 0
2
2 4
2 6
2 1
2 5
2 2
2 4
2 3
2 6
2 2
2 5
2 2
2 5
2 0
2
2 3
2 4
2 2
2 4
2 8
2
2 4
2 5
2 5
2 3
2 2
2 4
2 6
2 1
2 8
2 3
2 4
2 8
2
2 5
2 9
2 2
2 2
2 6
2 5
2 1
2 2
2 3
2 3
2 3
2
2 8
2 0
2 2
2 3
2 1
2 4
2 5
2 5
2 7
2 5
2 2
2
2
2 3
2 6
2 7
2
2 5
2
2
2 0
2 4
2 2
2 2
2 2
2 5
2
2 4
2
2 2
2 5
2 7
2 5
2
2 4
2
2 1
2 2
2 1
2 3
2 4
2 1
2 3
2 7
2
2 8
2 1
2 0
2 8
2 2
2 5
2 2
2 4
2 2
2
2 5
2
2 1
2
2 1
2 7
2
2 8
2 11
2
2 3
2 4
2 1
2
2 4
2 4
2 4
2
2
2
2 5
2 3
2
2 7
2 4
1 12
1 11 4
1 10 4
1 10
1 10 1
1 10 10
1 8 8
1 8
1 8
1 7 5
1 7
1 7 6
1 7 2
1 7 4
1 7 4
1 7 5
1 6 5
1 6 3
1 6 4
1 6 1
1 6 6
1 6 3
1 5
1 5 4
1 5 14
1 5
1 5 3
1 5 4
1 5 3
1 4 6
1 4
1 4 4
1 4 6
1 4 2
1 4 0
1 4 3
1 4
1 4 2
1 4 6
1 3 5
1 3 3
1 3 1
1 3
1 3 5
1 2 3
1 2 0
1 2 5
1 2
1 2 2
1 2 0
1 2
1 2 2
1 2
1 2 7
1 2 4
1 2 4
1 2 9
1 1 3
1 1 8
1 0 2
1 5
1 1
1 7
1 3
1 0
1 1
1 4
1 3
1
1 8
1 0
1 2
1
1 7
1
1 0
1 3
1 2
1 2
1 4
1 4
1
1 2
1
1 3
1 1
1 1
1 3
1 7
1 6
1
1 8
1 5
1 6
1 2
1 2
1 9
1 1
1
1
1 3
1 5
1 1
1 2
1 5
1
1 1
1 3
1 2
1 3
1 3
1 7
1 3
1 4
1 5
1 5
1
1 5
1 3
1 3
1 2
1 6
1 6
1
1 2
1 0
1 1
1 2
1
1 7
1 3
1 2
1 1
1
1 6
1 11
1 2
1
1 0
1 4
1
1
1
1
1 4
1 5
1 6
1
1 2
1 1
1 4
1
1 2
1 5
1
1 5
1 2
1 2
1 8
1 8
1
1 1
1 2
1
1
1 8
1
1 4
1 3
1 2
1
1 3
1
1 1
1 5
1 3
1
1
1 4
1
1 6
1 3
1 7
1 8
1 2
1
1 0
1 1
1
1
1 9
1 4
1
1
1 1
1
1 1
1 5
1
1
1 4
1 6
1 1
1
1 5
1 3
1 1
1
1
1 1
1 8
1 5
1 5
0 13 7
0 11 9
0 11
0 9 6
0 8 5
0 8 10
0 7 6
0 7 8
0 7
0 6
0 6 7
0 6 7
0 6 5
0 6
0 6 7
0 5 2
0 5 2
0 5 4
0 5 4
0 5
0 5 7
0 5 5
0 5
0 5 3
0 5 6
0 5 2
0 4 10
0 4 3
0 4 2
0 4 6
0 4 7
0 4
0 4 7
0 4 5
0 4
0 4
0 3 2
0 3 3
0 3 5
0 3
0 3 6
0 3 0
0 3 7
0 3 7
0 3 7
0 3 4
0 3 3
0 2 6
0 2 3
0 2
0 2
0 2 2
0 2
0 2
0 2
0 1
0 1 6
0 1
0 1 4
0 1 8
0 1 9
0 0 6
0 0 3
0 0 4
0 0 1
0 0 1
0 0 7
0 0 1
0 1
0 5
0 6
0 6
0
0 4
0 0
0 7
0 2
0 0
0 10
0 6
0 4
0 2
0 2
0 3
0 8
0 3
0 7
0 5
0 3
0 3
0 4
0
0 2
0 4
0 1
0
0 7
0 14
0 10
0 3
0 5
0 6
0 1
0
0 3
0
0 4
0
0
0 3
0 6
0 3
0 5
0 1
0 0
0
0 3
0 1
0 12
0
0 2
0 1
0 10
0 4
0 0
0 0
0 3
0 1
0
0 4
0 2
0 3
0 5
0 7
0 2
0
0 8
0 7
0 14
0 4
0
0 5
0 3
0 4
0 4
0 0
0 6
0
0 5
0 4
0
0
0
0
0 4
0
0
0 7
0
0 1
0
0 9
0
0 3
0
0 6
0 7
0 2
0
0
0
0 2
0
0
0
0 1
0 2
0
0 6
0 3
0
0 3
0
0
0 5
0 3
0
0 5
0 3
0 3
0
0 3
0 6
0 4
0
0
0 4
0 5
0 8
0 4
0 3
0
0
0 4
0 1
0 1
0 4
0
0 6
0 6
0
0 7
0 1
0 3
0
0 4
0 3
0 4
0 2
0 7
0 3
0 1
0 1
0 2
0 8
0
16
16
14
14 2
14
14
14
14
13
13
13
12
11
11
11
11
11
10
10
10
10
10
10
10
10
10
10 6
10
10
9
9
9
9
9
9
9
9
9
9
9
9
9
9
9 3
9
9
9
9
9
9
9
9
9
9
9
8
8
8
8
8
8
8
8
8
8
8
8
8
8 2
8
8
8
8
8
8
8
8
8
8
8
8 6
8
8
8
8
8
8
8
8
8
8
8
7
7
7
7
7
7
7
7 4
7
7
7
7
7
7
7
7 7
7
7
7
7
7
7
7
7
7
7 2
7
7
7
7
7
7
7
7 8
7
7
7
7
7
7
7
7
7
7
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6 1
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6
6 8
6
6
6
6
6
6
6 9
6
6 9
6
6
6
6
6
6
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5 4
5
5
5
5
5
5
5
5
5
5
5
5
5
5
5 10
5
5
5
5
5
5
5
5
5 6
5
5
5
5
5
5
5
5
5
5
5 4
5
5
5 9
5
5
5
5
5
5
5
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4 2
4
4
4
4
4 5
4 0
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4 3
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4
4 8
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3 1
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3
3 9
3
3
3
3
3
3
3
3
3
3
3
3
2
2
2
2
2
2
2 3
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2 6
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2 4
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
1
1
1
1
1
1
1
1
1 2
1
1
1
1
1
1
1
1
1
1
1 1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
0
0
0
0
0
0
0
0
0
0
0
0
0
0
0
0
0
0
0
0 3
0
0
0 1
0
0
0
0
0
0
0
0
0 1
0
0
0 2
5
3
3
6
2
5
8
4
3
2
7
9
9
7
2
1
5
7
5
11
5
9
7
2
11
9
8
1
0
3
4
7
2
8
6
5
5
2
3
0
6
4
5
5
6
4
1
3
0
6
5
3
1
5
1
2
9
4
3
5
4
0
1
3
6
0
<!doctype html>
<meta charset="utf-8">
<style>
.axis path,
.axis line {
fill: none;
stroke: #000;
}
.line {
stroke: steelblue;
fill: none;
stroke-width: 4px;
}
.label {
font: 40px sans-serif;
}
</style>
<body>
<script src="http://d3js.org/d3.v3.js"></script>
<script>
var margin = {top: 20, right: 40, bottom: 40, left: 70},
width = 960 - margin.left - margin.right,
height = 500 - margin.top - margin.bottom;
var x = d3.scale.linear()
.range([0, width]);
var y = d3.scale.linear()
.range([height, 0]);
var color = d3.scale.category10();
var xAxis = d3.svg.axis()
.scale(x)
.tickValues([12, 24, 36])
.orient("bottom");
var yAxis = d3.svg.axis()
.scale(y)
.orient("left");
var line = d3.svg.line()
.x(function(d) { return x(d.age); })
.y(function(d) { return y(d.frequency) });
var svg = d3.select("body").append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)
.append("g")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
d3.tsv("data.tsv", parse, function(error, data) {
var sorted = data.filter(function(d) {
return [12, 24, 36].every(function(attr) {
return d[attr];
});
}).sort(function(a, b) {
return b[24] - a[24];
}).map(function(d, i) {
return {
i: i,
values: [12, 24, 36].map(function(age) {
return {
age: age,
frequency: d[age]
};
})
};
}).slice(0, 10);
x.domain([12, 36]);
y.domain([0, 16]);
svg.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0," + height + ")")
.call(xAxis);
svg.append("g")
.attr("class", "y axis")
.call(yAxis);
svg.append("g")
.append("text")
.attr("class", "label")
.attr("dy", "1em")
.attr("dx", "1em")
.text("top24");
var item = svg.selectAll(".case")
.data(sorted)
.enter().append("g")
.attr("class", "case");
item.append("path")
.attr("class", "line")
.attr("d", function(d) { return line(d.values); })
.style("stroke", function(d) { return color(d.i); });
});
function parse(data) {
[12, 24, 36].forEach(function(attr) {
data[attr] = data[attr] !== ' ' ? +data[attr] : undefined;
});
return data;
}
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment