Skip to content

Instantly share code, notes, and snippets.

@queuebit
Last active April 11, 2016 05:25
Show Gist options
  • Save queuebit/e68ea119e347849910b50b59165a0a4d to your computer and use it in GitHub Desktop.
Save queuebit/e68ea119e347849910b50b59165a0a4d to your computer and use it in GitHub Desktop.
Hypercritical Histogram
license: mit
number name released length_h_m length_min
75 Hypercritical 75: Just a Dinosaur 7/6/2012 1h 32m 92
74 Hypercritical 74: Everybody Wants to Rule the World 6/29/2012 1h 59m 119
73 Hypercritical 73: 22 Degrees 6/22/2012 1h 42m 102
72 Hypercritical 72: Seven Levels of Air Quotes 6/15/2012 1h 9m 69
71 Hypercritical 71: Bristling With Controls 6/8/2012 1h 46m 106
70 Hypercritical 70: Deja Vu 6/1/2012 1h 39m 99
69 Hypercritical 69: Sport of Kings 5/25/2012 1h 55m 115
68 Hypercritical 68: Patent Hands 5/18/2012 2h 14m 134
67 Hypercritical 67: A Pill That Helps with Whatever 5/11/2012 2h 1m 121
66 Hypercritical 66: The Housewives of Siracusa County 5/4/2012 2h 6m 126
65 Hypercritical 65: Look Right into the Eyes of Your Sweetie 4/27/2012 1h 40m 100
64 Hypercritical 64: You Will Die Instantly! 4/20/2012 1h 40m 100
63 Hypercritical 63: Talking to the Bear 4/13/2012 1h 45m 105
62 Hypercritical 62: A Sack Containing Scum from a Pond 4/6/2012 1h 46m 106
61 Hypercritical 61: I Ran Out of Bombs Long Ago 3/30/2012 1h 47m 107
60 Hypercritical 60: Reversing the Polarity 3/23/2012 1h 29m 89
59 Hypercritical 59: Safari is Apple's Google 3/16/2012 2h 15m 135
58 Hypercritical 58: No More Numbers For You / The Four Tuners 3/9/2012 1h 48m 108
57 Hypercritical 57: Computational Skeuomorphism 3/2/2012 1h 42m 102
56 Hypercritical 56: Belt and Suspenders 2/24/2012 1h 59m 119
55 Hypercritical 55: Region of Pain 2/17/2012 1h 29m 89
54 Hypercritical 54: Public Service Announcement 2/11/2012 0h 1m 1
53 Hypercritical 53: Brad Pitt Gets to Contribute 2/3/2012 1h 33m 93
52 Hypercritical 52: Marked for Deletion 1/27/2012 2h 12m 132
51 Hypercritical 51: Unjustified Confidence 1/20/2012 1h 22m 82
50 Hypercritical 50: Maximum Deflection in All Directions 1/13/2012 1h 45m 105
49 Hypercritical 49: Pinching the Harmonica 1/6/2012 2h 15m 135
48 Hypercritical 48: Blue Ocean 12/30/2011 2h 3m 123
47 Hypercritical 47: Brute Force Attack 12/23/2011 1h 38m 98
46 Hypercritical 46: Not Entirely Nefarious 12/16/2011 2h 5m 125
45 Hypercritical 45: Star Wars is Not a Blog Post 12/9/2011 1h 47m 107
44 Hypercritical 44: A Little Bit More Sad 11/25/2011 1h 11m 71
43 Hypercritical 43: The Scorpion and the Frog 11/18/2011 1h 42m 102
42 Hypercritical 42: The Wrong Guy 11/11/2011 1h 15m 75
41 Hypercritical 41: The Homer 11/4/2011 1h 39m 99
40 Hypercritical 40: When The Hobby Light Goes Off 10/28/2011 1h 32m 92
39 Hypercritical 39: Quasimodo Backpack 10/21/2011 1h 32m 92
38 Hypercritical 38: Virtually Spotless 10/14/2011 1h 27m 87
37 Hypercritical 37: A Story of Triumph 10/7/2011 1h 11m 71
36 Hypercritical 36: Wedge 9/30/2011 1h 25m 85
35 Hypercritical 35: Wrestling an Alligator 9/23/2011 1h 25m 85
34 Hypercritical 34: Pride in Craftsmanship 9/16/2011 1h 29m 89
33 Hypercritical 33: Square Bracket Colon Smiley 9/9/2011 1h 17m 77
32 Hypercritical 32: The Next Big Move 8/31/2011 1h 32m 92
31 Hypercritical 31: Strong Arguments for and Against 8/24/2011 1h 21m 81
30 Hypercritical 30: Paths in the Grass 8/17/2011 1h 8m 68
29 Hypercritical 29: In Too Deep 8/10/2011 1h 20m 80
28 Hypercritical 28: Trust But Verify 7/28/2011 1h 23m 83
27 Hypercritical 27: Nakedly Optimistic 7/24/2011 1h 36m 96
26 Hypercritical 26: White Smoke 7/13/2011 1h 7m 67
25 Hypercritical 25: Invisible Software 7/6/2011 1h 16m 76
24 Hypercritical 24: Sometimes It Hurts 7/2/2011 1h 12m 72
23 Hypercritical 23: No Sentence Left Behind 6/24/2011 1h 42m 102
22 Hypercritical 22: I Would Not Build Underground 6/17/2011 1h 17m 77
21 Hypercritical 21: Reading Playboy for the Articles 6/10/2011 1h 43m 103
20 Hypercritical 20: I've Got Nothing 6/4/2011 0h 46m 46
19 Hypercritical 19: Don't Make Me Read 5/27/2011 0h 58m 58
18 Hypercritical 18: Worse and More Diverse 5/20/2011 1h 13m 73
17 Hypercritical 17: Intruding Gooseneck 5/13/2011 1h 34m 94
16 Hypercritical 16: The Soap Opera Effect 5/6/2011 1h 42m 102
15 Hypercritical 15: The Bridges of Siracusa County 4/29/2011 1h 43m 103
14 Hypercritical 14: A Dark Age of Objective-C 4/15/2011 1h 26m 86
13 Hypercritical 13: The Tortoise and the Hare 4/8/2011 1h 24m 84
12 Hypercritical 12: Nothing Is So Perfect 4/1/2011 1h 12m 72
11 Hypercritical 11: I Am the Steve Jobs of This Sandwich 3/25/2011 1h 18m 78
10 Hypercritical 10: Like Giving a Machine Gun to a Baby 3/18/2011 1h 25m 85
9 Hypercritical 9: No iLife is an Island 3/11/2011 1h 5m 65
8 Hypercritical 8: A Cautionary Tale 3/4/2011 1h 16m 76
7 Hypercritical 7: ThunderCats 2/25/2011 1h 30m 90
6 Hypercritical 6: Frivolous Things 2/18/2011 1h 43m 103
5 Hypercritical 5: Slippery Little Pill 2/11/2011 1h 1m 61
4 Hypercritical 4: iOS vs. The World 2/4/2011 1h 4m 64
3 Hypercritical 3: The Mouse is Not a Finger 1/28/2011 1h 9m 69
2 Hypercritical 2: Backup Vortex 1/21/2011 1h 14m 74
1 Hypercritical 1: Dream Crusher 1/14/2011 0h 57m 57
<!DOCTYPE html>
<meta charset="utf-8">
<style>
body {
font: 10px sans-serif;
}
.bar rect {
fill: steelblue;
shape-rendering: crispEdges;
}
.bar text {
fill: #fff;
}
.axis path, .axis line {
fill: none;
stroke: #000;
shape-rendering: cripEdges;
}
</style>
<body>
<script src="//d3js.org/d3.v3.min.js"></script>
<script>
// Formatters for counts and times (converting numbers to Dates).
var formatCount = d3.format(",.0f"),
formatTime = d3.time.format("%H:%M"),
formatMinutes = function(d) { return formatTime(new Date(2016, 3, 1, 0, d)); };
var margin = { top: 10, right: 30, bottom: 30, left: 30},
width = 960 - margin.left - margin.right,
height = 500 - margin.top - margin.bottom;
var x = d3.scale.linear()
.domain([0,200])
.range([0, width]);
// Generate a histogram using twenty uniformly-spaced bins.
d3.tsv("hypercritical_durations.tsv", type, function(error, data) {
// Map tsv data to only capture the length_min values
minutes = data.map(function (d) { return d.length_min })
var h_bins = d3.layout.histogram()
.bins(x.ticks(20))
(minutes);
var y = d3.scale.linear()
.domain([0, d3.max(h_bins, function(d) { return d.y })])
.range([height, 0]);
var xAxis = d3.svg.axis()
.scale(x)
.orient("bottom")
.tickFormat(formatMinutes);
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 + ")");
var bar = svg.selectAll(".bar")
.data(h_bins)
.enter().append("g")
.attr("class", "bar")
.attr("transform", function(d) { return "translate(" + x(d.x) + "," + y(d.y) + ")"; });
bar.append("rect")
.attr("x", 1)
.attr("width", x(h_bins[0].dx) - 1)
.attr("height", function(d) { return height - y(d.y); });
bar.append("text")
.attr("dy", ".75em")
.attr("y", 6)
.attr("x", x(h_bins[0].dx) / 2)
.attr("text-anchor", "middle")
.text(function(d) { return formatCount(d.y); });
svg.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0," + height + ")")
.call(xAxis);
});
function type(d) {
d.value = +d.value; // coerce to number
return d;
}
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment