Skip to content

Instantly share code, notes, and snippets.

@natemiller

natemiller/index.html

Last active May 12, 2016 01:49
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save natemiller/df9c456b5767bd32b02f60b2ef102513 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save natemiller/df9c456b5767bd32b02f60b2ef102513 to your computer and use it in GitHub Desktop.
Download ZIP
Climate Change Topic Modeling - Topic 4
Raw
index.html
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset="utf-8">
<title> Climate Streamplot - Topic 4</title>
<script src="http://d3js.org/d3.v3.js"></script>
<style type = 'text/css'>
body {
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
background-color: white;
padding: 50px;
}
h1 {
font-size: 28px;
position: relative;
left: 100;
color: #525252;
}
h2 {
font-size: 20px;
position: relative;
left: 100;
color: darkgrey;
}
.chart {
background: #fff;
}
p {
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
font-size: 18px;
margin: 10px 0 0 50px;
}
.tooltip {
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
}
.axis path, .axis line {
fill: none;
stroke: #000;
stroke-width: 2px;
shape-rendering: crispEdges;
}
button {
position: absolute;
right: 50px;
top: 10px;
}
</style>
</head>
<body>
<h2 style="margin-left:3em;"> Climate Change Topic Streamplot</h2>
<h1 style="margin-left:2em;">Topic 4 - Law / Communication </h1>
<p > Using articles from the NY Times and Dynamic Topic Modelling to assess how the discussion of 'climate change' and 'global warming' have changed over time. </p>
<div class="chart"></div>
<script type = 'text/javascript'>
chart("topic4_stream_R.csv", "blues");
var datearray = [];
var colorrange = [];
function chart(csvpath, color) {
if (color == 'blues') {
colorrange = ["#08306b","#08519c","#2171b5","#4292c6","#6baed6","#9ecae1","#c6dbef","#deebf7"]
}
else if (color == "yelblu") {
colorrange = ['#084081','#0868ac','#2b8cbe','#4eb3d3','#7bccc4','#a8ddb5','#ccebc5'];
}
else if (color == "orange") {
colorrange = ["#7f0000","#B30000", "#E34A33", "#FC8D59", "#FDBB84", "#FDD49E", "#FEF0D9"];
}
else if (color == 'red') {
colorrange = ['#67000d','#a50f15','#fcbba1','#fb6a4a','#ef3b2c','#cb181d','#fc9272']
}
else if (color == 'USA') {
colorrange = ['#2166ac','#4393c3','#92c5de','#d1e5f0','#f7f7f7','#fddbc7','#f4a582','#d6604d','#b2182b']
}
strokecolor = colorrange[0];
var format = d3.time.format("%Y");
var margin = {top: 20, right: 100, bottom: 30, left: 80};
var width = document.body.clientWidth - margin.left - margin.right;
var height = 400 - margin.top - margin.bottom;
var tooltip = d3.select("body")
.append("div")
.attr("class", "remove")
.style("position", "absolute")
.style("z-index", "20")
.style("visibility", "hidden")
.style("top", "625px")
.style("left", "180px");
var x = d3.time.scale()
.range([0, width]);
var y = d3.scale.linear()
.range([height-10, 2]);
var z = d3.scale.ordinal()
.range(colorrange);
var xAxis = d3.svg.axis()
.scale(x)
.orient("bottom")
.ticks(d3.time.twoyears);
var yAxis = d3.svg.axis()
.scale(y);
var yAxisr = d3.svg.axis()
.scale(y);
var stack = d3.layout.stack()
.offset("silhouette")
.values(function(d) { return d.values; })
.x(function(d) { return d.date; })
.y(function(d) { return d.value; });
var nest = d3.nest()
.key(function(d) { return d.key; });
var area = d3.svg.area()
.interpolate("cardinal")
.x(function(d) { return x(d.date); })
.y0(function(d) { return y(d.y0); })
.y1(function(d) { return y(d.y0 + d.y); });
var svg = d3.select(".chart").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 graph = d3.csv(csvpath, function(data) {
data.forEach(function(d) {
d.date = format.parse(d.date);
d.value = +d.value;
});
var layers = stack(nest.entries(data));
x.domain(d3.extent(data, function(d) { return d.date; }));
y.domain([0, d3.max(data, function(d) { return d.y0 + d.y; })]);
svg.selectAll(".layer")
.data(layers)
.enter().append("path")
.attr("class", "layer")
.attr("d", function(d) { return area(d.values); })
.style("fill", function(d, i) { return z(i); });
svg.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0," + height + ")")
.call(xAxis);
svg.append("g")
.attr("class", "y axis")
.attr("transform", "translate(" + width + ", 0)")
.call(yAxis.orient("right"));
svg.append("g")
.attr("class", "y axis")
.call(yAxis.orient("left"))
.append("text")
.attr("transform", "rotate(-90)")
.attr("y",-margin.top*3.3) //bigger mulitplier moves to the left
.attr("x",-height/2) //smaller divider moves up
.attr("dy", ".71em")
.style("text-anchor", "middle")
.text("Probaility of Word | Topic")
.attr("font-family","serif")
.attr("font-size","16px");;
svg.selectAll(".layer")
.attr("opacity", 1)
.on("mouseover", function(d, i) {
svg.selectAll(".layer").transition()
.duration(250)
.attr("opacity", function(d, j) {
return j != i ? 0.6 : 1;
})})
.on("mousemove", function(d, i) {
mousex = d3.mouse(this);
mousex = mousex[0];
var invertedx = x.invert(mousex);
invertedx = invertedx.getYear() ;
var selected = (d.values);
for (var k = 0; k < selected.length; k++) {
datearray[k] = selected[k].date
datearray[k] = datearray[k].getYear() ;
}
var tooltips = d3.select('svg').append('g');
mousedate = datearray.indexOf(invertedx);
pro = d.values[mousedate].value;
d3.select(this)
.classed("hover", true)
.attr("stroke", strokecolor)
.attr("stroke-width", "1.5px"),
tooltip.html( "<p>" + d.key + "<br>" + pro + "</p>" ).style("visibility", "visible");
})
.on("mouseout", function(d, i) {
svg.selectAll(".layer")
.transition()
.duration(250)
.attr("opacity", "1");
d3.select(this)
.classed("hover", false)
.attr("stroke-width", "0px"),
tooltip.html( "<p>" + d.key + "<br>" + pro + "</p>" ).style("visibility", "hidden");
})
.on("click", function(d, i) {
svg.selectAll(".layer").transition()
.duration(250)
.attr("opacity", function(d, j) {
return j != i ? 0.6 : 1;
});
})
// .on("click", function(d, i) {
// d3.select(this)
// .transition()
// .duration(250)
// .style('fill', function(d, i) {
// if(this.style.fill = 'red') {
// return z(this);
// } else {
// return 'red';
// } });
// });
var vertical = d3.select(".chart")
.append("div")
.attr("class", "remove")
.style("position", "absolute")
.style("z-index", "19")
.style("width", "1px")
.style("height", "350px")
.style("top", "230px")
.style("bottom", "30px")
.style("left", "0px")
.style("background", "#fff");
d3.select(".chart")
.on("mousemove", function(){
mousex = d3.mouse(this);
mousex = mousex[0] + 5;
vertical.style("left", (mousex+50) + "px" )})
.on("mouseover", function(){
mousex = d3.mouse(this);
mousex = mousex[0] + 5;
vertical.style("left", (mousex+50) + "px")});
});
}
</script>
<br>
<br>
<p align = "right", style="font-size:93%;"><a style="color:#969696;", href=http://bl.ocks.org/WillTurman/4631136/>Inspired by http://bl.ocks.org/WillTurman/4631136</a></p>
<p align = "right", style="font-size:93%;"><a style="color:#969696;", href=http://bl.ocks.org/natemiller/raw/30b5380f7c2a79695676b8bb37cc2827>Topic #5</a></p>
</body>
</html>
Raw
topic4_stream_R.csv
key date value
1 article 1988 0.004410341
2 article 1989 0.004408363
3 article 1990 0.004341606
4 article 1991 0.004296869
5 article 1992 0.004295324
6 article 1993 0.004328412
7 article 1994 0.004357226
8 article 1995 0.004372085
9 article 1996 0.004376283
10 article 1997 0.004388605
11 article 1998 0.004369307
12 article 1999 0.004235608
13 article 2000 0.004097525
14 article 2001 0.003993173
15 article 2002 0.003951381
16 article 2003 0.003934225
17 article 2004 0.003958716
18 article 2005 0.004019942
19 article 2006 0.004208577
20 article 2007 0.004314525
21 article 2008 0.0039824
22 article 2009 0
23 article 2010 0
24 article 2011 0
25 article 2012 0
26 article 2013 0
27 article 2014 0
28 article 2015 0
29 article 2016 0
30 book 1988 0.006944298
31 book 1989 0.006979913
32 book 1990 0.007049286
33 book 1991 0.007162312
34 book 1992 0.007109317
35 book 1993 0.006958543
36 book 1994 0.006746204
37 book 1995 0.00652046
38 book 1996 0.006215953
39 book 1997 0.005852927
40 book 1998 0.005484193
41 book 1999 0.005114267
42 book 2000 0.004699623
43 book 2001 0.004329304
44 book 2002 0.003978104
45 book 2003 0.00352364
46 book 2004 0
47 book 2005 0
48 book 2006 0
49 book 2007 0
50 book 2008 0
51 book 2009 0
52 book 2010 0
53 book 2011 0
54 book 2012 0
55 book 2013 0
56 book 2014 0
57 book 2015 0
58 book 2016 0
59 case 1988 0.003237042
60 case 1989 0.003244663
61 case 1990 0.0032514
62 case 1991 0.003280769
63 case 1992 0.003333875
64 case 1993 0.003398003
65 case 1994 0.003465119
66 case 1995 0.003519871
67 case 1996 0.003580856
68 case 1997 0.003653638
69 case 1998 0.003725363
70 case 1999 0.003751321
71 case 2000 0.003781339
72 case 2001 0.00381216
73 case 2002 0.003843226
74 case 2003 0.003881558
75 case 2004 0.003958984
76 case 2005 0.004072217
77 case 2006 0.004274754
78 case 2007 0.004546752
79 case 2008 0.005145442
80 case 2009 0.00628838
81 case 2010 0.006411969
82 case 2011 0.006404072
83 case 2012 0.006428402
84 case 2013 0.006556856
85 case 2014 0.006702058
86 case 2015 0.006900445
87 case 2016 0.007168869
88 court 1988 0
89 court 1989 0
90 court 1990 0
91 court 1991 0
92 court 1992 0
93 court 1993 0
94 court 1994 0
95 court 1995 0
96 court 1996 0
97 court 1997 0
98 court 1998 0
99 court 1999 0
100 court 2000 0
101 court 2001 0.003424496
102 court 2002 0.003573082
103 court 2003 0.003713176
104 court 2004 0.003883958
105 court 2005 0.004120506
106 court 2006 0.004511895
107 court 2007 0.00493258
108 court 2008 0.005875023
109 court 2009 0.008557037
110 court 2010 0.007812866
111 court 2011 0.007248758
112 court 2012 0.006998469
113 court 2013 0.007154689
114 court 2014 0.007271089
115 court 2015 0.007531832
116 court 2016 0.008033845
117 editor 1988 0.003704578
118 editor 1989 0.003707925
119 editor 1990 0.00372862
120 editor 1991 0.003780734
121 editor 1992 0.003834127
122 editor 1993 0.003884508
123 editor 1994 0.00393816
124 editor 1995 0.003983459
125 editor 1996 0.004029911
126 editor 1997 0.004086194
127 editor 1998 0.004120488
128 editor 1999 0.004117907
129 editor 2000 0.004121607
130 editor 2001 0.004137679
131 editor 2002 0.00420052
132 editor 2003 0.004306652
133 editor 2004 0.004468265
134 editor 2005 0.004713928
135 editor 2006 0.005193305
136 editor 2007 0.005561608
137 editor 2008 0.005130519
138 editor 2009 0.004203931
139 editor 2010 0.003910177
140 editor 2011 0
141 editor 2012 0.003620182
142 editor 2013 0
143 editor 2014 0
144 editor 2015 0
145 editor 2016 0
146 judge 1988 0
147 judge 1989 0
148 judge 1990 0
149 judge 1991 0
150 judge 1992 0
151 judge 1993 0
152 judge 1994 0
153 judge 1995 0
154 judge 1996 0
155 judge 1997 0
156 judge 1998 0
157 judge 1999 0
158 judge 2000 0
159 judge 2001 0
160 judge 2002 0
161 judge 2003 0
162 judge 2004 0.003403402
163 judge 2005 0.003567858
164 judge 2006 0.003844897
165 judge 2007 0.004267012
166 judge 2008 0.005655944
167 judge 2009 0.008801831
168 judge 2010 0.007304757
169 judge 2011 0.005979796
170 judge 2012 0.0051208
171 judge 2013 0.004570876
172 judge 2014 0.004168988
173 judge 2015 0.004007139
174 judge 2016 0.003989498
175 law 1988 0
176 law 1989 0
177 law 1990 0
178 law 1991 0
179 law 1992 0
180 law 1993 0
181 law 1994 0
182 law 1995 0
183 law 1996 0
184 law 1997 0
185 law 1998 0
186 law 1999 0
187 law 2000 0
188 law 2001 0
189 law 2002 0
190 law 2003 0
191 law 2004 0
192 law 2005 0
193 law 2006 0
194 law 2007 0.003467617
195 law 2008 0.004101424
196 law 2009 0.005399249
197 law 2010 0.005341449
198 law 2011 0.005191437
199 law 2012 0.005184134
200 law 2013 0.005281844
201 law 2014 0.00538672
202 law 2015 0.005549057
203 law 2016 0.005553552
204 news 1988 0.00386239
205 news 1989 0.003866865
206 news 1990 0.003845756
207 news 1991 0.003839454
208 news 1992 0.003856031
209 news 1993 0.003834499
210 news 1994 0.00380951
211 news 1995 0.003764031
212 news 1996 0.003693126
213 news 1997 0.003619985
214 news 1998 0.003549786
215 news 1999 0.003499205
216 news 2000 0.0034595
217 news 2001 0
218 news 2002 0
219 news 2003 0
220 news 2004 0
221 news 2005 0
222 news 2006 0.003363541
223 news 2007 0
224 news 2008 0
225 news 2009 0
226 news 2010 0
227 news 2011 0
228 news 2012 0.004119187
229 news 2013 0.004459929
230 news 2014 0.004757734
231 news 2015 0.005003324
232 news 2016 0.005087781
233 people 1988 0.003984829
234 people 1989 0.004000819
235 people 1990 0.00402139
236 people 1991 0.004015861
237 people 1992 0.003994755
238 people 1993 0.003976417
239 people 1994 0.003959939
240 people 1995 0.003946422
241 people 1996 0.00394129
242 people 1997 0.003945985
243 people 1998 0.003954397
244 people 1999 0.003966902
245 people 2000 0.003978603
246 people 2001 0.003987619
247 people 2002 0.003967233
248 people 2003 0.003942769
249 people 2004 0.003920578
250 people 2005 0.003894915
251 people 2006 0.003805457
252 people 2007 0.003713796
253 people 2008 0
254 people 2009 0
255 people 2010 0
256 people 2011 0.003975832
257 people 2012 0.004075753
258 people 2013 0.004040752
259 people 2014 0.004017696
260 people 2015 0.004011437
261 people 2016 0.003999279
262 public 1988 0
263 public 1989 0
264 public 1990 0
265 public 1991 0
266 public 1992 0
267 public 1993 0
268 public 1994 0
269 public 1995 0
270 public 1996 0
271 public 1997 0
272 public 1998 0
273 public 1999 0
274 public 2000 0
275 public 2001 0
276 public 2002 0
277 public 2003 0
278 public 2004 0
279 public 2005 0
280 public 2006 0
281 public 2007 0
282 public 2008 0
283 public 2009 0
284 public 2010 0
285 public 2011 0
286 public 2012 0
287 public 2013 0.003851887
288 public 2014 0.004202806
289 public 2015 0.004460643
290 public 2016 0.004537607
291 question 1988 0
292 question 1989 0
293 question 1990 0
294 question 1991 0
295 question 1992 0
296 question 1993 0
297 question 1994 0
298 question 1995 0
299 question 1996 0
300 question 1997 0
301 question 1998 0
302 question 1999 0
303 question 2000 0
304 question 2001 0
305 question 2002 0
306 question 2003 0
307 question 2004 0
308 question 2005 0
309 question 2006 0
310 question 2007 0
311 question 2008 0
312 question 2009 0.004298192
313 question 2010 0.004085589
314 question 2011 0.003824912
315 question 2012 0
316 question 2013 0
317 question 2014 0
318 question 2015 0
319 question 2016 0
320 science 1988 0.008000504
321 science 1989 0.008031952
322 science 1990 0.008100444
323 science 1991 0.008288117
324 science 1992 0.00856409
325 science 1993 0.00878788
326 science 1994 0.008982923
327 science 1995 0.009198072
328 science 1996 0.009418574
329 science 1997 0.009693132
330 science 1998 0.009980014
331 science 1999 0.010363349
332 science 2000 0.010786935
333 science 2001 0.011130485
334 science 2002 0.010717438
335 science 2003 0.010318922
336 science 2004 0.010032667
337 science 2005 0.009468139
338 science 2006 0.006995056
339 science 2007 0.005021622
340 science 2008 0.00389476
341 science 2009 0
342 science 2010 0
343 science 2011 0.004273728
344 science 2012 0.004693019
345 science 2013 0.005085244
346 science 2014 0.005088585
347 science 2015 0.004979719
348 science 2016 0.004927682
349 scientific 1988 0.004028692
350 scientific 1989 0.0040393
351 scientific 1990 0.004057557
352 scientific 1991 0.004095791
353 scientific 1992 0.004149737
354 scientific 1993 0.004216689
355 scientific 1994 0.004269475
356 scientific 1995 0.0043211
357 scientific 1996 0.004317657
358 scientific 1997 0.004285091
359 scientific 1998 0.004222833
360 scientific 1999 0.004166765
361 scientific 2000 0.004136403
362 scientific 2001 0.00410818
363 scientific 2002 0.00396911
364 scientific 2003 0.003855751
365 scientific 2004 0.003789322
366 scientific 2005 0.003647884
367 scientific 2006 0
368 scientific 2007 0
369 scientific 2008 0
370 scientific 2009 0
371 scientific 2010 0
372 scientific 2011 0
373 scientific 2012 0
374 scientific 2013 0
375 scientific 2014 0
376 scientific 2015 0
377 scientific 2016 0
378 sen 1988 0
379 sen 1989 0
380 sen 1990 0
381 sen 1991 0
382 sen 1992 0
383 sen 1993 0
384 sen 1994 0
385 sen 1995 0
386 sen 1996 0
387 sen 1997 0
388 sen 1998 0
389 sen 1999 0
390 sen 2000 0
391 sen 2001 0
392 sen 2002 0
393 sen 2003 0
394 sen 2004 0
395 sen 2005 0
396 sen 2006 0
397 sen 2007 0
398 sen 2008 0
399 sen 2009 0
400 sen 2010 0
401 sen 2011 0
402 sen 2012 0
403 sen 2013 0
404 sen 2014 0
405 sen 2015 0
406 sen 2016 0
407 sotomayor 1988 0
408 sotomayor 1989 0
409 sotomayor 1990 0
410 sotomayor 1991 0
411 sotomayor 1992 0
412 sotomayor 1993 0
413 sotomayor 1994 0
414 sotomayor 1995 0
415 sotomayor 1996 0
416 sotomayor 1997 0
417 sotomayor 1998 0
418 sotomayor 1999 0
419 sotomayor 2000 0
420 sotomayor 2001 0
421 sotomayor 2002 0
422 sotomayor 2003 0
423 sotomayor 2004 0
424 sotomayor 2005 0
425 sotomayor 2006 0
426 sotomayor 2007 0
427 sotomayor 2008 0
428 sotomayor 2009 0.005045718
429 sotomayor 2010 0.004070287
430 sotomayor 2011 0
431 sotomayor 2012 0
432 sotomayor 2013 0
433 sotomayor 2014 0
434 sotomayor 2015 0
435 sotomayor 2016 0
436 story 1988 0.004012996
437 story 1989 0.004030489
438 story 1990 0.004026561
439 story 1991 0.00388023
440 story 1992 0.003716243
441 story 1993 0.003575721
442 story 1994 0.00344705
443 story 1995 0
444 story 1996 0
445 story 1997 0
446 story 1998 0
447 story 1999 0
448 story 2000 0
449 story 2001 0
450 story 2002 0
451 story 2003 0
452 story 2004 0
453 story 2005 0
454 story 2006 0
455 story 2007 0
456 story 2008 0
457 story 2009 0
458 story 2010 0
459 story 2011 0
460 story 2012 0
461 story 2013 0
462 story 2014 0
463 story 2015 0
464 story 2016 0
465 time 1988 0
466 time 1989 0
467 time 1990 0
468 time 1991 0
469 time 1992 0
470 time 1993 0
471 time 1994 0
472 time 1995 0
473 time 1996 0
474 time 1997 0
475 time 1998 0
476 time 1999 0
477 time 2000 0
478 time 2001 0
479 time 2002 0
480 time 2003 0
481 time 2004 0
482 time 2005 0
483 time 2006 0
484 time 2007 0
485 time 2008 0
486 time 2009 0
487 time 2010 0
488 time 2011 0
489 time 2012 0
490 time 2013 0
491 time 2014 0
492 time 2015 0
493 time 2016 0
494 times 1988 0
495 times 1989 0
496 times 1990 0
497 times 1991 0
498 times 1992 0
499 times 1993 0
500 times 1994 0
501 times 1995 0
502 times 1996 0
503 times 1997 0
504 times 1998 0
505 times 1999 0
506 times 2000 0
507 times 2001 0
508 times 2002 0
509 times 2003 0
510 times 2004 0
511 times 2005 0
512 times 2006 0
513 times 2007 0
514 times 2008 0
515 times 2009 0
516 times 2010 0
517 times 2011 0
518 times 2012 0
519 times 2013 0
520 times 2014 0
521 times 2015 0
522 times 2016 0
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment