martgnz/.block

## .block
border: none
license: mit

## README.md

      
    Raw
  

              README.md
            
          
    Using d3.geo.albersUsa.

  
## index.html
<!DOCTYPE html>
<meta charset="utf-8" />
<body>
<script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="https://d3js.org/topojson.v1.min.js"></script>
<script src="https://unpkg.com/d3-geo-projection@0.2.16/d3.geo.projection.min.js"></script>
<script src="https://unpkg.com/rbush@1.4.3/rbush.js"></script>
<script src="https://unpkg.com/spamjs@1.1.0/spam.min.js"></script>

<script type='text/javascript'>
var width = 960;
var height = 500;

d3.json("us-states.json", function(error, d) {
  topojson.presimplify(d);

  var map = new StaticCanvasMap({
    element: "body",
    projection: d3.geo
      .albersUsa()
      .scale(1000)
      .translate([width / 2, height / 2]),
    data: [
      {
        features: topojson.feature(d, d.objects["states"]),
        static: {
          paintfeature: function(parameters, d) {
            parameters.context.lineWidth = 1;
            parameters.context.strokeStyle = "rgb(255,255,255)";
            parameters.context.fillStyle = "rgb(30, 30, 30)";

            parameters.context.stroke();
            parameters.context.fill();
          }
        }
      }
    ]
  });
  map.init();
});
</script>

## thumbnail.png

      
    Raw
  

              thumbnail.png
            
          
## us-states.json

      
Display the source blob

    
Display the rendered blob

    
    Raw
  

              us-states.json
            
          
      Loading

      Sorry, something went wrong. Reload?
      Sorry, we cannot display this file.
      Sorry, this file is invalid so it cannot be displayed.
      
          Viewer requires iframe.
	<!DOCTYPE html>
	<meta charset="utf-8" />
	<body>
	<script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>
	<script src="https://d3js.org/topojson.v1.min.js"></script>
	<script src="https://unpkg.com/d3-geo-projection@0.2.16/d3.geo.projection.min.js"></script>
	<script src="https://unpkg.com/rbush@1.4.3/rbush.js"></script>
	<script src="https://unpkg.com/spamjs@1.1.0/spam.min.js"></script>

	<script type='text/javascript'>
	var width = 960;
	var height = 500;

	d3.json("us-states.json", function(error, d) {
	topojson.presimplify(d);

	var map = new StaticCanvasMap({
	element: "body",
	projection: d3.geo
	.albersUsa()
	.scale(1000)
	.translate([width / 2, height / 2]),
	data: [
	{
	features: topojson.feature(d, d.objects["states"]),
	static: {
	paintfeature: function(parameters, d) {
	parameters.context.lineWidth = 1;
	parameters.context.strokeStyle = "rgb(255,255,255)";
	parameters.context.fillStyle = "rgb(30, 30, 30)";

	parameters.context.stroke();
	parameters.context.fill();
	}
	}
	}
	]
	});
	map.init();
	});
	</script>