block by bycoffe 5647635

5647635

Full Screen

index.html

<!doctype html>
<meta charset="utf-8">
<html>
  <head>

    <style type="text/css">

      path {
        stroke-width: 1;
        stroke: steelblue;
        fill: #eee;
      }
    </style>

  </head>

  <body>

    <div id="map"></div>

    <script src="d3.v3.js"></script>
    <script src="topojson.js"></script>

    <script>
      ;(function() {

          var width = 800,
              height = 800;

          d3.json("drought.json", function(err, data) {

            var drought = window.drought = topojson.feature(data, data.objects.drought);

            var map = d3.select('#map').append('svg')
                .style('width', width)
                .style('height', height);
             
            var path = d3.geo.path().projection(null);

            map.selectAll('path')
                .data(drought.features)
              .enter().append('path')
                .attr('d', function(d, i) {
                  return path(d);
                });

          });

      }());
    </script>

  </body>
</html>

bash

$ ogr2ogr -f 'ESRI Shapefile' -t_srs 'EPSG:4326' drought.shp usdm130521.shp
$ topojson --cartesian --width=800 --height=800 -p -o drought.json drought=drought.shp