Module Two Exercise

These code examples are my work for the course “Data Visualization and Infographics with D3,” taught by Alberto Cairo and Scott Murray, and offered through the Knight Center for Journalism in the Americas at UT Austin.

For this exercise, I'm using a dataset on food. It includes indicators on undernourishment, underweight children, food prices, food price volatility, diabetes rates and obesity rates.

This dataset combines data from three large organizations: Food and Agriculture Organization on the United Nations (FAO), International Labour Organization (ILO) and the World Health Organization (WHO).

I combined this data with a few basic indicators from the World Bank on the economic level of each country. As we work, I expect to add several more WB indicators on Aid levels, specifically for food, and political volatility levels.

The .raw data is just that. The standardized data controls for different scares in measuring the countries. The min/max rescaling method was used to generate re-scaled values of -=100 where 0 points is the minimum (best) and 100 points is the maximim (worst). So it's not really a ranking, but close to it conceptually.

For the purposes of this exercise, I only included countries with no missing data.

I'm interested in using this data to explore the patterns of hunger, issues of access, overconsumption, and misuse of resources.

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>Loading CSV Data with D3</title>
		<script type="text/javascript" src="https://d3js.org/d3.v3.js"></script>

svg {
				background-color: #808080;
			}

</style>
	</head>
	<body>

<text x="208" y="75" fill="charcoal" font-size="13" font-weight="bold" font-family="Times">If you see me do the happy dance of loaded data!</text>

//Load in contents of CSV file
			d3.csv("FoodDataFinal.csv", function(data) {

//Now CSV contents have been transformed into
				//an array of JSON objects.

//Log 'data' to the console, for verification.
				console.log(data);

});

</script>

</body>
</html>

Modified http://d3js.org/d3.v3.js to a secure url

https://d3js.org/d3.v3.js