A stacked, middle-aligned bar chart of last years GGT points. Note: Points are adjusted down by 10k, to compensate for Sir Big Kahuna Baby's March Issue Competition and Bad's subsequent adjustment.
Last active
August 29, 2015 14:09
-
-
Save BenSimonds/499f43fdb22a8c4f9d81 to your computer and use it in GitHub Desktop.
GGT League Table
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> | |
| <meta charset="utf-8"> | |
| <style> | |
| h1 { | |
| font: 20pt sans-serif; | |
| } | |
| h2 { | |
| font: 14pt sans-serif; | |
| } | |
| p { | |
| font: 10pt sans-serif; | |
| } | |
| .bar { | |
| fill: darkgrey; | |
| stroke: #222; | |
| shape-rendering: crispEdges; | |
| } | |
| .axis text { | |
| font: 10px sans-serif; | |
| } | |
| .axis path, | |
| .axis line { | |
| fill: none; | |
| stroke: #000; | |
| shape-rendering: crispEdges;*/ | |
| } | |
| .x.axis path { | |
| display: none; | |
| } | |
| .chart text { | |
| fill: black; | |
| font: 12px sans-serif; | |
| /*text-anchor: end;*/ | |
| } | |
| </style> | |
| <svg class="chart"></svg> | |
| <script src="http://d3js.org/d3.v3.min.js"></script> | |
| <script> | |
| var margin = {top: 20, right: 60, bottom: 30, left: 60}, | |
| width = 960 - margin.left - margin.right, | |
| height = 500- margin.top - margin.bottom; | |
| var y = d3.scale.ordinal() | |
| .rangeRoundBands([0, height], 0.1); | |
| var x = d3.scale.linear() | |
| .range([0, width]); | |
| var xAxis = d3.svg.axis() | |
| .scale(x) | |
| .orient("bottom"); | |
| var yAxis = d3.svg.axis() | |
| .scale(y) | |
| .orient("left") | |
| // .ticks(12, "%"); | |
| var chart = d3.select(".chart") | |
| .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("LeagueTableSimple.tsv", type, function(error, data) { | |
| y.domain(data.map(function(d) { return d.name; })); | |
| x.domain([10000, d3.max(data, function(d) { return d.value; })]); | |
| chart.append("g") | |
| .attr("class", "x axis") | |
| .attr("transform", "translate(0," + height + ")") | |
| // .call(xAxis); | |
| chart.append("g") | |
| .attr("class", "y axis") | |
| // .call(yAxis) | |
| // .append("text") | |
| // .attr("transform", "rotate(-90)") | |
| // .attr("y", 6) | |
| // .attr("dy", ".71em") | |
| // .style("text-anchor", "end") | |
| // .text("Frequency"); | |
| var bar = chart.selectAll(".bar") | |
| bar.data(data) | |
| .enter().append("rect") | |
| .attr("class", "bar") | |
| .attr("y", function(d) { return y(d.name); }) | |
| .attr("x", function(d) { return width/2 - x(d.value)/2;}) | |
| .attr("width", function(d) { return x(d.value); }) | |
| .attr("height", y.rangeBand()) | |
| var text = chart.selectAll(".text") | |
| text.data(data) | |
| .enter().append("text") | |
| .text(function(d) {return d.name;}) | |
| .attr("y", function(d) { return y(d.name) + y.rangeBand()/2 + 5; }) | |
| .attr("x", function(d) { return width/2 - x(d.value)/2}) | |
| .attr("dx", "-0.5em") | |
| .style("text-anchor", "end"); | |
| var text = chart.selectAll(".text") | |
| text.data(data) | |
| .enter().append("text") | |
| .text(function(d) {return d.value - 10000 ;}) | |
| .attr("y", function(d) { return y(d.name) + y.rangeBand()/2 + 5; }) | |
| .attr("x", function(d) { return width/2 + x(d.value)/2}) | |
| .attr("dx", "0.5em") | |
| .style("text-anchor", "start"); | |
| }); | |
| function type(d) { | |
| d.value = +d.value; | |
| return d; | |
| } | |
| </script> |
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
| name | value | |
|---|---|---|
| Bushido | 10299 | |
| Beagle | 10275 | |
| Buppy-Sugar | 10266 | |
| Bright-Young-Thing | 10103 | |
| Mrs Cardboard Box | 10048 | |
| Big-Kahuna | 10047 | |
| Bunji | 10042 | |
| Beatle | 10020 | |
| Banks.j | 10018 | |
| Bu Bo Ba | 10005 | |
| Buzzy | 10003 | |
| Britney | 10003 | |
| Boring | 10003 | |
| Balti | 10002 | |
| Boogie | 10002 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment