Skip to content

Instantly share code, notes, and snippets.

@inspired12

inspired12/README.md

Last active September 21, 2015 00:53
Show Gist options
  • Save inspired12/e57ec07b037322c4f49d to your computer and use it in GitHub Desktop.
Save inspired12/e57ec07b037322c4f49d to your computer and use it in GitHub Desktop.
Download ZIP
Political Popularity Scatterplot
Raw
README.md

Election-2016-Search-Engine-Popularity

Working on a few visualizations using the Elections Data shared by Google Trends

data source here

Raw
data.csv
Week Hillary Clinton Bernie Sanders Ben Carson Ted Cruz Carly Fiorina Mike Huckabee Rand Paul Marco Rubio Jeb Bush Scott Walker Chris Christie Lindsey Graham Rick Santorum Martin O'Malley George Pataki Rick Perry Lincoln Chafee Bobby Jindal John Kasich Jim Webb Donald Trump
12/28/2014 1.699089009 0.177758004 0.85261851 0.392416335 0.122591731 0.104202969 0.312674018 0.300404754 2.192188538 0.263572223 0.318738497 0.030652208 0.177758004 0.049036695 0.128721322 0.159369255 0 0.049036695 0.067425457 0.165498834 1.566544367
1/4/2015 4.286984929 0.524219562 1.952675595 0.895633369 0.398397208 2.841354413 0.9771624 0.627540634 3.058373446 0.88478759 10.55891883 0.316498755 0.589490275 0.06549109 0.180100914 0.655018065 0.027284375 0.212818128 0.256543746 0.327412505 5.990411787
1/11/2015 4.773637918 0.65286055 2.172130899 3.25188898 0.4708639 1.790673628 1.56965936 1.924256697 2.414265846 1.254224863 4.351757674 0.256834852 0.422804257 0.037455081 0.133771009 0.856674118 0.048156541 0.422776522 0.374733567 0.090962346 4.562137638
1/18/2015 5.43285858 0.585971729 2.316812461 2.687080636 0.260327017 3.225529583 1.793156957 2.109874433 2.228996556 1.308921306 1.16075687 0.629297694 0.536937329 0.103046115 0.0542348 1.009946883 0.0271174 2.60466507 0.390627503 0.227786132 5.755546121
1/25/2015 5.993947499 0.650900492 3.340371445 1.950259122 0.565405629 1.860751658 1.601864389 1.522475871 3.547726655 5.3587724 2.762685769 0.645679704 0.629603847 0.042680231 0.101346293 1.147857646 0.015581551 1.120723219 0.576348945 0.368247167 7.265552788
2/1/2015 6.172596076 0.540314628 2.636813624 1.216201913 0.633777831 2.029434836 5.412010764 0.83137474 3.251391753 6.669332339 3.435646953 0.524663977 0.368852025 0.036356945 0.457111054 0.612974715 0.015581551 1.746721891 0.353252205 0.171397002 4.237097571
2/8/2015 5.536279484 0.912232559 4.340607172 1.367398563 0.258809067 0.844670169 2.131984037 0.808549562 2.965133341 5.168387621 1.571427617 0.305394707 1.273992824 0.046585628 0.051761816 0.533303115 0.015528538 1.305663097 0.28987126 0.19670285 3.750439792
2/15/2015 6.30523675 0.601970186 2.703171389 0.935326775 0.494354133 0.908555012 1.835525568 0.881480017 3.918482553 4.864731028 1.365800742 0.274123661 0.456821377 0.021493662 0.161203514 0.531968039 0 0.483608136 0.365423606 0.220444982 5.603341976
2/22/2015 5.95076925 0.614436995 3.63718503 1.725336098 1.354533518 0.666263597 2.047545168 1.073376014 4.29361255 6.871633611 1.893827938 0.447863698 0.51546685 0.036436289 0.135334788 0.692289519 0 0.83306359 0.432090031 0.520679463 4.649834252
3/1/2015 16.01900513 0.766823274 8.925508988 1.346413086 0.583661182 0.823602954 2.74096279 1.042539564 2.812992842 4.432652745 1.812020841 0.58887244 0.375263896 0.198027908 0.119858999 0.609945209 0 0.375210758 0.218937551 0.208450424 4.000572858
3/8/2015 30.11879421 0.886880331 3.421351627 1.484731602 0.602127469 0.833234014 1.889200348 1.253104245 2.553814566 3.124342717 1.286763165 1.679367202 0.408324302 0.311615918 0.150435274 0.473063357 0 0.365342795 0.231037081 0.494491819 4.071599264
3/15/2015 13.00017364 0.577706916 2.245062934 3.148916917 0.51826956 0.718263131 1.876700137 0.977646148 2.239385456 2.65371187 1.167808394 0.442776345 0.664228784 0.129567396 0.091776898 0.367147088 0 0.529218606 0.188952442 0.507596875 4.121517629
3/22/2015 10.1823947 0.823848696 2.782623628 73.76936783 0.405847418 0.657071774 3.116075798 1.631820597 3.107644072 2.811539088 1.284753905 0.381974046 0.710609144 0.190987017 0.107430195 0.537150998 0 0.668811097 0.56102437 0.44178569 3.859679019
3/29/2015 10.28228647 0.852393932 1.707698756 9.129663691 2.785375305 0.841467067 1.594917123 1.89411423 1.875142602 2.137316969 1.236413161 0.336457978 0.527077303 0.297178657 0.095307242 0.426209944 0 0.375622648 0.308445755 0.269110699 3.184421782
4/5/2015 16.80732983 0.950418083 2.175978544 6.597893692 1.139731998 0.61698052 30.05631888 2.160429555 4.07472904 3.341862852 1.1402089 0.516678284 0.939346272 0.222227219 0.088890882 0.550175657 0.788948276 0.544683348 0.32778515 0.400150318 3.171366266
4/12/2015 97.77778143 1.852041239 3.511229768 9.335412578 2.116995646 1.112825671 13.36989398 31.26217989 5.715894806 2.877956361 3.443324236 0.523135708 0.561389906 0.594457383 0.143068319 0.633005158 0.775978485 0.720930675 0.484353488 0.687967681 3.786486133
4/19/2015 27.49329085 1.415770616 2.357419449 5.132890731 2.274347152 0.867402611 5.689532187 5.831559119 3.287708599 3.590540597 2.768799788 1.268261142 2.295380338 0.346631906 0.081232144 0.492895766 0.297851198 1.310909212 0.964280641 0.530785406 3.128065804
4/26/2015 18.84059608 22.74967779 2.262906408 4.274861262 0.8947482 0.74176772 3.759440265 2.462946296 2.751567942 1.853651648 2.180859788 0.398167527 0.665350016 0.654580371 0.196313629 0.47446994 0.338014422 0.51247348 0.523697972 0.561634871 4.510520178
5/3/2015 14.29196986 13.34667758 22.17177101 3.249880272 13.26219819 5.992766069 2.929196813 2.23935169 2.864376496 2.423425897 1.814370483 0.592156653 1.049354862 0.276353059 0.078954221 0.699715292 0.214341207 0.383621331 0.434322251 0.434443887 3.339409904
5/10/2015 12.62495984 6.510423887 5.65096153 3.432331067 2.304396383 1.399791067 2.920900917 3.472338764 6.772278811 1.865613669 2.317376632 0.256818715 0.59364737 0.154091229 0.308182458 0.639255244 0.182626648 0.325303702 0.26257244 0.296945177 3.38876178
5/17/2015 16.0440488 7.859410843 3.653801862 3.281958348 1.108773975 2.064131155 6.988294311 2.448384904 3.720463886 1.926204894 1.519933837 1.601950365 1.016628545 0.161610214 0.26550249 0.698640278 0.126979447 1.229949204 0.519740942 0.254029309 3.207093676
5/24/2015 14.30575281 13.54127978 3.4767493 3.229778072 2.080479499 2.314171398 5.869765483 2.223517086 2.41083907 1.939949114 1.502750741 0.831707487 6.371164745 0.862507738 3.428974092 0.717732538 0.222978113 0.928260795 0.651190834 0.337560252 3.339927419
5/31/2015 13.77848834 12.30859532 2.941103902 4.843100244 1.626804312 2.569186435 7.186714849 2.770739835 3.243712764 2.704605632 4.088189376 6.777537201 2.527999968 0.963754237 0.727279427 6.56924159 2.23078115 0.869316202 0.584979519 0.336827075 3.880627832
6/7/2015 15.16941711 9.749116204 3.022976212 2.736172337 1.9137305 0.943739417 3.188291018 4.353699866 4.33732583 2.544717559 3.719414939 3.833976239 1.74328156 0.228223777 0.444647769 2.016005258 0.613238563 0.492540286 0.498488784 0.38441522 3.507531018
6/14/2015 21.29750455 17.0666387 4.434164991 2.253973907 1.907011686 0.877466852 4.805274312 3.749509133 34.19376712 2.496298662 2.782527257 2.699109976 1.365531101 0.923199999 0.39440275 2.687158375 0.351596519 0.83161173 0.730267055 0.346230485 100
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
.ui{
font-family: sans-serif;
margin-left:3em;
}
rect{
fill:#B22234;
}
.axis path,
.axis line {
fill: none;
stroke: black;
shape-rendering: crispEdges;
}
.axis text {
font-family: sans-serif;
font-size: 11px;
}
</style>
</head>
<body>
<div class="ui">
<h1>The most searched candidates and relative popularity</h1>
<p>This visualization shows the most popular presidential candidates every week from the end of last year to June 14th 2015.</p>
<p>The most searched candidate is highlighted, and the relative search engine popularity is mapped to the size of the circles</p>
</div>
<script src='https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js'></script>
<script>
var margin = {top: 20, right: 80, bottom: 130, left: 120},
width = window.innerWidth*0.9 - margin.left - margin.right,
height = 600 - margin.top - margin.bottom;
var widthScale = d3.scale.ordinal()
// .range([ 0, width ]);
.rangeRoundBands([ 0, width ], 0.1);
var heightScale = d3.scale.ordinal()
.rangeRoundBands([ 0, height ], 0.1);
var xAxis = d3.svg.axis()
.scale(widthScale)
.orient("bottom");
var yAxis = d3.svg.axis()
.scale(heightScale)
.orient("left");
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 d = [];
d3.csv("data.csv",function(root){
root.forEach(function(data){
console.log("one");
for(var k in data){
if (data.hasOwnProperty(k)) {
if(k=="Week"){
var week = {"week":data[k],"ranks":[]};
}else{
week["ranks"].push({"name":k,"rank":+data[k]});
}
}
}
week["ranks"].sort(function(a, b) {
return d3.descending(a.rank, b.rank);
});
d.push(week);
})
update(d);
});
function update(_data){
console.log(_data);
widthScale.domain(_data.map(function(d) { return d.week; } ));
heightScale.domain(_data.map(function(d) { return d.ranks[0].name; } ));
svg.select(".x.axis").remove();
svg.select(".y.axis").remove();
var circles = svg.selectAll("circle")
.data(_data)
.enter()
.append("circle");
circles.attr("cx", function(d) {
return widthScale(d.week);
})
.attr("cy", function(d) {
return heightScale(d.ranks[0].name)+20;
})
.attr("r", 0)
.attr("fill", "rgba(178, 34, 52,0.5)")
.append("title")
.text(function(d) {
return d.ranks[0].name +": "+ d.ranks[0].rank;
});
circles.transition().duration(3000).delay(function(d,i){ return i*500 }).attr("r", function(d){ return d.ranks[0].rank })
svg.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0 ," + (height) + ")")
.call(xAxis);
svg.append("g")
.attr("class", "y axis")
.attr("transform", "translate(0,0)")
.call(yAxis);
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment