Skip to content

Instantly share code, notes, and snippets.

@etachov
Created April 27, 2015 01:24
Show Gist options
  • Save etachov/1d31cedd7a5de8b227a6 to your computer and use it in GitHub Desktop.
Save etachov/1d31cedd7a5de8b227a6 to your computer and use it in GitHub Desktop.
d3 glitch clouds
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Conditional Styling</title>
<script type="text/javascript" src="http://d3js.org/d3.v3.js"></script>
<style type="text/css">
body {
background-color: white;
}
svg {
background-color: white;
}
path {
stroke:gray;
stroke-width: 2;
stroke-opacity: .7;
}
.axis path,
.axis line {
fill: none;
stroke: black;
stroke-width: 0;
shape-rendering: crispEdges;
}
</style>
</head>
<body>
<script type="text/javascript">
var w = 800;
var h = 500;
var padding = [ 20, 80, 50, 30];
//Top, right, bottom, left
var dateFormat = d3.time.format("%Y");
var xScale = d3.time.scale()
.range([padding[3], w - padding[1] - padding[3] ]);
var yScale = d3.scale.linear()
.range([ padding[0], h - padding[2] ]);
var line = d3.svg.line()
.x(function(d) {
return xScale(dateFormat.parse(d.year));
})
.y(function(d) {
return yScale(+d.score);
});
var svg = d3.select("body")
.append("svg")
.attr("width", w)
.attr("height", h);
d3.csv("polStaWide.csv", function(data) {
var years = ["2002", "2003", "2004", "2005", "2006", "2007", "2008", "2009", "2010", "2011"];
var dataset = [];
for (var i = 0; i < data.length; i++) {
dataset[i] = {
country: data[i].country,
stability: []
};
for (var j = 0; j < years.length; j++ ) {
if(data[i][years[j]]) {
dataset[i].stability.push({
year: years[j],
score: data[i][years[j]]
});
}
}
}
xScale.domain([
d3.min(years, function(d){
return dateFormat.parse(d);
}),
d3.max(years, function(d) {
return dateFormat.parse(d);
})
]);
yScale.domain([
d3.max(dataset, function(d) {
return d3.max(d.stability, function(d) {
return +d.score;
});
}),
d3.min(dataset, function(d) {
return d3.min(d.stability, function(d) {
return +d.score;
});
})
]);
var groups = svg.selectAll("g")
.data(dataset)
.enter()
.append("g")
groups.selectAll("path")
.data(function(d) {
return [ d.stability ];
})
.enter()
.append("path")
.attr("class", "line")
.attr("d", line)
.attr("stroke-width", 2);
});
</script>
</body>
</html>
country 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011
Algeria -1.692478149 -1.777850253 -1.365787925 -0.926654521 -1.099115015 -1.108025684 -1.075692257 -1.228086688 -1.282641714 -1.352369936
Angola -1.62195294 -1.046225086 -1.041758078 -0.900983846 -0.542180601 -0.688272015 -0.345828961 -0.321307497 -0.177979129 -0.332175144
Benin 0.734553882 0.646225875 0.255016944 0.442953331 0.548808052 0.372545437 0.364136718 0.424431623 0.275696657 0.268000087
Botswana 0.788857256 1.069676791 0.879095567 1.049079782 0.886078508 0.918793122 0.937387974 0.945523516 0.956278177 1.038377581
Burkina Faso -0.380702564 0.017159805 -0.114757093 -0.081807015 0.178195498 0.308396733 0.112004884 0.010156593 -0.136707928 -0.541545387
Burundi -2.397711632 -2.308024422 -2.515943354 -1.507718042 -1.391205884 -1.316672406 -1.627807497 -1.262595287 -1.5911818 -1.811955913
Cameroon -0.730206208 -0.491298828 -0.408388132 -0.18448824 -0.316070718 -0.383214654 -0.588461673 -0.365731452 -0.59813879 -0.613138605
Cape Verde 0.646825551 0.907998228 1.063515762 0.777720859 0.968151141 0.901188633 0.827802693 0.838659244 0.854414372 0.711531423
Central African Republic -1.871341647 -1.580508111 -1.406548892 -1.422138721 -1.841246774 -1.837060952 -1.832776492 -2.052906487 -2.171087267 -2.036429245
Chad -1.690269173 -1.409942288 -1.495756517 -1.395694395 -1.879639851 -1.930969642 -2.038543539 -1.629782073 -1.475336577 -1.291015105
Comoros 0.273448979 -0.678476899 -0.104552891 -0.358215706 -0.312325969 -1.064399209 -1.08405507 -0.737524265 -0.494567821 -0.456524334
Congo, Dem. Rep. -2.09380887 -2.108315068 -2.385978584 -2.169047896 -2.278084053 -2.211638557 -2.030146553 -1.949254403 -2.184428093 -2.209821247
Congo, Rep. -1.659232525 -1.169670207 -1.123951406 -1.15493423 -0.948589467 -0.766351933 -0.71099341 -0.191675315 -0.238694243 -0.240172298
Cote d'Ivoire -1.981394769 -1.85021488 -2.168459078 -2.305741098 -1.992799301 -1.977223178 -1.900946201 -1.312576404 -1.57162527 -1.413808925
Djibouti -0.439609292 -0.940249252 -0.313078279 -0.763060969 -0.225604907 -0.068939734 0.302566231 0.498516428 0.258689075 0.270144719
Egypt, Arab Rep. -0.464554974 -0.673195365 -0.778613728 -0.649567447 -0.851828215 -0.576845148 -0.50064476 -0.632202601 -0.907535344 -1.286276821
Equatorial Guinea -0.614204956 0.025147432 -0.133019515 -0.478333553 0.120994542 0.21326746 0.186769814 0.375119134 0.227078549 -0.091894427
Eritrea -0.395745127 -0.751005998 -0.595594887 -0.780332701 -0.900704529 -1.028482721 -0.710932964 -0.671739377 -0.875969386 -0.789888279
Ethiopia -1.278531675 -1.43330208 -1.261059668 -1.655378629 -1.779854812 -1.833618454 -1.778485435 -1.728777392 -1.718293407 -1.633440638
Gabon 0.302849602 0.251509162 0.379093681 0.309237098 0.159172196 0.250710071 0.225270371 0.113561806 0.283533509 0.369881956
Gambia, The 0.727732799 0.343258757 0.22647055 0.257035008 -0.015218968 0.061433557 0.079188015 0.147894143 0.081571587 0.085538102
Ghana -0.253557775 -0.030763985 -0.002614194 0.172483987 0.054969382 -0.027866916 0.006186098 0.034180157 0.023118066 0.145379073
Guinea -1.552405811 -0.812337709 -1.048361136 -1.170816532 -1.889165234 -2.3750936 -2.100300456 -2.087547405 -1.687828915 -1.427564266
Guinea-Bissau -0.865033072 -0.529652503 -0.389144746 -0.564109778 -0.48764987 -0.446643296 -0.694282441 -0.653261382 -0.662831464 -0.702445428
Kenya -1.24574967 -1.275803288 -1.066881069 -1.262776138 -1.106995844 -1.265734257 -1.379173132 -1.439289025 -1.192408906 -1.306946379
Lesotho -0.170808488 0.078496115 0.38866608 0.02484973 -0.135717311 -0.390803745 -0.219485142 0.331473722 0.470169371 0.266734788
Liberia -2.285679498 -2.229934806 -1.403390744 -1.352679893 -1.308624566 -1.246134182 -1.278229275 -1.062456872 -0.458508809 -0.495252262
Libya -0.1709749 0.049203489 0.330881922 0.432819442 0.342832696 0.733789381 0.804670511 0.73220012 -0.052250757 -1.010474088
Madagascar -0.311795814 0.575536676 0.197019367 -0.059581297 0.168157645 0.072221162 -0.440673847 -0.824581072 -1.101677119 -0.882845559
Malawi -0.090997685 -0.030715317 0.086155216 0.07279523 0.109768957 0.059321829 -0.058517413 0.046200594 0.057753673 -0.070539809
Mali 0.295745086 0.247654484 0.492888418 0.195165916 0.349159791 0.186488303 0.165791189 -0.155193898 -0.282335558 -0.709878935
Mauritania 0.284680603 0.034867389 -0.076618081 -0.255641806 0.272333076 -0.215739716 -0.605379612 -1.035193969 -1.229687467 -1.186887342
Mauritius 1.042907058 0.990363305 0.970022344 1.000480822 0.767020117 0.862575456 0.889405246 0.619277056 0.539075446 0.875922355
Morocco -0.352463743 -0.40882305 -0.301698904 -0.545881022 -0.472514299 -0.510271877 -0.597189438 -0.533015486 -0.504065075 -0.467141241
Mozambique 0.113066328 0.188778215 -0.040633479 0.109941303 0.523459926 0.339389053 0.366039152 0.557976805 0.325442454 0.271904304
Namibia 0.075850075 0.412635191 0.636167764 0.592298844 0.786947736 1.022543822 1.185568323 0.845314767 0.739478382 0.890345381
Niger -0.239146504 0.032410279 -0.522494209 -0.473248235 -0.17329146 -0.407825413 -0.630457507 -1.110488249 -1.13444676 -0.881564338
Nigeria -1.693727091 -1.64185172 -1.715854435 -1.646725179 -1.986902761 -1.968121173 -1.814581906 -1.845787035 -2.084171197 -1.940095499
Rwanda -1.777997504 -1.158392879 -1.17374951 -0.9654836 -0.689943981 -0.319369186 -0.302281681 -0.472095565 -0.119754276 -0.047142644
Sao Tome and Principe 0.465753077 0.253011017 0.617454113 0.626672667 0.321601795 0.401405204 0.182694301 0.15273807 0.113380032 -0.048625863
Senegal -0.345767439 -0.285523938 -0.018771136 -0.218073915 -0.236336411 -0.210347996 -0.110119445 -0.162379409 -0.378610979 -0.306366735
Seychelles 0.827898025 0.631497523 0.675620539 0.94526384 0.926184252 0.817082829 0.774236456 0.623301492 0.888644798 0.974338406
Sierra Leone -0.828062105 -1.099704895 -0.427016365 -0.422079438 -0.252465732 -0.022114015 -0.205388573 -0.294484944 -0.237534432 -0.191376224
Somalia -2.531360744 -2.654197286 -2.925435289 -2.741130786 -2.788992896 -3.253806562 -3.318882261 -3.320775248 -3.112673728 -3.07332069
South Africa -0.319921015 -0.343221976 -0.125173751 -0.156717821 0.087614385 0.228956198 0.062748532 -0.113403103 -0.020164887 0.021086108
Sudan -1.878176529 -2.029412924 -1.593132787 -1.980058566 -2.110567859 -2.344634015 -2.474057818 -2.681106955 -2.690758591 -2.608841171
Swaziland 0.010263986 0.063767763 0.020155723 -0.374550577 -0.29751291 0.039427877 -0.083989249 -0.001513267 -0.043594713 -0.472405223
Tanzania -0.340763786 -0.86359356 -0.641462956 -0.566374362 -0.32034109 -0.353204063 -0.204857428 0.057099789 -0.03197695 -0.005437154
Togo -0.052316135 -0.243217557 -0.332358044 -1.478054006 -0.560392045 -0.362560621 -0.177205062 -0.184004002 -0.196460728 -0.23506084
Tunisia 0.065466167 0.307190773 0.128791457 0.03847822 0.270976944 0.212410772 0.134712422 0.195125276 0.10725173 -0.229772297
Uganda -1.491831489 -1.601714421 -1.296025292 -1.432040813 -1.240843796 -1.040568854 -0.974224887 -1.095896104 -1.117027977 -1.097750954
Zambia -0.363021567 0.136151433 0.134215944 0.052908821 0.361543927 0.349680179 0.461625197 0.561695341 0.488801415 0.473646255
Zimbabwe -1.606527586 -1.161451757 -1.287821598 -1.257964816 -0.841325562 -1.043904105 -1.152358604 -1.226427589 -1.185723626 -1.04177329
Average -0.630640226 -0.553887785 -0.492842535 -0.538828315 -0.473020417 -0.495185487 -0.50902162 -0.495709701 -0.533175517 -0.563719509
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment