Skip to content

Instantly share code, notes, and snippets.

@natemiller

natemiller/index.html

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

  • Select an option

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

Select an option

Learn more about clone URLs
Save natemiller/30b5380f7c2a79695676b8bb37cc2827 to your computer and use it in GitHub Desktop.
Download ZIP
Climate Change Topic Modeling - Topic 5
Raw
index.html
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset="utf-8">
<title> Climate Streamplot - Topic 5</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 5 - Global Atmosphere / Emissions </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("topic5_stream_R.csv", "green");
var datearray = [];
var colorrange = [];
function chart(csvpath, color) {
if (color == "blue") {
colorrange = ["#045A8D", "#2B8CBE", "#74A9CF", "#A6BDDB", "#D0D1E6", "#F1EEF6"];
}
else if (color == "pink") {
colorrange = ["#980043", "#DD1C77", "#DF65B0", "#C994C7", "#D4B9DA", "#F1EEF6"];
}
else if (color == "orange") {
colorrange = ["#7f0000","#B30000", "#E34A33", "#FC8D59", "#FDBB84", "#FDD49E", "#FEF0D9"];
}
else if (color == 'YlOrRd') {
colorrange = ["#800026","#bd0026","#e31a1c","#fc4e2a","#fd8d3c","#feb24c","#fed976","#ffeda0"]
}
else if (color == 'green') {
colorrange = ["#00441b","#006d2c","#238b45","#41ab5d","#74c476","#a1d99b","#c7e9c0","#e5f5e0","#f7fcf5"]
}
strokecolor = colorrange[0];
var format = d3.time.format("%Y");
var margin = {top: 20, right: 100, bottom: 30, left: 100};
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/a8b5c9c849f371e0fc26d41150fc6403/>Topic #6</a></p>
</body>
</body>
</html>
Raw
topic5_stream_R.csv
key date value
1 carbon 1988 0.013000499
2 carbon 1989 0.013501064
3 carbon 1990 0.014301961
4 carbon 1991 0.014936574
5 carbon 1992 0.015380972
6 carbon 1993 0.01576876
7 carbon 1994 0.015918601
8 carbon 1995 0.015856284
9 carbon 1996 0.01574694
10 carbon 1997 0.015578632
11 carbon 1998 0.015326237
12 carbon 1999 0.014957643
13 carbon 2000 0.014545004
14 carbon 2001 0.013858486
15 carbon 2002 0.013113324
16 carbon 2003 0.012404627
17 carbon 2004 0.01152776
18 carbon 2005 0.010945379
19 carbon 2006 0.010768616
20 carbon 2007 0.011168584
21 carbon 2008 0.012313212
22 carbon 2009 0.012960807
23 carbon 2010 0.013408027
24 carbon 2011 0.014122876
25 carbon 2012 0.014307019
26 carbon 2013 0.014217819
27 carbon 2014 0.013942404
28 carbon 2015 0.013270593
29 carbon 2016 0.012660838
30 change 1988 0
31 change 1989 0
32 change 1990 0
33 change 1991 0
34 change 1992 0
35 change 1993 0
36 change 1994 0
37 change 1995 0
38 change 1996 0
39 change 1997 0
40 change 1998 0
41 change 1999 0
42 change 2000 0
43 change 2001 0
44 change 2002 0
45 change 2003 0
46 change 2004 0
47 change 2005 0.007174738
48 change 2006 0.007960758
49 change 2007 0.008701192
50 change 2008 0.009283288
51 change 2009 0.009605547
52 change 2010 0.009875856
53 change 2011 0.010206261
54 change 2012 0.010533565
55 change 2013 0.01098107
56 change 2014 0.011351011
57 change 2015 0.011474677
58 change 2016 0.011517928
59 china 1988 0
60 china 1989 0
61 china 1990 0
62 china 1991 0
63 china 1992 0
64 china 1993 0
65 china 1994 0
66 china 1995 0
67 china 1996 0
68 china 1997 0
69 china 1998 0
70 china 1999 0
71 china 2000 0
72 china 2001 0
73 china 2002 0
74 china 2003 0
75 china 2004 0
76 china 2005 0.006795692
77 china 2006 0.008106408
78 china 2007 0.009666749
79 china 2008 0.011125904
80 china 2009 0.012516045
81 china 2010 0.013639745
82 china 2011 0.014530866
83 china 2012 0.014976414
84 china 2013 0.015330594
85 china 2014 0.015748278
86 china 2015 0.016445688
87 china 2016 0.017056364
88 climate 1988 0
89 climate 1989 0
90 climate 1990 0
91 climate 1991 0
92 climate 1992 0
93 climate 1993 0
94 climate 1994 0
95 climate 1995 0
96 climate 1996 0
97 climate 1997 0.007895573
98 climate 1998 0.00833649
99 climate 1999 0.008912323
100 climate 2000 0.009618778
101 climate 2001 0.010452578
102 climate 2002 0.011333169
103 climate 2003 0.012066777
104 climate 2004 0.01264321
105 climate 2005 0.013243008
106 climate 2006 0.013910315
107 climate 2007 0.014660979
108 climate 2008 0.01564667
109 climate 2009 0.01670716
110 climate 2010 0.017353524
111 climate 2011 0.017675122
112 climate 2012 0.017804751
113 climate 2013 0.018137557
114 climate 2014 0.018468739
115 climate 2015 0.018518284
116 climate 2016 0.018545854
117 countries 1988 0
118 countries 1989 0
119 countries 1990 0
120 countries 1991 0
121 countries 1992 0
122 countries 1993 0.006393516
123 countries 1994 0.006914755
124 countries 1995 0.007501597
125 countries 1996 0.008033076
126 countries 1997 0.008540121
127 countries 1998 0.008965076
128 countries 1999 0.009296863
129 countries 2000 0.009438798
130 countries 2001 0.009263441
131 countries 2002 0.00891663
132 countries 2003 0.008723221
133 countries 2004 0.008708484
134 countries 2005 0.008723848
135 countries 2006 0.008818215
136 countries 2007 0.008918384
137 countries 2008 0.008803662
138 countries 2009 0.008583973
139 countries 2010 0.00821591
140 countries 2011 0.007997692
141 countries 2012 0.007768248
142 countries 2013 0.007534957
143 countries 2014 0.007241465
144 countries 2015 0.00701393
145 countries 2016 0.006893111
146 dioxide 1988 0.011689644
147 dioxide 1989 0.012009098
148 dioxide 1990 0.01255679
149 dioxide 1991 0.012861711
150 dioxide 1992 0.012700293
151 dioxide 1993 0.012512138
152 dioxide 1994 0.01212933
153 dioxide 1995 0.011563284
154 dioxide 1996 0.010977417
155 dioxide 1997 0.010474302
156 dioxide 1998 0.010170615
157 dioxide 1999 0.009899627
158 dioxide 2000 0.009734757
159 dioxide 2001 0.009459213
160 dioxide 2002 0.009020693
161 dioxide 2003 0.008346138
162 dioxide 2004 0.00730606
163 dioxide 2005 0
164 dioxide 2006 0
165 dioxide 2007 0
166 dioxide 2008 0
167 dioxide 2009 0
168 dioxide 2010 0
169 dioxide 2011 0
170 dioxide 2012 0
171 dioxide 2013 0
172 dioxide 2014 0
173 dioxide 2015 0
174 dioxide 2016 0
175 emissions 1988 0.006893699
176 emissions 1989 0.007127361
177 emissions 1990 0.007546994
178 emissions 1991 0.008171227
179 emissions 1992 0.009044563
180 emissions 1993 0.010127142
181 emissions 1994 0.011344911
182 emissions 1995 0.01261348
183 emissions 1996 0.01375901
184 emissions 1997 0.014626927
185 emissions 1998 0.014902139
186 emissions 1999 0.014674035
187 emissions 2000 0.014260145
188 emissions 2001 0.013936822
189 emissions 2002 0.013594321
190 emissions 2003 0.0132275
191 emissions 2004 0.012796577
192 emissions 2005 0.012389819
193 emissions 2006 0.012150715
194 emissions 2007 0.012101503
195 emissions 2008 0.012165845
196 emissions 2009 0.012093236
197 emissions 2010 0.012101834
198 emissions 2011 0.012295093
199 emissions 2012 0.012722598
200 emissions 2013 0.013310952
201 emissions 2014 0.013936191
202 emissions 2015 0.014259544
203 emissions 2016 0.014570486
204 environmental 1988 0.006175532
205 environmental 1989 0.006072623
206 environmental 1990 0
207 environmental 1991 0
208 environmental 1992 0
209 environmental 1993 0
210 environmental 1994 0
211 environmental 1995 0
212 environmental 1996 0
213 environmental 1997 0
214 environmental 1998 0
215 environmental 1999 0
216 environmental 2000 0
217 environmental 2001 0
218 environmental 2002 0
219 environmental 2003 0
220 environmental 2004 0
221 environmental 2005 0
222 environmental 2006 0
223 environmental 2007 0
224 environmental 2008 0
225 environmental 2009 0
226 environmental 2010 0
227 environmental 2011 0
228 environmental 2012 0
229 environmental 2013 0
230 environmental 2014 0
231 environmental 2015 0
232 environmental 2016 0
233 gases 1988 0
234 gases 1989 0
235 gases 1990 0.005992064
236 gases 1991 0.006378399
237 gases 1992 0.006660351
238 gases 1993 0.007008168
239 gases 1994 0.00743083
240 gases 1995 0.007763032
241 gases 1996 0.008018532
242 gases 1997 0.008238661
243 gases 1998 0.008262914
244 gases 1999 0.008228658
245 gases 2000 0.008123219
246 gases 2001 0.007919846
247 gases 2002 0.007690072
248 gases 2003 0.007294764
249 gases 2004 0
250 gases 2005 0
251 gases 2006 0
252 gases 2007 0
253 gases 2008 0
254 gases 2009 0
255 gases 2010 0
256 gases 2011 0
257 gases 2012 0
258 gases 2013 0
259 gases 2014 0
260 gases 2015 0
261 gases 2016 0
262 global 1988 0.014096225
263 global 1989 0.0141381
264 global 1990 0.014223733
265 global 1991 0.0142383
266 global 1992 0.01412855
267 global 1993 0.013853275
268 global 1994 0.013396189
269 global 1995 0.01288206
270 global 1996 0.012406503
271 global 1997 0.01199725
272 global 1998 0.011673385
273 global 1999 0.011442628
274 global 2000 0.011334121
275 global 2001 0.011462479
276 global 2002 0.011730151
277 global 2003 0.012012293
278 global 2004 0.012194064
279 global 2005 0.012337975
280 global 2006 0.01239175
281 global 2007 0.012197395
282 global 2008 0.011755623
283 global 2009 0.011161393
284 global 2010 0.010561993
285 global 2011 0.010133799
286 global 2012 0.009777312
287 global 2013 0.009436232
288 global 2014 0.00913381
289 global 2015 0.008952254
290 global 2016 0.008874901
291 greenhouse 1988 0.007474254
292 greenhouse 1989 0.007405522
293 greenhouse 1990 0.007364111
294 greenhouse 1991 0.00739914
295 greenhouse 1992 0.007294652
296 greenhouse 1993 0.007288428
297 greenhouse 1994 0.007380275
298 greenhouse 1995 0.007433416
299 greenhouse 1996 0.007578104
300 greenhouse 1997 0
301 greenhouse 1998 0
302 greenhouse 1999 0.008007428
303 greenhouse 2000 0.008033002
304 greenhouse 2001 0.007802469
305 greenhouse 2002 0.007468611
306 greenhouse 2003 0.007195279
307 greenhouse 2004 0.006851452
308 greenhouse 2005 0
309 greenhouse 2006 0
310 greenhouse 2007 0
311 greenhouse 2008 0
312 greenhouse 2009 0
313 greenhouse 2010 0
314 greenhouse 2011 0
315 greenhouse 2012 0
316 greenhouse 2013 0
317 greenhouse 2014 0
318 greenhouse 2015 0
319 greenhouse 2016 0
320 states 1988 0.006795447
321 states 1989 0.006640446
322 states 1990 0.006495425
323 states 1991 0.006462253
324 states 1992 0.006594695
325 states 1993 0.00675479
326 states 1994 0.006979831
327 states 1995 0.007248295
328 states 1996 0.007526445
329 states 1997 0.007779636
330 states 1998 0.00792936
331 states 1999 0
332 states 2000 0
333 states 2001 0
334 states 2002 0
335 states 2003 0
336 states 2004 0
337 states 2005 0
338 states 2006 0
339 states 2007 0
340 states 2008 0
341 states 2009 0
342 states 2010 0.006017932
343 states 2011 0.006160684
344 states 2012 0.006289442
345 states 2013 0.006300276
346 states 2014 0.006245695
347 states 2015 0.006111464
348 states 2016 0.006027513
349 united 1988 0.008900253
350 united 1989 0.008616585
351 united 1990 0.008376238
352 united 1991 0.00834697
353 united 1992 0.0086015
354 united 1993 0.00887543
355 united 1994 0.009194713
356 united 1995 0.009544475
357 united 1996 0.009884803
358 united 1997 0.010182421
359 united 1998 0.010302405
360 united 1999 0.010016022
361 united 2000 0.009548711
362 united 2001 0.009085718
363 united 2002 0.008530924
364 united 2003 0.008048634
365 united 2004 0.007825875
366 united 2005 0.007709088
367 united 2006 0.007745082
368 united 2007 0.007818624
369 united 2008 0.007884495
370 united 2009 0.007905852
371 united 2010 0.00784918
372 united 2011 0.008010262
373 united 2012 0.008358298
374 united 2013 0.008629442
375 united 2014 0.008861451
376 united 2015 0.00881896
377 united 2016 0.008776777
378 warming 1988 0.01349296
379 warming 1989 0.0135931
380 warming 1990 0.014068262
381 warming 1991 0.014598572
382 warming 1992 0.014336308
383 warming 1993 0.013925391
384 warming 1994 0.013127383
385 warming 1995 0.01236009
386 warming 1996 0.011771616
387 warming 1997 0.011397875
388 warming 1998 0.011196514
389 warming 1999 0.01119077
390 warming 2000 0.011421856
391 warming 2001 0.011994911
392 warming 2002 0.012517565
393 warming 2003 0.012826283
394 warming 2004 0.012518435
395 warming 2005 0.011943357
396 warming 2006 0.010908949
397 warming 2007 0.009347113
398 warming 2008 0.007819906
399 warming 2009 0.006513051
400 warming 2010 0
401 warming 2011 0
402 warming 2012 0
403 warming 2013 0
404 warming 2014 0
405 warming 2015 0
406 warming 2016 0
407 world 1988 0.006667394
408 world 1989 0.006637533
409 world 1990 0.006509364
410 world 1991 0.006322828
411 world 1992 0.006171125
412 world 1993 0
413 world 1994 0
414 world 1995 0
415 world 1996 0
416 world 1997 0
417 world 1998 0
418 world 1999 0
419 world 2000 0
420 world 2001 0
421 world 2002 0
422 world 2003 0
423 world 2004 0.006960181
424 world 2005 0.007357369
425 world 2006 0.007757359
426 world 2007 0.008094882
427 world 2008 0.008325181
428 world 2009 0.008546841
429 world 2010 0.008922709
430 world 2011 0.009510344
431 world 2012 0.0100567
432 world 2013 0.010335823
433 world 2014 0.010221098
434 world 2015 0.009884162
435 world 2016 0.009699301
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment