Skip to content

Instantly share code, notes, and snippets.

@natemiller

natemiller/index.html

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

  • Select an option

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

Select an option

Learn more about clone URLs
Save natemiller/a8b5c9c849f371e0fc26d41150fc6403 to your computer and use it in GitHub Desktop.
Download ZIP
Climate Change Topic Modeling - Topic 6
Raw
index.html
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset="utf-8">
<title> Climate Streamplot - Topic 6</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 6 - Cars &#38; Vehicles / Fuels </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("topic6_stream_R.csv", "BuPu");
var datearray = [];
var colorrange = [];
function chart(csvpath, color) {
if (color == "blue") {
colorrange = ['#00441b','#006d2c','#238b45','#41ae76','#66c2a4','#99d8c9','#e5f5f9','#ccece6'];
}
else if (color == "dark") {
colorrange = ['#084081','#0868ac','#2b8cbe','#4eb3d3','#7bccc4','#a8ddb5','#ccebc5'];
}
else if (color == "orange") {
colorrange = ["#7f0000","#B30000", "#E34A33", "#FC8D59", "#FDBB84", "#FDD49E", "#FEF0D9"];
}
else if (color == "BuPu") {
colorrange = ["#4d004b","#810f7c","#88419d","#8c6bb1","#8c96c6","#9ebcda","#bfd3e6"]
}
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/9196fa786d874c448167cb136a7abf0d>Topic #7</a></p>
</body>
</html>
Raw
topic6_stream_R.csv
key date value
1 auto 1988 0.011091941
2 auto 1989 0.011141358
3 auto 1990 0.011013539
4 auto 1991 0.010447524
5 auto 1992 0.009978783
6 auto 1993 0.009541589
7 auto 1994 0.009113213
8 auto 1995 0.008709053
9 auto 1996 0.008331251
10 auto 1997 0.00791522
11 auto 1998 0.006915977
12 auto 1999 0.005833962
13 auto 2000 0.004861159
14 auto 2001 0.00417558
15 auto 2002 0
16 auto 2003 0
17 auto 2004 0
18 auto 2005 0
19 auto 2006 0
20 auto 2007 0
21 auto 2008 0
22 auto 2009 0
23 auto 2010 0
24 auto 2011 0
25 auto 2012 0
26 auto 2013 0
27 auto 2014 0
28 auto 2015 0
29 auto 2016 0
30 car 1988 0.01813658
31 car 1989 0.018301327
32 car 1990 0.018652045
33 car 1991 0.018317113
34 car 1992 0.017938665
35 car 1993 0.017510828
36 car 1994 0.016775945
37 car 1995 0.015981142
38 car 1996 0.015129552
39 car 1997 0.01432608
40 car 1998 0.013599693
41 car 1999 0.01301811
42 car 2000 0.012390721
43 car 2001 0.011695041
44 car 2002 0.011329389
45 car 2003 0.011051689
46 car 2004 0.010852565
47 car 2005 0.010257823
48 car 2006 0.009356871
49 car 2007 0.00854155
50 car 2008 0.008366248
51 car 2009 0.008687196
52 car 2010 0.008301439
53 car 2011 0.007644781
54 car 2012 0.006935838
55 car 2013 0.006022279
56 car 2014 0.005385493
57 car 2015 0.005048015
58 car 2016 0.004976397
59 cars 1988 0.019635145
60 cars 1989 0.019807017
61 cars 1990 0.02004641
62 cars 1991 0.019704839
63 cars 1992 0.019347865
64 cars 1993 0.019060229
65 cars 1994 0.018833117
66 cars 1995 0.018555125
67 cars 1996 0.018166672
68 cars 1997 0.017705526
69 cars 1998 0.017057647
70 cars 1999 0.016371833
71 cars 2000 0.015901948
72 cars 2001 0.015726327
73 cars 2002 0.015858075
74 cars 2003 0.015674247
75 cars 2004 0.014878407
76 cars 2005 0.013681291
77 cars 2006 0.011289375
78 cars 2007 0.009304218
79 cars 2008 0.008916089
80 cars 2009 0.009777514
81 cars 2010 0.009811335
82 cars 2011 0.009169856
83 cars 2012 0.008555411
84 cars 2013 0.008179939
85 cars 2014 0.00818646
86 cars 2015 0.008317641
87 cars 2016 0.008313741
88 companies 1988 0
89 companies 1989 0
90 companies 1990 0
91 companies 1991 0
92 companies 1992 0
93 companies 1993 0
94 companies 1994 0
95 companies 1995 0
96 companies 1996 0
97 companies 1997 0
98 companies 1998 0
99 companies 1999 0
100 companies 2000 0
101 companies 2001 0
102 companies 2002 0.004100338
103 companies 2003 0.004215532
104 companies 2004 0.004352626
105 companies 2005 0.0045062
106 companies 2006 0.004656761
107 companies 2007 0.004782423
108 companies 2008 0.004838363
109 companies 2009 0.004924336
110 companies 2010 0.005088147
111 companies 2011 0.005350486
112 companies 2012 0.00568263
113 companies 2013 0.006099418
114 companies 2014 0.006478853
115 companies 2015 0.006622844
116 companies 2016 0.006664091
117 company 1988 0.005248502
118 company 1989 0.005265794
119 company 1990 0.00530766
120 company 1991 0.005400186
121 company 1992 0.00547811
122 company 1993 0.005537312
123 company 1994 0.005592709
124 company 1995 0.005646143
125 company 1996 0.005697165
126 company 1997 0.005764803
127 company 1998 0.005907581
128 company 1999 0.006080715
129 company 2000 0.00614547
130 company 2001 0.006156835
131 company 2002 0.006182349
132 company 2003 0.006261521
133 company 2004 0.006491384
134 company 2005 0.006884024
135 company 2006 0.007327651
136 company 2007 0.007577187
137 company 2008 0.00696546
138 company 2009 0.007051432
139 company 2010 0.007543052
140 company 2011 0.008317008
141 company 2012 0.009002772
142 company 2013 0.009491177
143 company 2014 0.010002838
144 company 2015 0.010236368
145 company 2016 0.010298898
146 electric 1988 0.004974456
147 electric 1989 0.004972364
148 electric 1990 0.004924198
149 electric 1991 0.004900706
150 electric 1992 0.004878837
151 electric 1993 0.004852217
152 electric 1994 0.004805479
153 electric 1995 0.004757158
154 electric 1996 0.004706251
155 electric 1997 0.004653332
156 electric 1998 0.004596719
157 electric 1999 0.004443389
158 electric 2000 0.004299549
159 electric 2001 0.004100531
160 electric 2002 0
161 electric 2003 0.003813292
162 electric 2004 0.003750395
163 electric 2005 0
164 electric 2006 0
165 electric 2007 0.003833089
166 electric 2008 0.004127521
167 electric 2009 0.00528085
168 electric 2010 0.005776608
169 electric 2011 0.005745022
170 electric 2012 0.005723189
171 electric 2013 0.005437238
172 electric 2014 0.005310939
173 electric 2015 0.005259509
174 electric 2016 0.005231122
175 ethanol 1988 0
176 ethanol 1989 0
177 ethanol 1990 0
178 ethanol 1991 0
179 ethanol 1992 0
180 ethanol 1993 0
181 ethanol 1994 0
182 ethanol 1995 0
183 ethanol 1996 0
184 ethanol 1997 0
185 ethanol 1998 0
186 ethanol 1999 0
187 ethanol 2000 0
188 ethanol 2001 0
189 ethanol 2002 0.00399292
190 ethanol 2003 0.004104358
191 ethanol 2004 0.004342035
192 ethanol 2005 0.004821157
193 ethanol 2006 0.005334231
194 ethanol 2007 0.005804787
195 ethanol 2008 0.005886526
196 ethanol 2009 0.005634166
197 ethanol 2010 0.005437679
198 ethanol 2011 0.004907716
199 ethanol 2012 0
200 ethanol 2013 0
201 ethanol 2014 0
202 ethanol 2015 0
203 ethanol 2016 0
204 ford 1988 0
205 ford 1989 0
206 ford 1990 0
207 ford 1991 0
208 ford 1992 0
209 ford 1993 0
210 ford 1994 0
211 ford 1995 0
212 ford 1996 0
213 ford 1997 0
214 ford 1998 0
215 ford 1999 0
216 ford 2000 0.00448078
217 ford 2001 0.004659288
218 ford 2002 0.004069367
219 ford 2003 0
220 ford 2004 0
221 ford 2005 0
222 ford 2006 0
223 ford 2007 0
224 ford 2008 0
225 ford 2009 0
226 ford 2010 0
227 ford 2011 0
228 ford 2012 0
229 ford 2013 0
230 ford 2014 0
231 ford 2015 0
232 ford 2016 0
233 foundation 1988 0
234 foundation 1989 0
235 foundation 1990 0
236 foundation 1991 0
237 foundation 1992 0
238 foundation 1993 0
239 foundation 1994 0
240 foundation 1995 0
241 foundation 1996 0
242 foundation 1997 0
243 foundation 1998 0
244 foundation 1999 0
245 foundation 2000 0
246 foundation 2001 0
247 foundation 2002 0
248 foundation 2003 0
249 foundation 2004 0
250 foundation 2005 0
251 foundation 2006 0
252 foundation 2007 0
253 foundation 2008 0
254 foundation 2009 0
255 foundation 2010 0
256 foundation 2011 0
257 foundation 2012 0.004850926
258 foundation 2013 0.005850571
259 foundation 2014 0.006172886
260 foundation 2015 0.006728189
261 foundation 2016 0.0069537
262 fuel 1988 0.016215143
263 fuel 1989 0.016298352
264 fuel 1990 0.01635862
265 fuel 1991 0.015987814
266 fuel 1992 0.015492928
267 fuel 1993 0.015088783
268 fuel 1994 0.015053627
269 fuel 1995 0.01507382
270 fuel 1996 0.01508882
271 fuel 1997 0.015114421
272 fuel 1998 0.01517915
273 fuel 1999 0.015411431
274 fuel 2000 0.015617361
275 fuel 2001 0.015736162
276 fuel 2002 0.015204689
277 fuel 2003 0.014016829
278 fuel 2004 0.011519931
279 fuel 2005 0.009990534
280 fuel 2006 0.008453879
281 fuel 2007 0.007119326
282 fuel 2008 0.006114032
283 fuel 2009 0.005673343
284 fuel 2010 0.005710033
285 fuel 2011 0.005686688
286 fuel 2012 0.005642407
287 fuel 2013 0.005603365
288 fuel 2014 0.005586997
289 fuel 2015 0.005422972
290 fuel 2016 0.00538677
291 gasoline 1988 0.011726443
292 gasoline 1989 0.011814952
293 gasoline 1990 0.011918609
294 gasoline 1991 0.011482395
295 gasoline 1992 0.010993569
296 gasoline 1993 0.010548088
297 gasoline 1994 0.010167443
298 gasoline 1995 0.009795769
299 gasoline 1996 0.009396021
300 gasoline 1997 0.008983553
301 gasoline 1998 0.008483654
302 gasoline 1999 0.008006002
303 gasoline 2000 0.007581998
304 gasoline 2001 0.00694063
305 gasoline 2002 0.006223413
306 gasoline 2003 0.005591335
307 gasoline 2004 0.00507689
308 gasoline 2005 0.004551203
309 gasoline 2006 0.004053242
310 gasoline 2007 0
311 gasoline 2008 0
312 gasoline 2009 0
313 gasoline 2010 0
314 gasoline 2011 0
315 gasoline 2012 0
316 gasoline 2013 0
317 gasoline 2014 0
318 gasoline 2015 0
319 gasoline 2016 0
320 hydrogen 1988 0.014928787
321 hydrogen 1989 0.014781787
322 hydrogen 1990 0.013614483
323 hydrogen 1991 0.012857776
324 hydrogen 1992 0.012077557
325 hydrogen 1993 0.011351334
326 hydrogen 1994 0.010657219
327 hydrogen 1995 0.009987695
328 hydrogen 1996 0.009389151
329 hydrogen 1997 0.008870466
330 hydrogen 1998 0.00858074
331 hydrogen 1999 0.008443633
332 hydrogen 2000 0.008182437
333 hydrogen 2001 0.00819552
334 hydrogen 2002 0.008575814
335 hydrogen 2003 0.008679492
336 hydrogen 2004 0.007473366
337 hydrogen 2005 0.00658767
338 hydrogen 2006 0.005259108
339 hydrogen 2007 0.00404093
340 hydrogen 2008 0
341 hydrogen 2009 0
342 hydrogen 2010 0
343 hydrogen 2011 0
344 hydrogen 2012 0
345 hydrogen 2013 0
346 hydrogen 2014 0
347 hydrogen 2015 0
348 hydrogen 2016 0
349 market 1988 0
350 market 1989 0
351 market 1990 0
352 market 1991 0
353 market 1992 0
354 market 1993 0
355 market 1994 0
356 market 1995 0
357 market 1996 0
358 market 1997 0
359 market 1998 0
360 market 1999 0
361 market 2000 0
362 market 2001 0
363 market 2002 0
364 market 2003 0
365 market 2004 0
366 market 2005 0
367 market 2006 0
368 market 2007 0
369 market 2008 0
370 market 2009 0.003831594
371 market 2010 0.004237569
372 market 2011 0.004636268
373 market 2012 0.004987233
374 market 2013 0.005261536
375 market 2014 0.005146128
376 market 2015 0.005016159
377 market 2016 0.005013123
378 miles 1988 0.007917754
379 miles 1989 0.007953836
380 miles 1990 0.007950832
381 miles 1991 0.007676202
382 miles 1992 0.007365985
383 miles 1993 0.007021271
384 miles 1994 0.006537023
385 miles 1995 0.006062716
386 miles 1996 0.005613816
387 miles 1997 0.005204105
388 miles 1998 0.004857793
389 miles 1999 0.004548898
390 miles 2000 0
391 miles 2001 0
392 miles 2002 0
393 miles 2003 0
394 miles 2004 0
395 miles 2005 0
396 miles 2006 0
397 miles 2007 0
398 miles 2008 0
399 miles 2009 0
400 miles 2010 0
401 miles 2011 0
402 miles 2012 0
403 miles 2013 0
404 miles 2014 0
405 miles 2015 0
406 miles 2016 0
407 million 1988 0
408 million 1989 0
409 million 1990 0
410 million 1991 0
411 million 1992 0
412 million 1993 0
413 million 1994 0
414 million 1995 0
415 million 1996 0
416 million 1997 0
417 million 1998 0
418 million 1999 0
419 million 2000 0
420 million 2001 0
421 million 2002 0
422 million 2003 0
423 million 2004 0
424 million 2005 0
425 million 2006 0
426 million 2007 0
427 million 2008 0
428 million 2009 0
429 million 2010 0
430 million 2011 0.004321512
431 million 2012 0.004617938
432 million 2013 0.004946083
433 million 2014 0.005306489
434 million 2015 0.005616685
435 million 2016 0.005643558
436 money 1988 0
437 money 1989 0
438 money 1990 0
439 money 1991 0
440 money 1992 0
441 money 1993 0
442 money 1994 0
443 money 1995 0
444 money 1996 0
445 money 1997 0
446 money 1998 0
447 money 1999 0
448 money 2000 0
449 money 2001 0
450 money 2002 0
451 money 2003 0
452 money 2004 0
453 money 2005 0
454 money 2006 0
455 money 2007 0
456 money 2008 0.003857775
457 money 2009 0.004089674
458 money 2010 0.004439093
459 money 2011 0.004860292
460 money 2012 0.005197365
461 money 2013 0.005569799
462 money 2014 0.005850788
463 money 2015 0.006221241
464 money 2016 0.006494127
465 says 1988 0
466 says 1989 0
467 says 1990 0
468 says 1991 0
469 says 1992 0
470 says 1993 0
471 says 1994 0
472 says 1995 0
473 says 1996 0
474 says 1997 0
475 says 1998 0
476 says 1999 0
477 says 2000 0
478 says 2001 0
479 says 2002 0
480 says 2003 0
481 says 2004 0
482 says 2005 0
483 says 2006 0
484 says 2007 0
485 says 2008 0
486 says 2009 0
487 says 2010 0
488 says 2011 0
489 says 2012 0
490 says 2013 0
491 says 2014 0
492 says 2015 0
493 says 2016 0
494 vehicles 1988 0.007111658
495 vehicles 1989 0.007136253
496 vehicles 1990 0.007191985
497 vehicles 1991 0.007354877
498 vehicles 1992 0.007529126
499 vehicles 1993 0.007713086
500 vehicles 1994 0.007916354
501 vehicles 1995 0.008125731
502 vehicles 1996 0.00833387
503 vehicles 1997 0.008529879
504 vehicles 1998 0.008626543
505 vehicles 1999 0.008538055
506 vehicles 2000 0.008459777
507 vehicles 2001 0.008296106
508 vehicles 2002 0.007771472
509 vehicles 2003 0.007117265
510 vehicles 2004 0.006399424
511 vehicles 2005 0.005527942
512 vehicles 2006 0.004751087
513 vehicles 2007 0.004129203
514 vehicles 2008 0.003812248
515 vehicles 2009 0
516 vehicles 2010 0
517 vehicles 2011 0
518 vehicles 2012 0
519 vehicles 2013 0
520 vehicles 2014 0
521 vehicles 2015 0
522 vehicles 2016 0
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment