jasondavies/.gitignore

## .gitignore
.DS_Store
build
node_modules

## README.md

      
    Raw
  

              README.md
            
          
    Using topojson.merge to merge states & provinces into a single feature from the Natural Earth 1:10,000,000 Admin 1 dataset.
Turning off pre-quantisation entirely avoids artefacts, and post-quantisation doesn’t affect the merge algorithm.

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

.graticule {
  fill: none;
  stroke: #777;
  stroke-opacity: .5;
  stroke-width: .5px;
  pointer-events: none;
}

.land {
  fill: #222;
  stroke: orange;
}

.border {
  fill: none;
  stroke: blue;
  stroke-width: 1px;
}

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

var width = 960,
    height = 960;

var projection = d3.geo.mercator()
    .scale(width / 2 / Math.PI)
    .translate([width / 2, height / 2])
    .precision(.1);

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

var graticule = d3.geo.graticule();

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

svg.append("path")
    .datum(graticule)
    .attr("class", "graticule")
    .attr("d", path);

d3.json("world.json", function(error, world) {
  svg.insert("path", ".graticule")
      .datum(topojson.merge(world, world.objects.states.geometries))
      .attr("class", "land")
      .attr("d", path);

  svg.insert("path", ".graticule")
      .datum(topojson.mesh(world, world.objects.states, function(a, b) { return a !== b; }))
      .attr("class", "border")
      .attr("d", path);
});

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

</script>

## Makefile
GENERATED_FILES = \
	world.json

all: $(GENERATED_FILES)

clean:
	rm -rf -- $(GENERATED_FILES)

.PHONY: all clean

build/ne_10m_%.zip:
	mkdir -p $(dir $@)
	curl -o $@ "http://www.nacis.org/naturalearth/10m/cultural/ne_10m_$*.zip"

build/ne_%_admin_1_states_provinces.shp: build/ne_%_admin_1_states_provinces_shp.zip
	mkdir -p $(dir $@)
	unzip -od $(dir $@) $<
	for file in $(dir $@)/ne_$*_admin_1_states_provinces_shp.*; do mv $$file $(dir $@)/ne_$*_admin_1_states_provinces"$${file#*_shp}"; done
	touch $@

world.json: build/ne_10m_admin_1_states_provinces.shp
	node_modules/.bin/topojson \
		-o $@ \
		--q0 0 \
		--q1 1e2 \
		--simplify-proportion .1 \
		-- states=$<

## package.json
{
  "name": "anonymous",
  "version": "0.0.1",
  "private": true,
  "dependencies": {
    "topojson": "1"
  }
}

## thumbnail.png

      
    Raw
  

              thumbnail.png
            
          
## world.json

      
Display the source blob

    
Display the rendered blob

    
    Raw
  

              world.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">
	<style>

	.graticule {
	fill: none;
	stroke: #777;
	stroke-opacity: .5;
	stroke-width: .5px;
	pointer-events: none;
	}

	.land {
	fill: #222;
	stroke: orange;
	}

	.border {
	fill: none;
	stroke: blue;
	stroke-width: 1px;
	}

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

	var width = 960,
	height = 960;

	var projection = d3.geo.mercator()
	.scale(width / 2 / Math.PI)
	.translate([width / 2, height / 2])
	.precision(.1);

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

	var graticule = d3.geo.graticule();

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

	svg.append("path")
	.datum(graticule)
	.attr("class", "graticule")
	.attr("d", path);

	d3.json("world.json", function(error, world) {
	svg.insert("path", ".graticule")
	.datum(topojson.merge(world, world.objects.states.geometries))
	.attr("class", "land")
	.attr("d", path);

	svg.insert("path", ".graticule")
	.datum(topojson.mesh(world, world.objects.states, function(a, b) { return a !== b; }))
	.attr("class", "border")
	.attr("d", path);
	});

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

	</script>
	GENERATED_FILES = \
	world.json

	all: $(GENERATED_FILES)

	clean:
	rm -rf -- $(GENERATED_FILES)

	.PHONY: all clean

	build/ne_10m_%.zip:
	mkdir -p $(dir $@)
	curl -o $@ "http://www.nacis.org/naturalearth/10m/cultural/ne_10m_$*.zip"

	build/ne_%_admin_1_states_provinces.shp: build/ne_%_admin_1_states_provinces_shp.zip
	mkdir -p $(dir $@)
	unzip -od $(dir $@) $<
	for file in $(dir $@)/ne_$_admin_1_states_provinces_shp.; do mv $$file $(dir $@)/ne_$_admin_1_states_provinces"$${file#_shp}"; done
	touch $@

	world.json: build/ne_10m_admin_1_states_provinces.shp
	node_modules/.bin/topojson \
	-o $@ \
	--q0 0 \
	--q1 1e2 \
	--simplify-proportion .1 \
	-- states=$<
	{
	"name": "anonymous",
	"version": "0.0.1",
	"private": true,
	"dependencies": {
	"topojson": "1"
	}
	}