Skip to content

Instantly share code, notes, and snippets.

@danielhavir
Created February 11, 2017 16:40
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save danielhavir/99f375dd1587806ebdbce2c54384281f to your computer and use it in GitHub Desktop.
Save danielhavir/99f375dd1587806ebdbce2c54384281f to your computer and use it in GitHub Desktop.
country year co2
China 1962 0.651705172948
India 1962 0.307620146391
Japan 1962 3.1103547047
Russia 1962 7.91397623629
United Kingdom 1962 11.1388081316
United States 1962 15.5606900155
China 1963 0.637538142643
India 1963 0.323658671475
Japan 1963 3.41488661345
Russia 1963 8.39127709153
United Kingdom 1963 11.2558325146
United States 1963 16.0280736699
China 1964 0.627551170693
India 1964 0.309921667511
Japan 1964 3.7326946822
Russia 1964 8.83406151723
United Kingdom 1964 11.2635122105
United States 1964 16.5184662067
China 1965 0.670049506978
India 1965 0.334320854733
Japan 1965 3.97445701148
Russia 1965 9.28962107852
United Kingdom 1965 11.4547284317
United States 1965 16.999607412
China 1966 0.718445903197
India 1966 0.338680958235
Japan 1966 4.26114222369
Russia 1966 9.73923836529
United Kingdom 1966 11.3143070553
United States 1966 17.6614342327
China 1967 0.57938607411
India 1967 0.332354028487
Japan 1967 4.91248572583
Russia 1967 10.1230206465
United Kingdom 1967 10.7810749408
United States 1967 18.1396638857
China 1968 0.609206710107
India 1968 0.353660132207
Japan 1968 5.56995058162
Russia 1968 10.354098024
United Kingdom 1968 10.9922629403
United States 1968 18.6267327197
China 1969 0.728484529127
India 1969 0.352153808401
Japan 1969 6.39034163288
Russia 1969 10.7306571515
United Kingdom 1969 11.3413705515
United States 1969 19.3877151212
China 1970 0.947122148307
India 1970 0.352291988413
Japan 1970 7.41250801218
Russia 1970 11.2296800309
United Kingdom 1970 11.7350961149
United States 1970 20.6647146514
China 1971 1.04796786131
India 1971 0.363275029247
Japan 1971 7.58441898814
Russia 1971 11.8549751477
United Kingdom 1971 11.8382108732
United States 1971 20.6115922304
China 1972 1.08590186715
India 1972 0.375651318199
Japan 1972 8.00316191373
Russia 1972 12.4049836236
United Kingdom 1972 11.5863756039
United States 1972 21.4045978288
China 1973 1.10264038337
India 1973 0.377949339413
Japan 1973 8.47138968961
Russia 1973 12.8554268262
United Kingdom 1973 11.7681385644
United States 1973 22.167963404
China 1974 1.10077728643
India 1974 0.381779392294
Japan 1974 8.36348782433
Russia 1974 13.2673623267
United Kingdom 1974 10.9941857577
United States 1974 21.1781759719
China 1975 1.25186018132
India 1975 0.405368928572
Japan 1975 7.85135513722
Russia 1975 13.8638078679
United Kingdom 1975 10.7334646294
United States 1975 20.1084478941
China 1976 1.28508386472
India 1976 0.414073363369
Japan 1976 8.11472953594
Russia 1976 14.3100144796
United Kingdom 1976 10.6420112134
United States 1976 20.856631366
China 1977 1.38684742821
India 1977 0.483922042159
Japan 1977 8.27026471035
Russia 1977 14.7047728891
United Kingdom 1977 10.7423208932
United States 1977 21.2377774824
China 1978 1.52679609406
India 1978 0.476116230487
Japan 1978 7.92409803288
Russia 1978 15.1124734642
United Kingdom 1978 10.7474729446
United States 1978 21.6853899995
China 1979 1.54066792701
India 1979 0.485350271253
Japan 1979 8.30926816687
Russia 1979 15.1373384981
United Kingdom 1979 11.4542776792
United States 1979 21.5263900374
China 1980 1.49217129385
India 1980 0.497886422145
Japan 1980 8.17398568161
Russia 1980 15.6271140928
United Kingdom 1980 10.2878689738
United States 1980 20.5405920329
China 1981 1.45622210905
India 1981 0.523086995481
Japan 1981 7.9566042438
Russia 1981 15.2260031424
United Kingdom 1981 9.95727192174
United States 1981 19.5288583785
China 1982 1.56358243627
India 1982 0.543384535342
Japan 1982 7.64684601445
Russia 1982 15.4058807461
United Kingdom 1982 9.73479351953
United States 1982 18.3564637636
China 1983 1.62607858899
India 1983 0.576349783499
Japan 1983 7.45446730591
Russia 1983 15.5168634149
United Kingdom 1983 9.67893190117
United States 1983 18.3270011389
China 1984 1.74427805979
India 1984 0.582768945377
Japan 1984 7.8782956335
Russia 1984 15.5449822126
United Kingdom 1984 9.37840835022
United States 1984 18.7187054019
China 1985 1.86107642533
India 1985 0.625144750202
Japan 1985 7.62821480151
Russia 1985 16.6443475674
United Kingdom 1985 9.9050830358
United States 1985 18.6050830817
China 1986 1.92661235017
India 1986 0.655586911884
Japan 1986 7.59203034071
Russia 1986 16.5682984975
United Kingdom 1986 10.0440829452
United States 1986 18.442898233
China 1987 2.02353477779
India 1987 0.684934900037
Japan 1987 7.48320843054
Russia 1987 17.1415098542
United Kingdom 1987 10.0754151682
United States 1987 19.0467892031
China 1988 2.13384010219
India 1988 0.723699696701
Japan 1988 8.14422775355
Russia 1988 17.4935188011
United Kingdom 1988 10.0244547002
United States 1988 19.6802854397
China 1989 2.13447387644
India 1989 0.774663982456
Japan 1989 8.41690926392
Russia 1989 17.028401412
United Kingdom 1989 10.1943151948
United States 1989 19.7348269841
China 1990 2.14855970243
India 1990 0.790255780032
Japan 1990 8.95479807105
Russia 1990 15.8954995334
United Kingdom 1990 9.97997464767
United States 1990 18.8194574332
China 1991 2.22631324737
India 1991 0.827196149579
Japan 1991 8.9682011106
Russia 1991 15.2766848638
United Kingdom 1991 10.1847965585
United States 1991 18.8667949439
China 1992 2.29379463838
India 1992 0.860997141238
Japan 1992 9.12073932476
Russia 1992 14.3690945865
United Kingdom 1992 10.0478931714
United States 1992 19.0561643201
China 1993 2.4215214329
India 1993 0.87718252013
Japan 1993 8.96427127637
Russia 1993 13.1844168199
United Kingdom 1993 9.68295416617
United States 1993 19.2839234311
China 1994 2.54507356087
India 1994 0.913860302216
Japan 1994 9.45964730194
Russia 1994 11.5701013013
United Kingdom 1994 9.5989247964
United States 1994 19.4371799692
China 1995 2.73477755519
India 1995 0.953837430859
Japan 1995 9.50975425016
Russia 1995 11.1794945618
United Kingdom 1995 9.58007002981
United States 1995 19.3587714933
China 1996 2.8241392412
India 1996 1.01992741765
Japan 1996 9.65830337072
Russia 1996 10.9914568329
United Kingdom 1996 9.82361424958
United States 1996 19.6202337092
China 1997 2.80259728612
India 1997 1.04326270397
Japan 1997 9.60514483475
Russia 1997 10.5245284245
United Kingdom 1997 9.35415802915
United States 1997 19.8755940754
China 1998 2.66132002434
India 1998 1.05237575036
Japan 1998 9.24759069207
Russia 1998 10.3324114942
United Kingdom 1998 9.32226139187
United States 1998 19.7676521396
China 1999 2.63423156894
India 1999 1.10424744631
Japan 1999 9.54287859539
Russia 1999 10.4469337357
United Kingdom 1999 9.12713658354
United States 1999 19.8037524975
China 2000 2.68286615786
India 2000 1.12587291452
Japan 2000 9.69993093108
Russia 2000 10.6159491192
United Kingdom 2000 9.23347464671
United States 2000 20.223416888
China 2001 2.72888288474
India 2001 1.12354170444
Japan 2001 9.54899042027
Russia 2001 10.6585438297
United Kingdom 2001 9.31521281403
United States 2001 19.6147717576
China 2002 2.87254783076
India 2002 1.12674413555
Japan 2002 9.65217060674
Russia 2002 10.703180537
United Kingdom 2002 8.96344107302
United States 2002 19.5877863567
China 2003 3.49835887751
India 2003 1.15906825777
Japan 2003 9.80564259832
Russia 2003 11.0769013777
United Kingdom 2003 9.06966287766
United States 2003 19.5033538029
China 2004 4.06572346859
India 2004 1.20072357504
Japan 2004 9.97265381875
Russia 2004 11.106997812
United Kingdom 2004 9.02227753383
United States 2004 19.6904618538
China 2005 4.42759216646
India 2005 1.23767217481
Japan 2005 9.7953911378
Russia 2005 11.2312652051
United Kingdom 2005 9.00186797186
United States 2005 19.627579645
China 2006 4.87902838565
India 2006 1.30006733207
Japan 2006 9.7354344747
Russia 2006 11.6330962789
United Kingdom 2006 8.95290098343
United States 2006 19.1514501035
China 2007 5.13906937639
India 2007 1.37248461798
Japan 2007 9.88829673125
Russia 2007 11.636494185
United Kingdom 2007 8.68459542262
United States 2007 19.2803978154
China 2008 5.29619359909
India 2008 1.52084942073
Japan 2008 9.53660568581
Russia 2008 11.9827176137
United Kingdom 2008 8.52646681764
United States 2008 18.5459916954
China 2009 5.76182547331
India 2009 1.6411495814
Japan 2009 8.69644545682
Russia 2009 11.0036333206
United Kingdom 2009 7.70553925401
United States 2009 17.2622243104
China 2010 6.17753037308
India 2010 1.64022278757
Japan 2010 9.25119918518
Russia 2010 12.1757158816
United Kingdom 2010 7.95446870239
United States 2010 17.5027178489
China 2011 6.74808802624
India 2011 1.675540213
Japan 2011 9.2797628854
Russia 2011 12.6516726041
United Kingdom 2011 7.32499631003
United States 2011 16.9831610136
China 2012 7.11264149945
India 2012 1.78103187156
Japan 2012 9.92599774318
Russia 2012 12.6375218172
United Kingdom 2012 7.50253308966
United States 2012 16.2181997961
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://dimplejs.org/dist/dimple.v2.0.0.min.js"></script>
<link href="https://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet">
<style>
body {
font-family: "Ubuntu", 'sans-serif';
}
#title {
margin: 0px;
margin-left: 100px;
padding: 1px 0px;
}
circle {
fill: '#99C0DB';
}
</style>
<script type="text/javascript">
function draw(data) {
"use strict";
var margin = 25,
width = 960 - margin,
height = 450 - margin;
var title = d3.select("body")
.append("h2")
.attr('id', 'title')
.text('CO2 Emissions over the years 1962 - 2012')
var svg = d3.select("body")
.append("svg")
.attr("width", width + margin)
.attr("height", height + margin)
.append('g')
.attr('class','chart');
var myChart = new dimple.chart(svg, data);
var x = myChart.addCategoryAxis("x", "year");
x.title = "Year";
var y = myChart.addMeasureAxis("y", "co2");
y.title = "CO2 Emissions (tonnes per person)";
myChart.addSeries("country", dimple.plot.line);
myChart.addSeries("country", dimple.plot.scatter);
var myLegend = myChart.addLegend(480, 10, 400, "right");
myChart.draw();
myChart.legends = [];
svg.selectAll("title_text")
.data(["Click legend to","show/hide countries:"])
.enter()
.append("text")
.attr("x", 380)
.attr("y", function (d, i) { return 17 + i * 14; })
.style("font-family", "Ubuntu")
.style("font-size", "10px")
.style("color", "Black")
.text(function (d) { return d; });
var filterValues = dimple.getUniqueValues(data, "country");
myLegend.shapes.selectAll("rect")
.on("click", function (e) {
var hide = false;
var newFilters = [];
filterValues.forEach(function (f) {
if (f === e.aggField.slice(-1)[0]) {
hide = true;
} else {
newFilters.push(f);
}
});
if (hide) {
d3.select(this).style("opacity", 0.2);
} else {
newFilters.push(e.aggField.slice(-1)[0]);
d3.select(this).style("opacity", 0.8);
}
filterValues = newFilters;
myChart.data = dimple.filterData(data, "country", filterValues);
myChart.draw(800);
});
};
</script>
</head>
<body>
<script type="text/javascript">
d3.csv("co2_data.csv", draw);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment