Skip to content

Instantly share code, notes, and snippets.

View yan2014's full-sized avatar

Joan yan2014

7 followers · 0 following
View GitHub Profile
@yan2014
yan2014 / index.html
Last active October 22, 2015 18:06
Week 4: Barchart
<!DOCTYPE html>
<!-- Modified version of Scott Murray's file from Knight D3 course -->
<html lang="en">
<head>
<meta charset="utf-8">
<title>Horizontal Bar - Dynamic Domain</title>
<link rel="stylesheet" type="text/css" href="main.css"> </head>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
<script src="http://labratrevenge.com/d3-tip/javascripts/d3.tip.v0.6.3.js"></script>
</head>
@yan2014
yan2014 / betterlifeindex.csv
Last active October 22, 2015 18:05
Week 5: X-Life satisfaction; Y-Years in education
We can make this file beautiful and searchable if this error is corrected: It looks like row 7 should actually have 25 columns, instead of 1. in line 6.
country,dwellingsWithoutBasicFacilities,housingExpenditure,roomsPerPerson,householdNetAdjustedDisposableIncome,householdNetFinancialWealth,employmentRate,jobSecurity,longTermUnemploymentRate,personalEarnings,qualityOfSupportNetwork,educationalAttainment,studentSkills,yearsInEducation,airPollution,waterQuality,consultationOnRuleMaking,voterTurnout,lifeExpectancy,selfReportedHealth,lifeSatisfaction,assaultRate,homicideRate,employeesWorkingVeryLongHours,timeDevotedToLeisureAndPersonalCare
Australia,1.1,20,2.3,31197,38482,72,4.4,1.06,46585,93,74,512,18.8,13,93,10.5,93,82,85,7.4,2.1,0.8,14.23,14.41
Austria,1,21,1.6,29256,48125,73,3.4,1.07,43837,95,82,500,16.9,27,95,7.1,75,81.1,69,7.5,3.4,0.5,8.61,14.46
Belgium,1.9,20,2.3,27811,78368,62,4.5,3.37,47276,91,71,509,18.8,21,84,4.5,89,80.5,74,7.1,6.6,1.2,4.41,15.71
Brazil,6.7,21,1.4,10310,6875,67,4.8,2.17,7909,90,43,402,16.3,18,67,4,79,73.4,69,7.2,7.9,25.5,10.74,14.97
Canada,0.2,22,2.5,30212,63261,72,6.6,0.9,44017,94,89,522,17,15,90,10.5,61,81,88,7.6,1.3,1.7,3.98,14.25
C
@yan2014
yan2014 / index.html
Last active October 22, 2015 18:04
Week 5: Bar chart with axises
<!DOCTYPE html>
<!-- Modified version of Scott Murray's file from Knight D3 course -->
<html lang="en">
<head>
<meta charset="utf-8">
<title>Horizontal Bar - Dynamic Domain</title>
<link rel="stylesheet" type="text/css" href="main.css"> </head>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
<script src="http://labratrevenge.com/d3-tip/javascripts/d3.tip.v0.6.3.js"></script>
@yan2014
yan2014 / index.html
Last active October 22, 2015 18:03
Week 5: Scatter plots
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Primary Education</title>
<link rel="stylesheet" type="text/css" href="main.css">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
</head>
<body>
<div>
@yan2014
yan2014 / index.html
Last active October 22, 2015 18:03
Week 5: Comparison
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Adding Labels</title>
<link rel="stylesheet" type="text/css" href="main.css">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
</head>
<body>
@yan2014
yan2014 / index.html
Last active October 22, 2015 18:01
Week 6: Scatter tooltips
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Primary Education</title>
<link rel="stylesheet" type="text/css" href="main.css">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
</head>
<body>
<div>
@yan2014
yan2014 / index.html
Last active October 22, 2015 18:01
Week 6: My Line Plot
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Primary Education</title>
<link rel="stylesheet" type="text/css" href="main.css">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
</head>
<body>
<div>
@yan2014
yan2014 / co2_emissions.csv
Last active October 22, 2015 18:00
Week 6: Labeled Lines
We can make this file beautiful and searchable if this error is corrected: It looks like row 3 should actually have 54 columns, instead of 27. in line 2.
countryName,countryCode,indicatorName,indicatorCode,1961,1962,1963,1964,1965,1966,1967,1968,1969,1970,1971,1972,1973,1974,1975,1976,1977,1978,1979,1980,1981,1982,1983,1984,1985,1986,1987,1988,1989,1990,1991,1992,1993,1994,1995,1996,1997,1998,1999,2000,2001,2002,2003,2004,2005,2006,2007,2008,2009,2010
Afghanistan,AFG,CO2 emissions (kt),EN.ATM.CO2E.KT,491.378,689.396,707.731,839.743,1008.425,1092.766,1283.45,1224.778,942.419,1672.152,1895.839,1532.806,1639.149,1917.841,2126.86,1987.514,2390.884,2159.863,2240.537,1760.16,1983.847,2101.191,2522.896,2830.924,3509.319,3142.619,3124.284,2867.594,2775.919,2676.91,2493.56,1426.463,1375.125,1320.12,1268.782,1199.109,1114.768,1056.096,832.409,781.071,645.392,359.366,583.053,733.4,1015.759,1338.455,1991.181,3927.357,6523.593,8236.082
Albania,ALB,CO2 emissions (kt),EN.ATM.CO2E.KT,2280.874,2464.224,2082.856,2016.85,2174.531,2552.232,2680.577,3072.946,3245.295,3744.007,4352.729,5643.513,5291.481,4345.395,4594.751,4950.45,5720.52,6494.257,7587.023,5170.47,7341.334,7308.331,7
@yan2014
yan2014 / index.html
Last active October 22, 2015 17:59
Week 7: Dots on Lines
<!DOCcountry html>
<head>
<meta charset="utf-8">
<style>
.graph .axis path {
fill: none;
stroke: #ccc;
shape-rendering: crispEdges;
}
@yan2014
yan2014 / ECD.csv
Last active October 22, 2015 17:59
Week 7: Transition Plot With Button
country AMale AFemale ASMale ASFemale CMale CFemale
Afghanistan 1 1 74 73 42 39
Albania 39 42 85 87 14 11
Argentina 61 66 83 85 9 8
Belarus 86 89 94 97 4 4
Belize 30 34 88 83 3 2
Bhutan 10 10 52 57 13 15
Bosnia and Herzegovina 12 14 95 96 2 2
Cameroon 29 31 64 61 30 32
Central African Republic 5 6 74 74 60 62