mingderwang/.block

## .block
license: gpl-3.0

## .gitignore
.DS_Store
build
node_modules

## README.md

      
    Raw
  

              README.md
            
          
    Makefile modeled after the U.S. Atlas project.

  
## index.html
<!DOCTYPE html>
<meta charset="utf-8">
<style>

.tract {
  fill: #ccc;
}

.tract:hover {
  fill: orange;
}

.tract-border {
  fill: none;
  stroke: #333;
  stroke-linejoin: round;
  stroke-linecap: round;
}

</style>
<body>
<script src="//d3js.org/d3.v3.min.js"></script>
<script src="//d3js.org/topojson.v1.min.js"></script>
<script>

var width = 960,
    height = 700;

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

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

d3.json("ny.json", function(error, ny) {
  if (error) throw error;

  var tracts = ny.objects.tracts;

  // strip water counties
  tracts.geometries = tracts.geometries
    .filter(function(d) { return (d.id / 10000 | 0) !== 99; });

  svg.append("g")
    .selectAll("path")
      .data(topojson.feature(ny, tracts).features)
    .enter().append("path")
      .attr("class", "tract")
      .attr("d", path)
    .append("title")
      .text(function(d, i) { return d.id; });

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

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

</script>

## Makefile
GENERATED_FILES = \
	ny.json

all: $(GENERATED_FILES)

.PHONY: clean all

clean:
	rm -rf -- $(GENERATED_FILES) build

build/tl_2012_%_tract.zip:
	mkdir build
	curl -o $@ 'http://www2.census.gov/geo/tiger/TIGER2012/TRACT/$(notdir $@)'

build/tracts.shp: build/tl_2012_36_tract.zip
	rm -rf $(basename $@)
	mkdir -p $(basename $@)
	unzip -d $(basename $@) $<
	for file in $(basename $@)/*; do chmod 644 $$file; mv $$file $(basename $@).$${file##*.}; done
	rmdir $(basename $@)
	touch $@

ny.json: build/tracts.shp
	node_modules/.bin/topojson -o $@ --q0=0 --simplify=1 --projection='d3.geo.mercator().center([-75.819, 42.795]).scale(6193).translate([480, 350]).precision(0)' --id-property=TRACTCE -- $(filter %.shp,$^)

## ny.json

      
Display the source blob

    
Display the rendered blob

    
    Raw
  

              ny.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.
      
    
## package.json
{
  "name": "anonymous",
  "version": "0.0.1",
  "private": true,
  "devDependencies": {
    "d3": "3",
    "topojson": "1"
  }
}

## thumbnail.png

      
    Raw
  

              thumbnail.png
	<!DOCTYPE html>
	<meta charset="utf-8">
	<style>

	.tract {
	fill: #ccc;
	}

	.tract:hover {
	fill: orange;
	}

	.tract-border {
	fill: none;
	stroke: #333;
	stroke-linejoin: round;
	stroke-linecap: round;
	}

	</style>
	<body>
	<script src="//d3js.org/d3.v3.min.js"></script>
	<script src="//d3js.org/topojson.v1.min.js"></script>
	<script>

	var width = 960,
	height = 700;

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

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

	d3.json("ny.json", function(error, ny) {
	if (error) throw error;

	var tracts = ny.objects.tracts;

	// strip water counties
	tracts.geometries = tracts.geometries
	.filter(function(d) { return (d.id / 10000 \| 0) !== 99; });

	svg.append("g")
	.selectAll("path")
	.data(topojson.feature(ny, tracts).features)
	.enter().append("path")
	.attr("class", "tract")
	.attr("d", path)
	.append("title")
	.text(function(d, i) { return d.id; });

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

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

	</script>
	GENERATED_FILES = \
	ny.json

	all: $(GENERATED_FILES)

	.PHONY: clean all

	clean:
	rm -rf -- $(GENERATED_FILES) build

	build/tl_2012_%_tract.zip:
	mkdir build
	curl -o $@ 'http://www2.census.gov/geo/tiger/TIGER2012/TRACT/$(notdir $@)'

	build/tracts.shp: build/tl_2012_36_tract.zip
	rm -rf $(basename $@)
	mkdir -p $(basename $@)
	unzip -d $(basename $@) $<
	for file in $(basename $@)/; do chmod 644 $$file; mv $$file $(basename $@).$${file##.}; done
	rmdir $(basename $@)
	touch $@

	ny.json: build/tracts.shp
	node_modules/.bin/topojson -o $@ --q0=0 --simplify=1 --projection='d3.geo.mercator().center([-75.819, 42.795]).scale(6193).translate([480, 350]).precision(0)' --id-property=TRACTCE -- $(filter %.shp,$^)
	{
	"name": "anonymous",
	"version": "0.0.1",
	"private": true,
	"devDependencies": {
	"d3": "3",
	"topojson": "1"
	}
	}