James Eanes - VI4 - Identity as Color Hue
This simple example (based on the D3 tutorial) maps each entry in the dataset to a color, where the dataset is a subset of the colleges in the passing yards dataset.
xxxxxxxxxx
<html>
<head>
<meta charset="utf-8">
<title>VI4 - Identity as Color Hue</title>
<script type="text/javascript"
src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
</head>
<body>
<script type="text/javascript">
var w = 500;
var h = 50;
var dataset = [["Oregon","yellow"], ["Alabama","blue"],
["Baylor","orange"], ["Marshall","red"], ["Auburn","black"]];
var svg = d3.select("body")
.append("svg")
.attr("width",w)
.attr("height",h);
var circles = svg.selectAll("circle")
.data(dataset)
.enter()
.append("circle");
circles.attr("cx", function(d, i) {
return (i * 50) + 25;
})
.attr("cy", h/2)
.attr("r", 25)
.attr("fill", function(d) {
return d[1];
});
</script>
</body>
</html>