rphaedrus/index.html

## index.html
<!DOCTYPE html>
<html>
	<head>
		<title>Module 3 Exercise (D30815: Data Visualization and Infographics with D3; August 17-September 27, 2015)</title>

		<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script>

		<style type="text/css">
			.svg-chart {
			    background-color: AliceBlue;
			};
		</style>
	</head>
	<body>
		<h1>Module 3</h1>

		<h2>Population of Nicollet Island, Minneapolis, MN: 1900 - 1940</h2>

		<script type="text/javascript">
			var w = 500,
				h = 100
				datafile = "married_by_gender.csv";


			var svg = d3.select("body")
						.append("svg")
						.attr("width", w)
						.attr("height", h)
						.attr("class", "svg-chart");


			d3.csv(datafile, function(error, dataMbG) {
				if (error) { return console.warn("We had an error: " + error); }

				// aggregate all the data to a population count by year
				var years = new Array();

				for(var i=0; i < dataMbG.length; i++ ) {
					var entry = dataMbG[i];
					var year = entry.YEAR;

					// if the year already exist in the years array, add the new year's population to that year
					// otherwise create a new object and push it onto the years array
					if (!years.some(function (oYear) {
						if(oYear.year == year) {
							oYear.population += +entry.count;
							// console.log("i: " + i + ", the year " + year + " now has " + oYear.population);
							return true;	// if this doesn't return true, it will just keep adding on entries.
						}
					})) {
						var newObj = { year: year, population: +entry.count }
						years.push(newObj);
						// console.log("i: " + i + ",New year for: " + year);
					}
					// console.log("Dealing with: " + JSON.stringify(entry,null,4) + " in year " + year);
				}

				// put the years in chronological order
				years.sort(function(a, b) {
					return d3.ascending(a.year, b.year);
				});

				// console.log(years);

				var rects = svg.selectAll("rect")
					.data(years)
					.enter()
					.append("rect");

				rects.attr("x", 0)
					.attr("y", function(d, i) {
						return i * 20;
					})
					.attr("width", function(d) {
						return d.population / 4 ;
					})
					.attr("height", 19)
					.append("title")
					.text(function(d) {
						return "The population of Nicollet Island in " + d.year + " was  " + d.population;
					});

			});
		</script>
	</body>
	</html>

## married_by_gender.csv

          
            YEAR
            SEX
            MARST
            count

            
              1900
              Female
              Divorced
              2

            
              1900
              Female
              Married
              256

            
              1900
              Female
              Single
              155

            
              1900
              Female
              Widowed
              61

            
              1900
              Male
              Married
              263

            
              1900
              Male
              Single
              320

            
              1900
              Male
              Widowed
              32

            
              1910
              Female
              Divorced
              3

            
              1910
              Female
              Married
              256

            
              1910
              Female
              Single
              123

            
              1910
              Female
              Widowed
              32

            
              1910
              Male
              Divorced
              3

            
              1910
              Male
              Married
              318

            
              1910
              Male
              Single
              658

            
              1910
              Male
              Widowed
              30

            
              1920
              Female
              Divorced
              9

            
              1920
              Female
              Married
              205

            
              1920
              Female
              Single
              57

            
              1920
              Female
              Widowed
              29

            
              1920
              Male
              Divorced
              16

            
              1920
              Male
              Married
              241

            
              1920
              Male
              Single
              420

            
              1920
              Male
              Widowed
              27

            
              1930
              Female
              Divorced
              7

            
              1930
              Female
              Married
              148

            
              1930
              Female
              Single
              35

            
              1930
              Female
              Widowed
              18

            
              1930
              Male
              Divorced
              12

            
              1930
              Male
              Married
              165

            
              1930
              Male
              Single
              372

            
              1930
              Male
              Widowed
              36

            
              1940
              Female
              Divorced
              10

            
              1940
              Female
              Married
              147

            
              1940
              Female
              Single
              23

            
              1940
              Female
              Widowed
              33

            
              1940
              Male
              Divorced
              17

            
              1940
              Male
              Married
              160

            
              1940
              Male
              Single
              512

            
              1940
              Male
              Widowed
              14
	<!DOCTYPE html>
	<html>
	<head>
	<title>Module 3 Exercise (D30815: Data Visualization and Infographics with D3; August 17-September 27, 2015)</title>

	<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script>

	<style type="text/css">
	.svg-chart {
	background-color: AliceBlue;
	};
	</style>
	</head>
	<body>
	<h1>Module 3</h1>

	<h2>Population of Nicollet Island, Minneapolis, MN: 1900 - 1940</h2>

	<script type="text/javascript">
	var w = 500,
	h = 100
	datafile = "married_by_gender.csv";


	var svg = d3.select("body")
	.append("svg")
	.attr("width", w)
	.attr("height", h)
	.attr("class", "svg-chart");



	d3.csv(datafile, function(error, dataMbG) {
	if (error) { return console.warn("We had an error: " + error); }

	// aggregate all the data to a population count by year
	var years = new Array();

	for(var i=0; i < dataMbG.length; i++ ) {
	var entry = dataMbG[i];
	var year = entry.YEAR;

	// if the year already exist in the years array, add the new year's population to that year
	// otherwise create a new object and push it onto the years array
	if (!years.some(function (oYear) {
	if(oYear.year == year) {
	oYear.population += +entry.count;
	// console.log("i: " + i + ", the year " + year + " now has " + oYear.population);
	return true; // if this doesn't return true, it will just keep adding on entries.
	}
	})) {
	var newObj = { year: year, population: +entry.count }
	years.push(newObj);
	// console.log("i: " + i + ",New year for: " + year);
	}
	// console.log("Dealing with: " + JSON.stringify(entry,null,4) + " in year " + year);
	}

	// put the years in chronological order
	years.sort(function(a, b) {
	return d3.ascending(a.year, b.year);
	});

	// console.log(years);

	var rects = svg.selectAll("rect")
	.data(years)
	.enter()
	.append("rect");

	rects.attr("x", 0)
	.attr("y", function(d, i) {
	return i * 20;
	})
	.attr("width", function(d) {
	return d.population / 4 ;
	})
	.attr("height", 19)
	.append("title")
	.text(function(d) {
	return "The population of Nicollet Island in " + d.year + " was " + d.population;
	});

	});
	</script>
	</body>
	</html>
YEAR	SEX	MARST	count
1900	Female	Divorced	2
1900	Female	Married	256
1900	Female	Single	155
1900	Female	Widowed	61
1900	Male	Married	263
1900	Male	Single	320
1900	Male	Widowed	32
1910	Female	Divorced	3
1910	Female	Married	256
1910	Female	Single	123
1910	Female	Widowed	32
1910	Male	Divorced	3
1910	Male	Married	318
1910	Male	Single	658
1910	Male	Widowed	30
1920	Female	Divorced	9
1920	Female	Married	205
1920	Female	Single	57
1920	Female	Widowed	29
1920	Male	Divorced	16
1920	Male	Married	241
1920	Male	Single	420
1920	Male	Widowed	27
1930	Female	Divorced	7
1930	Female	Married	148
1930	Female	Single	35
1930	Female	Widowed	18
1930	Male	Divorced	12
1930	Male	Married	165
1930	Male	Single	372
1930	Male	Widowed	36
1940	Female	Divorced	10
1940	Female	Married	147
1940	Female	Single	23
1940	Female	Widowed	33
1940	Male	Divorced	17
1940	Male	Married	160
1940	Male	Single	512
1940	Male	Widowed	14