Skip to content

Instantly share code, notes, and snippets.

@bessiec
Last active November 25, 2016 18:16
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 bessiec/e3a8246633669a209d00 to your computer and use it in GitHub Desktop.
Save bessiec/e3a8246633669a209d00 to your computer and use it in GitHub Desktop.
Knight Journalism Course: Loading CSV with D3 Module
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Loading CSV Data with D3 Knight Journalism Course</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.js"></script>
</head>
<body>
<script type="text/javascript">
var svg = d3.select("body")
.append("svg")
.attr("width", 500)
.attr("height", 800)
d3.csv("Water_Use_Average_By_Zipcode.csv", function(data) {
var rects = svg.selectAll("rect")
.data(data)
.enter()
.append("rect");
rects.attr("x", 0)
.attr("y", function(d, i) {
return i * 10;
})
.attr("width", function(d) {
return d.Hundred_Cubic_Feet_of_Use_Fiscal_Year_12_13 * 10;
})
.attr("height", 8)
.append("title")
.text(function(d) {
return d.Zip + "'s water use by Hundred Cubic Feet Fiscal Year 12/13 is " + d.Hundred_Cubic_Feet_of_Use_Fiscal_Year_12_13;
});
});
</script>
</body>
</html>
Zip Hundred_Cubic_Feet_of_Use_Fiscal_Year_05_06 Hundred_Cubic_Feet_of_Use_Fiscal_Year_06_07 Hundred_Cubic_Feet_of_Use_Fiscal_Year_07_08 Hundred_Cubic_Feet_of_Use_Fiscal_Year_08_09 Hundred_Cubic_Feet_of_Use_Fiscal_Year_09_10 Hundred_Cubic_Feet_of_Use_Fiscal_Year_10_11 Hundred_Cubic_Feet_of_Use_Fiscal_Year_11_12 Hundred_Cubic_Feet_of_Use_Fiscal_Year_12_13
90001 20 21 19 18 15 14 15 10
90002 20 21 19 18 17 16 17 11
90003 21 20 19 19 18 17 17 10
90004 41 42 39 38 35 34 34 18
90005 74 74 67 65 63 63 63 25
90006 47 47 45 44 42 41 41 11
90007 46 50 44 44 41 50 41 12
90008 23 24 23 22 20 19 20 10
90010 138 138 129 128 119 120 119 9
90011 24 24 23 23 21 20 21 11
90012 117 119 107 106 101 102 101 8
90013 59 59 58 58 54 55 57 5
90015 48 48 47 47 47 48 48 10
90016 21 22 20 19 18 18 18 10
90017 160 164 175 176 164 157 154 11
90018 23 23 22 21 19 19 19 10
90019 25 26 24 23 22 21 22 12
90020 98 99 93 90 84 82 82 37
90021 56 54 48 48 43 45 46 21
90023 33 33 30 29 27 27 28 10
90024 76 76 74 72 63 67 68 28
90025 41 42 41 39 35 33 33 11
90026 24 24 23 22 22 20 19 9
90027 49 53 48 47 39 40 41 17
90028 62 61 60 59 55 54 55 10
90029 42 42 40 39 36 35 35 10
90031 27 29 26 25 23 23 23 9
90032 19 19 18 18 16 16 16 10
90033 36 37 34 33 33 32 32 10
90034 30 31 30 28 26 26 26 12
90035 26 26 25 24 22 22 22 14
90036 37 39 36 35 32 33 34 16
90037 28 30 27 27 25 25 25 11
90038 42 43 40 39 35 34 34 10
90039 19 20 19 18 17 16 17 10
90041 18 19 18 17 15 15 15 11
90042 20 21 19 18 17 17 17 9
90043 15 16 15 14 13 13 13 9
90044 19 19 18 17 17 16 16 10
90045 33 35 33 32 27 29 29 12
90046 32 33 32 30 27 27 27 19
90047 13 14 13 13 12 11 11 9
90048 33 34 31 31 29 28 29 14
90049 42 46 43 41 36 35 36 30
90056 19 22 20 18 17 16 17 12
90057 102 103 95 95 91 90 91 9
90058 42 42 34 33 30 27 26 10
90059 22 22 22 20 19 17 17 11
90061 30 29 25 25 26 25 25 11
90062 16 17 16 15 15 14 14 10
90063 18 19 17 17 15 15 16 9
90064 25 27 25 24 21 21 22 14
90065 17 17 16 15 14 14 14 9
90066 20 21 19 18 17 16 17 11
90068 29 33 30 28 25 25 26 17
90069 40 42 40 39 36 35 36 25
90077 45 52 48 46 38 39 39 36
90094 79 79 81 87 86 90 88 9
90210 48 56 53 51 41 40 43 45
90212 37 51 56 55 50 26 42 70
90230 19 20 19 18 16 16 16 9
90232 37 38 38 36 32 31 31 6
90247 25 25 23 22 20 20 20 11
90248 28 27 26 25 20 21 23 10
90272 31 35 32 31 26 26 27 24
90275 12 15 12 11 10 9 9 9
90291 16 17 15 15 14 14 14 9
90292 34 35 35 35 33 32 33 9
90293 44 41 38 37 34 35 37 13
90305 14 15 14 12 11 11 12 12
90402 23 24 22 22 19 19 20 20
90405 6 7 7 6 7 6 7 7
90501 27 28 26 25 24 23 23 11
90710 26 27 26 25 24 23 24 11
90717 21 21 20 19 18 18 17 12
90731 31 29 35 34 24 22 23 10
90732 26 28 25 24 21 21 22 12
90744 70 79 84 83 73 74 66 11
91040 26 28 25 24 19 19 20 16
91042 20 21 20 18 16 15 16 12
91214 23 26 24 23 17 16 18 18
91302 62 66 58 65 55 52 44 36
91303 35 38 36 35 31 31 32 14
91304 35 38 36 34 28 28 29 20
91306 24 25 24 22 19 19 20 15
91307 24 26 25 23 18 18 20 18
91309 18 19 17 14 13 13 13 12
91311 38 42 39 37 30 30 32 23
91316 47 52 50 49 41 41 44 26
91324 37 40 37 35 30 30 31 22
91325 42 47 44 41 35 34 36 24
91326 32 36 33 31 25 25 27 21
91331 25 27 25 24 21 21 22 15
91335 25 27 25 24 21 20 21 14
91340 25 26 24 23 19 19 19 14
91342 32 36 34 32 27 26 36 16
91343 33 35 33 31 27 26 27 17
91344 28 31 29 27 22 21 23 20
91345 27 30 27 25 21 20 23 15
91352 39 42 41 40 32 31 35 15
91356 49 55 51 48 40 40 42 33
91364 32 36 32 30 25 25 26 22
91367 39 43 41 38 32 32 35 24
91401 29 31 29 28 24 24 25 16
91402 39 41 39 37 34 33 33 14
91403 31 35 32 31 26 26 27 20
91405 38 39 37 36 32 31 32 14
91406 53 55 45 43 37 35 35 14
91411 31 33 31 29 27 26 28 15
91423 31 34 32 30 26 26 27 20
91436 39 44 42 39 32 32 34 32
91504 39 42 41 39 34 33 34 14
91505 25 26 26 25 20 19 20 13
91601 27 29 27 26 24 24 24 13
91602 36 40 37 35 31 31 32 21
91604 34 36 34 32 29 29 29 21
91605 29 31 28 27 23 23 24 14
91606 30 31 29 27 24 23 24 14
91607 32 34 31 29 26 26 27 18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment