D3 Examples - England Topojson

xxxxxxxxxx
 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
​
    <style>
    svg {   
        background: #9ecae1;
    }
        
    .mesh {
        fill:none;
        stroke: white;
        stroke-width: 0.5px;
        }
        
    .land {
        fill: #41ab5d;
    }
        
​
​
        
    </style>    
    <script src="https://d3js.org/d3.v4.min.js"></script>
    <script src="https://d3js.org/topojson.v1.min.js"></script> 
</head>
<body>
    
​
<script type="text/javascript">
        
    var width = 400;
    var height = 400;
​
    var svg = d3.select("body").append("svg")
    .attr("width", width)
    .attr("height", height);
​
    var projection = d3.geoMercator()
                         .center([-1.6,52.6])
                         .scale(2000)
                         .translate([width/2,height/2]);
    var path = d3.geoPath().projection(projection);
​
    var g = svg.append("g");
        
     d3.json("map.json", function(error, england) {
   
    g.insert("path", ".land")
        .datum(topojson.feature(england, england.objects.Clinical_Commissioning_Groups_April_2016_Super_Generalised_Clipped_Boundaries_in_England))
        .attr("class", "land")
        .attr("d", path);
        
    g.append("path")
           .datum(topojson.mesh(england, england.objects.Clinical_Commissioning_Groups_April_2016_Super_Generalised_Clipped_Boundaries_in_England, function(a, b) { return a !== b; }))
           .attr("class", "mesh")
           .attr("d", path);
});
​
​
</script>
</body>
​
    