Created
September 14, 2015 02:34
-
-
Save rdinnager/52c81cd3b66ebaf825f4 to your computer and use it in GitHub Desktop.
Testing out basic bar charts in D3 using @midnight data
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
player | Gender | hits | first | second | third | total | simple.points | image | image_ht | image_wd | |
---|---|---|---|---|---|---|---|---|---|---|---|
Kumail Nanjiani | M | 404000 | 4 | 2 | 0 | 6 | 0.833333333333333 | https://duckduckgo.com/i/b7d0c4ff.jpg | 200 | 164 | |
Andy Daly | M | 182000 | 2 | 3 | 1 | 6 | 0.583333333333333 | https://duckduckgo.com/i/ff655da8.jpg | 200 | 133 | |
Kyle Kinane | M | 190000 | 7 | 1 | 2 | 10 | 0.75 | https://duckduckgo.com/i/cb420bdf.jpg | 200 | 300 | |
Kristen Schaal | F | 512000 | 2 | 1 | 1 | 4 | 0.625 | https://duckduckgo.com/i/0cf592c2.jpg | 200 | 150 | |
Patton Oswalt | M | 747000 | 1 | 2 | 0 | 3 | 0.666666666666667 | https://duckduckgo.com/i/bbfa97b3.jpg | 200 | 168 | |
Matt Besser | M | 167000 | 3 | 3 | 1 | 7 | 0.642857142857143 | https://duckduckgo.com/i/804ac973.jpg | 200 | 100 | |
Moshe Kasher | M | 107000 | 5 | 3 | 1 | 9 | 0.722222222222222 | https://duckduckgo.com/i/122b4834.jpg | 200 | 200 | |
Jonah Ray | M | 160000 | 3 | 5 | 2 | 10 | 0.55 | https://duckduckgo.com/i/09b947a3.jpg | 200 | 310 | |
Ron Funches | M | 154000 | 11 | 2 | 0 | 13 | 0.923076923076923 | https://duckduckgo.com/i/d6db36c0.jpg | 200 | 143 | |
Paul F. Tompkins | M | 407000 | 7 | 5 | 1 | 13 | 0.730769230769231 | https://duckduckgo.com/i/e9729043.jpg | 200 | 127 | |
Kurt Braunohler | M | 178000 | 4 | 7 | 2 | 13 | 0.576923076923077 | https://duckduckgo.com/i/40f87c62.jpg | 200 | 148 | |
David Koechner | M | 426000 | 1 | 3 | 0 | 4 | 0.625 | https://duckduckgo.com/i/c5fd5365.jpg | 200 | 133 | |
Neal Brennan | M | 189000 | 4 | 0 | 1 | 5 | 0.8 | https://duckduckgo.com/i/1e9c9bab.jpg | 200 | 300 | |
Paul Scheer | M | 424000 | 3 | 4 | 2 | 9 | 0.555555555555556 | https://duckduckgo.com/i/3093eac9.jpg | 200 | 276 | |
Doug Benson | M | 395000 | 8 | 11 | 0 | 19 | 0.710526315789474 | https://duckduckgo.com/i/e6f68170.jpg | 200 | 151 | |
Arden Myrin | F | 189000 | 3 | 4 | 1 | 8 | 0.625 | https://duckduckgo.com/i/ac2cfb69.jpg | 200 | 132 | |
Jon Daly | M | 209000 | 4 | 0 | 2 | 6 | 0.666666666666667 | https://duckduckgo.com/i/0cbec28c.jpg | 184 | 162 | |
Steve Agee | M | 133000 | 4 | 6 | 2 | 12 | 0.583333333333333 | https://duckduckgo.com/i/294288de.jpg | 200 | 167 | |
Riki Lindhome | F | 343000 | 1 | 2 | 0 | 3 | 0.666666666666667 | https://duckduckgo.com/i/bd8b96dd.jpg | 200 | 170 | |
Jason Sklar | M | 59300 | 3 | 4 | 3 | 10 | 0.5 | https://duckduckgo.com/i/34ccb4bb.jpg | 200 | 268 | |
Dana Gould | M | 202000 | 2 | 1 | 0 | 3 | 0.833333333333333 | https://duckduckgo.com/i/86525e05.jpg | 200 | 200 | |
Hannibal Buress | M | 597000 | 3 | 0 | 0 | 3 | 1 | https://duckduckgo.com/i/f87c9398.jpg | 200 | 189 | |
Brett Gelman | M | 166000 | 4 | 2 | 1 | 7 | 0.714285714285714 | https://duckduckgo.com/i/9bb566af.jpg | 200 | 161 | |
Natasha Leggero | F | 547000 | 3 | 1 | 4 | 8 | 0.4375 | https://duckduckgo.com/i/e03076ba.jpg | 200 | 300 | |
Grace Helbig | F | 760000 | 3 | 2 | 2 | 7 | 0.571428571428571 | https://duckduckgo.com/i/10514be5.jpg | 200 | 200 | |
Randy Sklar | M | 51300 | 4 | 5 | 1 | 10 | 0.65 | https://duckduckgo.com/i/34ccb4bb.jpg | 200 | 268 | |
Maria Bamford | F | 323000 | 1 | 1 | 2 | 4 | 0.375 | https://duckduckgo.com/i/62e3d8b1.jpg | 200 | 150 | |
Rob Huebel | M | 266000 | 3 | 4 | 0 | 7 | 0.714285714285714 | https://duckduckgo.com/i/5b7a7391.jpg | 200 | 216 | |
Rhys Darby | M | 3e+05 | 4 | 1 | 2 | 7 | 0.642857142857143 | https://duckduckgo.com/i/a7beebf5.jpg | 200 | 165 | |
James Adomian | M | 114000 | 1 | 0 | 4 | 5 | 0.2 | https://duckduckgo.com/i/c7387b56.jpg | 200 | 168 | |
Mamrie Hart | F | 388000 | 2 | 2 | 2 | 6 | 0.5 | https://duckduckgo.com/i/30fd6ac0.jpg | 200 | 197 | |
Aisha Tyler | F | 623000 | 3 | 0 | 0 | 3 | 1 | https://duckduckgo.com/i/fe52ebce.jpg | 200 | 144 | |
Mike Phirman | M | 30400 | 2 | 1 | 0 | 3 | 0.833333333333333 | https://duckduckgo.com/i/ba972a25.jpg | 200 | 296 | |
Jen Kirkman | F | 244000 | 4 | 7 | 1 | 12 | 0.625 | https://duckduckgo.com/i/660e0c9c.jpg | 200 | 150 | |
Rob Riggle | M | 453000 | 1 | 3 | 1 | 5 | 0.5 | https://duckduckgo.com/i/0c20f5c0.jpg | 200 | 135 | |
Janet Varney | F | 166000 | 2 | 0 | 1 | 3 | 0.666666666666667 | https://duckduckgo.com/i/35119c07.jpg | 200 | 136 | |
Brandon Johnson | M | 424000 | 3 | 0 | 1 | 4 | 0.75 | https://duckduckgo.com/i/336ee66a.jpg | 200 | 85 | |
John Hodgman | M | 409000 | 1 | 1 | 3 | 5 | 0.3 | https://duckduckgo.com/i/95306ac7.jpg | 200 | 133 | |
Adam Cayton-Holland | M | 31100 | 1 | 1 | 1 | 3 | 0.5 | https://duckduckgo.com/i/1d5e1c47.jpeg | 200 | 129 | |
Heather Anne Campbell | F | 36300 | 2 | 2 | 0 | 4 | 0.75 | https://duckduckgo.com/i/b25827a9.jpg | 200 | 132 | |
Tom Rhodes | M | 207000 | 1 | 1 | 1 | 3 | 0.5 | https://duckduckgo.com/i/af694210.jpg | 200 | 133 | |
Wil Wheaton | M | 931000 | 2 | 2 | 0 | 4 | 0.75 | https://duckduckgo.com/i/beec8c3f.jpg | 200 | 143 | |
Margaret Cho | F | 1220000 | 1 | 1 | 1 | 3 | 0.5 | https://duckduckgo.com/i/9bf96542.jpg | 200 | 151 | |
Marc Maron | M | 659000 | 2 | 2 | 0 | 4 | 0.75 | https://duckduckgo.com/i/67a755b9.jpg | 200 | 152 | |
Rory Scovel | M | 115000 | 1 | 1 | 1 | 3 | 0.5 | https://duckduckgo.com/i/afbf18b7.jpg | 200 | 300 | |
Mary Lynn Rajskub | F | 446000 | 1 | 1 | 2 | 4 | 0.375 | https://duckduckgo.com/i/adfa0adb.jpg | 200 | 159 | |
Judah Friedlander | M | 331000 | 1 | 2 | 0 | 3 | 0.666666666666667 | https://duckduckgo.com/i/7fe7a802.jpg | 200 | 150 | |
Michael Ian Black | M | 428000 | 2 | 1 | 1 | 4 | 0.625 | https://duckduckgo.com/i/23b50e00.jpg | 200 | 130 | |
Jimmy Pardo | M | 170000 | 1 | 2 | 2 | 5 | 0.4 | https://duckduckgo.com/i/3ba9ae5a.jpg | 200 | 138 | |
Hannah Hart | F | 434000 | 1 | 1 | 1 | 3 | 0.5 | https://duckduckgo.com/i/82ee4423.jpg | 200 | 152 | |
Brian Posehn | M | 386000 | 1 | 1 | 2 | 4 | 0.375 | https://duckduckgo.com/i/516228af.jpg | 200 | 143 | |
Nick Thune | M | 159000 | 1 | 3 | 1 | 5 | 0.5 | https://duckduckgo.com/i/fe26caa9.jpg | 200 | 250 | |
Julie Klausner | F | 203000 | 1 | 1 | 1 | 3 | 0.5 | https://duckduckgo.com/i/03ace5fa.jpg | 200 | 150 | |
Scott Aukerman | M | 258000 | 0 | 5 | 1 | 6 | 0.416666666666667 | https://duckduckgo.com/i/b0e7c717.jpg | 200 | 133 | |
Greg Proops | M | 310000 | 0 | 4 | 2 | 6 | 0.333333333333333 | https://duckduckgo.com/i/d036c84d.jpg | 200 | 133 | |
Nick Swardson | M | 439000 | 0 | 1 | 2 | 3 | 0.166666666666667 | https://duckduckgo.com/i/aa2964e0.jpg | 200 | 133 | |
Rich Fulcher | M | 90600 | 0 | 3 | 1 | 4 | 0.375 | https://duckduckgo.com/i/5a6deead.jpg | 200 | 226 | |
Todd Barry | M | 320000 | 0 | 1 | 2 | 3 | 0.166666666666667 | https://duckduckgo.com/i/816308ca.jpg | 200 | 188 | |
Kerri Kenney-Silver | F | 41800 | 0 | 3 | 1 | 4 | 0.375 | https://duckduckgo.com/i/cb9bcb43.jpg | 200 | 145 | |
Al Madrigal | M | 178000 | 0 | 1 | 3 | 4 | 0.125 | https://duckduckgo.com/i/b9220a7c.jpg | 200 | 147 | |
Brent Morin | M | 116000 | 0 | 0 | 3 | 3 | 0 | https://duckduckgo.com/i/dfe3d06a.jpg | 200 | 300 | |
Kate Micucci | F | 382000 | 0 | 2 | 1 | 3 | 0.333333333333333 | https://duckduckgo.com/i/fb4c0fc4.png | 200 | 179 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="utf-8"> | |
<title>Winner, Runner-ups, and Loser on @midnight</title> | |
<script type="text/javascript" src="http://d3js.org/d3.v3.js"></script> | |
<style type="text/css"> | |
body { | |
background-color: white; | |
} | |
svg { | |
background-color: white; | |
} | |
</style> | |
</head> | |
<body> | |
<script type="text/javascript"> | |
var svg = d3.select("body") | |
.append("svg") | |
.attr("width", 820) | |
.attr("height", 800); | |
d3.csv("@midnight_freq_players.csv", function(data) { | |
data.sort(function(a, b) { | |
return d3.descending(+a.total, +b.total); | |
}); | |
var bars = svg.selectAll("g") | |
.data(data) | |
.enter() | |
.append("g"); | |
bars.append("rect") | |
.attr("class", "rect1") | |
.attr("x", 0) | |
.attr("y", function(d, i){ | |
return i * 12; | |
}) | |
.attr("width", function(d){ | |
return +d.first * 40 | |
}) | |
.attr("height", 10) | |
.attr("fill", "#6699FF") | |
.append("title") | |
.text(function(d) { | |
return d.player + " - Number of Wins: " + d.first; | |
}); | |
bars.append("rect") | |
.attr("class", "rect2") | |
.attr("x", function(d){ | |
return +d.first * 40; | |
}) | |
.attr("y", function(d, i){ | |
return i * 12; | |
}) | |
.attr("width", function(d){ | |
return +d.second * 40 | |
}) | |
.attr("height", 10) | |
.attr("fill", "#FF9900") | |
.append("title") | |
.text(function(d) { | |
return d.player + " - Number of Runner-up Finishes: " + d.second; | |
}); | |
bars.append("rect") | |
.attr("class", "rect3") | |
.attr("x", function(d){ | |
return (+d.first + +d.second) * 40; | |
}) | |
.attr("y", function(d, i){ | |
return i * 12; | |
}) | |
.attr("width", function(d){ | |
return +d.third * 40 | |
}) | |
.attr("height", 10) | |
.attr("fill", "#CC0000") | |
.append("title") | |
.text(function(d) { | |
return d.player + " - Number of Last Place Finishes: " + d.third; | |
}); | |
console.log(data); | |
}); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment