|
<!DOCTYPE html> |
|
|
|
<html lang="en"> |
|
<head> |
|
<meta charset="utf-8"> |
|
<title>Week1 homework chocolate data</title> |
|
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script> |
|
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.0.min.js"></script> |
|
</head> |
|
<body> |
|
|
|
<h1>Amount of chocolate consumed per person in 2011 by country in kilograms</h1> |
|
<p>This statistic depicts the amount of chocolate consumed per person in 2011, by country. |
|
In that year, each citizen of the United States consumed about 4.6 kilograms of chocolate.</p> |
|
|
|
<p class="csvdata"></p> |
|
|
|
<script> |
|
|
|
d3.select("body").append("h1").text("My Data"); |
|
|
|
var body = d3.select("body"); |
|
|
|
console.log("D3 Selection of body:", body); |
|
|
|
d3.csv("health.csv", function(mydata) { |
|
|
|
console.log("My first object:", mydata[0]); |
|
|
|
mydata.forEach(function (d) { |
|
body.append("p").text(d.Country + " " + d.Year2011 + " " + d.Year2013); |
|
|
|
}); |
|
}); |
|
|
|
</script> |
|
|
|
</body> |
|
</html> |
