TOPOJSON from shapefile - OK Census tracts

A deeper exploration of TOPOJSON projections. (see previous) Now with census tract shapefiles taken from the Census Bureau.

<!DOCTYPE html>
<meta charset="utf-8">
	<style>
		.schooldistrict {
			fill: #bbb;
			stroke: #777;
		}

.schooldistrict:hover {
			fill: blue;
		}

.schooldistrict-border {
			fill: none;
			pointer-events: none;
		}

</style>
	<title>Oklahoma Census Tracts</title>
	<body>
		
<script src="https://d3js.org/d3.v3.min.js"></script>
<script src="https://d3js.org/topojson.v1.min.js"></script>

var projection = d3.geo.conicConformal()
		.parallels([37 + 34 / 60, 90 + 46 / 60])
		.rotate([98 + 00 / 60, -35 + 00 / 60])
		.translate([width / 2, height / 2]);

var path = d3.geo.path()
		.projection(projection);

var svg = d3.select("body")
		.append("svg")
		.attr("width", width)
		.attr("height", height);

d3.json("ok-censustract.json", function(error, ok) 
	{
		var tract = topojson
			.feature(ok, ok.objects.tract);

projection.scale(1).translate([0, 0]);

var b = path.bounds(tract), s = .95 / Math.max((b[1][0] - b[0][0]) / width, (b[1][1] - b[0][1]) / height), t = [(width - s * (b[1][0] + b[0][0])) / 2, (height - s * (b[1][1] + b[0][1])) / 2];

projection.scale(s).translate(t);

svg.selectAll("path")
		.data(tract.features.filter(
			function(d) 
				{
					return d.type;
				}))
				.enter()
				.append("path")
				.attr("class", "schooldistrict")
				.attr("d", path)
				.append("title")
				.text(function(d) 
				{
					return d.type;
				});

svg.append("path")
			.datum(topojson.mesh(ok, ok.objects.tract, function(a, b) 
			{
				return a !== b;
			}))
			.attr("class", "schooldistrict-border")
			.attr("d", path);
	});

d3.select(self.frameElement).style("height", height + "px");

</script>

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

Modified http://d3js.org/topojson.v1.min.js to a secure url

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

https://d3js.org/topojson.v1.min.js