Created
August 7, 2014 21:43
-
-
Save katychuang/a96faeed81702c363283 to your computer and use it in GitHub Desktop.
Most mentioned brands in Jay-Z's songs. http://bl.ocks.org/katychuang/a96faeed81702c363283
This file contains 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 PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> | |
| <!-- Generated with d3-generator.com --> | |
| <html> | |
| <head> | |
| <title>Bar Chart</title> | |
| <meta http-equiv="X-UA-Compatible" content="IE=9"> | |
| </head> | |
| <body> | |
| <div id="chart"></div> | |
| <script src="http://d3js.org/d3.v2.min.js"></script> | |
| <script> | |
| function renderChart() { | |
| var data = d3.csv.parse(d3.select('#csv').text()); | |
| var valueLabelWidth = 40; // space reserved for value labels (right) | |
| var barHeight = 20; // height of one bar | |
| var barLabelWidth = 100; // space reserved for bar labels | |
| var barLabelPadding = 5; // padding between bar and bar labels (left) | |
| var gridLabelHeight = 18; // space reserved for gridline labels | |
| var gridChartOffset = 3; // space between start of grid and first bar | |
| var maxBarWidth = 420; // width of the bar with the max value | |
| // data aggregation | |
| var aggregatedData = d3.nest() | |
| .key(function(d) { return d['brand']; }) | |
| .rollup(function(d) { | |
| return { | |
| 'value': d3.sum(d, function(e) { return parseFloat(e['mentions']); }) | |
| }; | |
| }) | |
| .entries(data); | |
| // accessor functions | |
| var barLabel = function(d) { return d.key; }; | |
| var barValue = function(d) { return d.values.value; }; | |
| // sorting | |
| var sortedData = aggregatedData.sort(function(a, b) { | |
| return d3.descending(barValue(a), barValue(b)); | |
| }); | |
| // scales | |
| var yScale = d3.scale.ordinal().domain(d3.range(0, sortedData.length)).rangeBands([0, sortedData.length * barHeight]); | |
| var y = function(d, i) { return yScale(i); }; | |
| var yText = function(d, i) { return y(d, i) + yScale.rangeBand() / 2; }; | |
| var x = d3.scale.linear().domain([0, d3.max(sortedData, barValue)]).range([0, maxBarWidth]); | |
| // svg container element | |
| var chart = d3.select('#chart').append("svg") | |
| .attr('width', maxBarWidth + barLabelWidth + valueLabelWidth) | |
| .attr('height', gridLabelHeight + gridChartOffset + sortedData.length * barHeight); | |
| // grid line labels | |
| var gridContainer = chart.append('g') | |
| .attr('transform', 'translate(' + barLabelWidth + ',' + gridLabelHeight + ')'); | |
| gridContainer.selectAll("text").data(x.ticks(10)).enter().append("text") | |
| .attr("x", x) | |
| .attr("dy", -3) | |
| .attr("text-anchor", "middle") | |
| .text(String); | |
| // vertical grid lines | |
| gridContainer.selectAll("line").data(x.ticks(10)).enter().append("line") | |
| .attr("x1", x) | |
| .attr("x2", x) | |
| .attr("y1", 0) | |
| .attr("y2", yScale.rangeExtent()[1] + gridChartOffset) | |
| .style("stroke", "#ccc"); | |
| // bar labels | |
| var labelsContainer = chart.append('g') | |
| .attr('transform', 'translate(' + (barLabelWidth - barLabelPadding) + ',' + (gridLabelHeight + gridChartOffset) + ')'); | |
| labelsContainer.selectAll('text').data(sortedData).enter().append('text') | |
| .attr('y', yText) | |
| .attr('stroke', 'none') | |
| .attr('fill', 'black') | |
| .attr("dy", ".35em") // vertical-align: middle | |
| .attr('text-anchor', 'end') | |
| .text(barLabel); | |
| // bars | |
| var barsContainer = chart.append('g') | |
| .attr('transform', 'translate(' + barLabelWidth + ',' + (gridLabelHeight + gridChartOffset) + ')'); | |
| barsContainer.selectAll("rect").data(sortedData).enter().append("rect") | |
| .attr('y', y) | |
| .attr('height', yScale.rangeBand()) | |
| .attr('width', function(d) { return x(barValue(d)); }) | |
| .attr('stroke', 'white') | |
| .attr('fill', 'steelblue'); | |
| // bar value labels | |
| barsContainer.selectAll("text").data(sortedData).enter().append("text") | |
| .attr("x", function(d) { return x(barValue(d)); }) | |
| .attr("y", yText) | |
| .attr("dx", 3) // padding-left | |
| .attr("dy", ".35em") // vertical-align: middle | |
| .attr("text-anchor", "start") // text-align: right | |
| .attr("fill", "black") | |
| .attr("stroke", "none") | |
| .text(function(d) { return d3.round(barValue(d), 2); }); | |
| // start line | |
| barsContainer.append("line") | |
| .attr("y1", -gridChartOffset) | |
| .attr("y2", yScale.rangeExtent()[1] + gridChartOffset) | |
| .style("stroke", "#000"); | |
| } | |
| </script> | |
| <script id="csv" type="text/csv">year,title,brand,mentions | |
| 1996,aint no nigga lyrics,lexus,1 | |
| 1996,aint no nigga lyrics,versace,1 | |
| 1996,aint no nigga lyrics,lexus,1 | |
| 1996,aint no nigga lyrics,versace,1 | |
| 1996,brooklyns finest lyrics,cristal,1 | |
| 1996,brooklyns finest lyrics,rolex,1 | |
| 1996,brooklyns finest lyrics,cristal,1 | |
| 1996,brooklyns finest lyrics,rolex,1 | |
| 1996,can i live lyrics,lexus,1 | |
| 1996,can i live lyrics,lexus,1 | |
| 1996,coming of age lyrics,versace,1 | |
| 1996,coming of age lyrics,versace,1 | |
| 1996,dead presidents ii lyrics,lexus,1 | |
| 1996,dead presidents ii lyrics,lexus,1 | |
| 1996,feelin it lyrics,cristal,1 | |
| 1996,feelin it lyrics,cristal,1 | |
| 1997,always be my sunshine lyrics,versace,1 | |
| 1997,always be my sunshine lyrics,versace,1 | |
| 1997,friend or foe 98 lyrics,lexus,1 | |
| 1997,friend or foe 98 lyrics,lexus,1 | |
| 1997,imaginary player lyrics,cristal,1 | |
| 1997,imaginary player lyrics,rolex,1 | |
| 1997,imaginary player lyrics,versace,1 | |
| 1997,imaginary player lyrics,cristal,1 | |
| 1997,imaginary player lyrics,rolex,1 | |
| 1997,imaginary player lyrics,versace,1 | |
| 1997,where im from lyrics,glock,1 | |
| 1997,where im from lyrics,glock,1 | |
| 1997,who you wit ii lyrics,lexus,1 | |
| 1997,who you wit ii lyrics,lexus,1 | |
| 1998,can i get a lyrics,gucci,1 | |
| 1998,can i get a lyrics,gucci,1 | |
| 1998,hard knock life ghetto anthem lyrics,glock,1 | |
| 1998,hard knock life ghetto anthem lyrics,glock,1 | |
| 1998,if i should die lyrics,cristal,1 | |
| 1998,if i should die lyrics,cristal,1 | |
| 1998,intro hand it down lyrics,porsche,1 | |
| 1998,intro hand it down lyrics,porsche,1 | |
| 1998,nigga what nigga who originator 99 lyrics,glock,2 | |
| 1998,nigga what nigga who originator 99 lyrics,glock,2 | |
| 1998,paper chase lyrics,rolex,1 | |
| 1998,paper chase lyrics,rolex,1 | |
| 1998,reservoir dogs lyrics,glock,1 | |
| 1998,reservoir dogs lyrics,nike,1 | |
| 1998,reservoir dogs lyrics,glock,1 | |
| 1998,reservoir dogs lyrics,nike,1 | |
| 1998,ride or die lyrics,glock,1 | |
| 1998,ride or die lyrics,glock,1 | |
| 1999,big pimpin lyrics,glock,1 | |
| 1999,big pimpin lyrics,glock,1 | |
| 1999,come and get me lyrics,bentley,1 | |
| 1999,come and get me lyrics,glock,1 | |
| 1999,come and get me lyrics,bentley,1 | |
| 1999,come and get me lyrics,glock,1 | |
| 1999,its hot some like it hot lyrics,bentley,1 | |
| 1999,its hot some like it hot lyrics,bentley,1 | |
| 1999,jigga my nigga lyrics,bentley,1 | |
| 1999,jigga my nigga lyrics,bentley,1 | |
| 1999,pop 4 roc lyrics,bentley,1 | |
| 1999,pop 4 roc lyrics,gucci,1 | |
| 1999,pop 4 roc lyrics,bentley,1 | |
| 1999,pop 4 roc lyrics,gucci,1 | |
| 1999,snoopy track lyrics,gucci,1 | |
| 1999,snoopy track lyrics,gucci,1 | |
| 1999,so ghetto lyrics,bentley,1 | |
| 1999,so ghetto lyrics,bentley,1 | |
| 2000,get your mind right mami lyrics,gucci,1 | |
| 2000,get your mind right mami lyrics,gucci,1 | |
| 2000,guilty until proven innocent lyrics,glock,1 | |
| 2000,guilty until proven innocent lyrics,glock,1 | |
| 2000,i just wanna love u give it 2 me lyrics,gucci,1 | |
| 2000,i just wanna love u give it 2 me lyrics,gucci,1 | |
| 2000,streets is talking lyrics,glock,1 | |
| 2000,streets is talking lyrics,glock,1 | |
| 2001,all i need lyrics,nike,1 | |
| 2001,all i need lyrics,nike,1 | |
| 2001,girls girls girls pt2 lyrics,gucci,1 | |
| 2001,girls girls girls pt2 lyrics,gucci,1 | |
| 2001,jigga that nigga lyrics,gucci,1 | |
| 2001,jigga that nigga lyrics,gucci,1 | |
| 2001,the rulers back lyrics,bentley,1 | |
| 2001,the rulers back lyrics,bentley,1 | |
| 2002,2 many hoes lyrics,lexus,1 | |
| 2002,2 many hoes lyrics,lexus,1 | |
| 2002,excuse me miss lyrics,maybach,1 | |
| 2002,excuse me miss lyrics,maybach,1 | |
| 2002,get this money lyrics,bentley,1 | |
| 2002,get this money lyrics,bentley,1 | |
| 2002,i did it my way lyrics,maybach,1 | |
| 2002,i did it my way lyrics,maybach,1 | |
| 2002,meet the parents lyrics,gucci,1 | |
| 2002,meet the parents lyrics,gucci,1 | |
| 2002,nigga please lyrics,nike,1 | |
| 2002,nigga please lyrics,nike,1 | |
| 2002,poppin tags lyrics,glock,2 | |
| 2002,poppin tags lyrics,gucci,2 | |
| 2002,poppin tags lyrics,glock,2 | |
| 2002,poppin tags lyrics,gucci,2 | |
| 2002,pussy lyrics,gucci,1 | |
| 2002,pussy lyrics,gucci,1 | |
| 2002,some how some way lyrics,glock,1 | |
| 2002,some how some way lyrics,glock,1 | |
| 2002,some people hate lyrics,maybach,1 | |
| 2002,some people hate lyrics,maybach,1 | |
| 2002,take you home with me aka body lyrics,lexus,1 | |
| 2002,take you home with me aka body lyrics,nike,1 | |
| 2002,take you home with me aka body lyrics,versace,1 | |
| 2002,take you home with me aka body lyrics,lexus,1 | |
| 2002,take you home with me aka body lyrics,nike,1 | |
| 2002,take you home with me aka body lyrics,versace,1 | |
| 2002,the watcher 2 lyrics,porsche,1 | |
| 2002,the watcher 2 lyrics,porsche,1 | |
| 2003,change clothes lyrics,maybach,1 | |
| 2003,change clothes lyrics,maybach,1 | |
| 2003,dirt off your shoulder lyrics,porsche,1 | |
| 2003,dirt off your shoulder lyrics,porsche,1 | |
| 2003,lucifer lyrics,maybach,1 | |
| 2003,lucifer lyrics,maybach,1 | |
| 2003,public service announcement lyrics,lexus,1 | |
| 2003,public service announcement lyrics,lexus,1 | |
| 2003,what more can i say lyrics,maybach,1 | |
| 2003,what more can i say lyrics,maybach,1 | |
| 2004,feelin you in stereo lyrics,maybach,1 | |
| 2004,feelin you in stereo lyrics,maybach,1 | |
| 2004,mo money lyrics,bentley,2 | |
| 2004,mo money lyrics,maybach,1 | |
| 2004,mo money lyrics,bentley,2 | |
| 2004,mo money lyrics,maybach,1 | |
| 2004,shes coming home with me lyrics,maybach,1 | |
| 2004,shes coming home with me lyrics,maybach,1 | |
| 2004,we got em goin lyrics,maybach,1 | |
| 2004,we got em goin lyrics,maybach,1 | |
| 2006,anything 2006 lyrics,maybach,1 | |
| 2006,anything 2006 lyrics,maybach,1 | |
| 2006,do u wanna ride lyrics,maybach,1 | |
| 2006,do u wanna ride lyrics,maybach,1 | |
| 2006,kingdom come lyrics,cristal,1 | |
| 2006,kingdom come lyrics,cristal,1 | |
| 2006,oh my god lyrics,gucci,2 | |
| 2006,oh my god lyrics,gucci,2 | |
| 2006,the prelude lyrics,glock,1 | |
| 2006,the prelude lyrics,glock,1 | |
| 2007,blue magic lyrics,gucci,2 | |
| 2007,blue magic lyrics,gucci,2 | |
| 2007,hello brooklyn 20 lyrics,lexus,1 | |
| 2007,hello brooklyn 20 lyrics,lexus,1 | |
| 2007,roc boys and the winner is lyrics,nike,1 | |
| 2007,roc boys and the winner is lyrics,porsche,1 | |
| 2007,roc boys and the winner is lyrics,nike,1 | |
| 2007,roc boys and the winner is lyrics,porsche,1 | |
| 2007,say hello lyrics,glock,1 | |
| 2007,say hello lyrics,glock,1 | |
| 2009,doa death of auto tune lyrics,versace,1 | |
| 2009,doa death of auto tune lyrics,versace,1 | |
| 2009,empire state of mind lyrics,lexus,1 | |
| 2009,empire state of mind lyrics,lexus,1 | |
| 2009,on to the next one lyrics,cristal,1 | |
| 2009,on to the next one lyrics,lexus,1 | |
| 2009,on to the next one lyrics,cristal,1 | |
| 2009,on to the next one lyrics,lexus,1 | |
| 2009,reminder lyrics,gucci,1 | |
| 2009,reminder lyrics,gucci,1 | |
| 2009,young forever lyrics,bentley,1 | |
| 2009,young forever lyrics,bentley,1 | |
| 2011,west murder to excellence lyrics,gucci,1 | |
| 2011,west murder to excellence lyrics,gucci,1 | |
| 2011,west niggas in paris lyrics,gucci,1 | |
| 2011,west niggas in paris lyrics,gucci,1 | |
| 2011,west otis lyrics,maybach,1 | |
| 2011,west otis lyrics,maybach,1 | |
| 2013,bbc lyrics,versace,2 | |
| 2013,bbc lyrics,gucci,1 | |
| 2013,bbc lyrics,maybach,1 | |
| 2013,bbc lyrics,versace,2 | |
| 2013,bbc lyrics,gucci,1 | |
| 2013,bbc lyrics,maybach,1 | |
| 2013,futw lyrics,maybach,1 | |
| 2013,futw lyrics,maybach,1 | |
| 2013,heaven lyrics,maybach,1 | |
| 2013,heaven lyrics,maybach,1 | |
| 2013,oceans lyrics,maybach,1 | |
| 2013,oceans lyrics,maybach,1 | |
| 2013,somewhereinamerica lyrics,lexus,1 | |
| 2013,somewhereinamerica lyrics,lexus,1</script> | |
| <script>renderChart();</script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment