D3 Examples - projected topojson

xxxxxxxxxx
 
<!DOCTYPE html>
<meta charset="utf-8">
    <style>
        html, body {
            margin: 0;
        }
    </style>
    <body>
​
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script src="https://d3js.org/d3.v3.min.js"></script>
    <script src="https://d3js.org/topojson.v1.min.js"></script>
​
    <script>
        ( function map() {
            var width = $(window).width(), height = width/2;
​
            var color = d3.scale.linear()
                .domain([1, 10])
                .range(["#fee8c8", "#e34a33"]);
​
            var path = d3.geo.path()
                .projection(null);
​
            var svg = d3.select("body")
                .append("svg")
                .attr("width", width)
                .attr("height", height);
​
            d3.json("censustracts-null.json", function(error, topo) {
​
                var censustract = topojson.feature(topo, topo.objects.tl_2014_40_tract)
​
                svg.append("g")
                    .attr("class", "censustracts")
                    .selectAll("path")
                    .data(censustract.features)
                    .enter()
                    .append("path")
                    .attr("class", "censustract")
                    .attr("d", path)
                    .style("fill", function() { return color(Math.floor((Math.random() * 10) + 1)); });
            });
​
        }) ()
​
    </script>
​
    