Exercise 3- horizontal bar chart, sorted

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>Exercise 3- Sorting Education data</title>
		<script type="text/javascript" src="https://d3js.org/d3.v3.min.js"></script>
		<link href='https://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
		<style type="text/css">
			
			body {background-color: white; font-family: Lato; margin-left:15px;; 
			}
			
			svg, div { background-color: #F9F1DD;
			}
			
			rect {fill: #94B2BD;}
			
		    h1, p {
		           position: relative;
		           left: 10px;
		           color: #333333;  }
				   
		div {text-align:center; width:315px; font-size:12px; font-weight:bold; padding-top:6px; padding-bottom:6px; }

</style>
	</head>
	<body>
		<script type="text/javascript">		
		d3.select("body").append("h1").text("Algebra Scores for U.S. 8th Grade Students by Race/ethnicity: 2013");
		var city = "San Diego";
		
		d3.select("body").append("div").text(city);
			var svg = d3.select("body")
						.append("svg")
						.attr("width", 315)
						.attr("height", 100);

d3.csv("gr4gr8_math_v3.csv", function(data) {

data = data.filter(function(d){return d.Year == 2013 && d.Grade == 8 && d.Measure=="algebra" && d.Jurisdiction == city });
										
					data.sort(function(a,b){return d3.descending(a.Score, b.Score)})

// Value labels
	var texts = svg.selectAll("text")
					.data(data)
					.enter()
					.append("text");

texts.attr("x", function(d) {
						return (+d.Score/1.2+3);
						})
						.attr("y", function(d, i) {
							return i * 25+15;
						})
						.attr("fill","#777777")
						.style("font-family", "Lato")
                    	.style("font-size", "12px")
						.text(function(d) { return d.Score;});

// Series labels
	var labels = svg.selectAll(".label")
					.data(data)
					.enter()
					.append("text")
					.attr("class","label");

labels.attr("x", 3) 
						.attr("y", function(d, i) {
							return i * 25+15;
						})
						.attr("fill","#ffffff")   
						.style("font-family", "Lato")
              		  	.style("font-size", "12px")
						.text(function(d) { return d.Race});
			});  
		</script>

</body>
</html>

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

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