Working on a few visualizations using the Elections Data shared by Google Trends
data source here
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 |
<!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"> | |
</div> | |
<script src='https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js'></script> | |
<script> | |
var margin = {top: 20, right: 20, bottom: 130, left: 50}, | |
width = window.innerWidth*0.9 - margin.left - margin.right, | |
height = 900 - margin.top - margin.bottom; | |
var widthScale = d3.time.scale() | |
.range([ 0, width ]); | |
var heightScale = d3.scale.linear() | |
.range([ 0, height ]); | |
var root; | |
//var dateFormat = d3.time.format("%m/%d/%Y"); | |
var dateFormat = d3.time.format("%x"); | |
var xAxis = d3.svg.axis() | |
.scale(widthScale) | |
.orient("bottom") | |
.ticks(11) | |
.tickFormat(function(d) { | |
return dateFormat(d); | |
}); | |
var yAxis = d3.svg.axis() | |
.scale(heightScale) | |
.orient("left"); | |
//Configure line generator | |
var line = d3.svg.line() | |
.x(function(d) { | |
console.log(d); | |
return widthScale(dateFormat.parse(d.week)); | |
}) | |
.y(function(d) { | |
console.log(d); | |
return heightScale(+d.rank); | |
}); | |
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 = []; | |
var weekCount = 0; | |
var candidates = ["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"]; | |
var weeks = []; | |
var dataset = []; | |
var counter = 0; | |
for(var i = 0;i<candidates.length;i++){ | |
dataset.push({ | |
candidate: candidates[i], | |
ranks: [] | |
}); | |
} | |
console.log(dataset); | |
d3.csv("data.csv",function(root){ | |
root = root; | |
root.forEach(function(data){ | |
for(var k in data){ | |
counter ++; | |
if (data.hasOwnProperty(k)) { | |
if(k=="Week"){ | |
var da = data[k]; | |
var dater = (da.substring(0,da.indexOf("/"))<10)?"0"+da.substring(0,da.indexOf("/")):da.substring(0,da.indexOf("/")); | |
dater= dater+"/"+da.substring(da.indexOf("/")+1,da.length); | |
weeks.push(dater); | |
}else{ | |
console.log(k); | |
for(var i = 0; i<dataset.length; i++){ | |
if(dataset[i].candidate == k){ | |
dataset[i].ranks.push({ | |
week: dater, | |
rank: data[k] | |
}); | |
} | |
} | |
} | |
} | |
} | |
}) | |
update(dataset); | |
}); | |
function update(_data){ | |
widthScale.domain([ | |
d3.min(weeks, function(d) { | |
return dateFormat.parse(d); | |
}), | |
d3.max(weeks, function(d) { | |
return dateFormat.parse(d); | |
}) | |
]); | |
heightScale.domain([ | |
d3.max(dataset, function(d) { | |
return d3.max(d.ranks, function(d) { | |
return +d.rank; | |
}); | |
}), | |
0 | |
]); | |
//Make a group for each country | |
var groups = svg.selectAll("g") | |
.data(_data) | |
.enter() | |
.append("g"); | |
//Append a title with the candidate name (so we get easy tooltips) | |
groups.append("title") | |
.text(function(d) { | |
return d.candidate; | |
}); | |
//Within each group, create a new line/path, | |
//binding just the rank data to each one | |
groups.selectAll("path") | |
.data(function(d) { | |
return [ d.ranks ]; | |
}) | |
.enter() | |
.append("path") | |
.attr("class", "line") | |
.attr("d", line) | |
.attr("fill", "none") | |
.attr("stroke", randomColor) | |
.attr("stroke-width", 2); | |
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); | |
} | |
var randomColor = (function(){ | |
var golden_ratio_conjugate = 0.618033988749895; | |
var h = Math.random(); | |
var hslToRgb = function (h, s, l){ | |
var r, g, b; | |
if(s == 0){ | |
r = g = b = l; // achromatic | |
}else{ | |
function hue2rgb(p, q, t){ | |
if(t < 0) t += 1; | |
if(t > 1) t -= 1; | |
if(t < 1/6) return p + (q - p) * 6 * t; | |
if(t < 1/2) return q; | |
if(t < 2/3) return p + (q - p) * (2/3 - t) * 6; | |
return p; | |
} | |
var q = l < 0.5 ? l * (1 + s) : l + s - l * s; | |
var p = 2 * l - q; | |
r = hue2rgb(p, q, h + 1/3); | |
g = hue2rgb(p, q, h); | |
b = hue2rgb(p, q, h - 1/3); | |
} | |
return '#'+Math.round(r * 255).toString(16)+Math.round(g * 255).toString(16)+Math.round(b * 255).toString(16); | |
}; | |
return function(){ | |
h += golden_ratio_conjugate; | |
h %= 1; | |
return hslToRgb(h, 0.5, 0.60); | |
}; | |
})(); | |
</script> | |
</body> | |
</html> | |