Working on a few visualizations using the Elections Data shared by Google Trends
data source here
<!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>
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