caged · December 19, 2015 14:09 · Jul 10, 2013 · May 13, 2013 · Feb 18, 2013 · Nov 23, 2012
diff --git a/index.html b/index.html
@@ -31,7 +31,8 @@
   svg.selectAll("path")
       .data(topojson.feature(topology, topology.objects.counties).features)
     .enter().append("path")
-      .attr("d", path);
+      .attr("d", path)
+      .on('click', function() { console.log(arguments) });
 });
 
 </script>
diff --git a/index.html b/index.html
@@ -15,7 +15,7 @@
 </style>
 <body>
 <script src="http://d3js.org/d3.v3.min.js"></script>
-<script src="http://d3js.org/topojson.v0.min.js"></script>
+<script src="http://d3js.org/topojson.v1.min.js"></script>
 <script>
 
 var width = 960,
@@ -29,7 +29,7 @@
 
 d3.json("/mbostock/raw/4090846/us.json", function(error, topology) {
   svg.selectAll("path")
-      .data(topojson.object(topology, topology.objects.counties).geometries)
+      .data(topojson.feature(topology, topology.objects.counties).features)
     .enter().append("path")
       .attr("d", path);
 });

diff --git a/index.html b/index.html
@@ -27,7 +27,7 @@
     .attr("width", width)
     .attr("height", height);
 
-d3.json("../4090846/us.json", function(error, topology) {
+d3.json("/mbostock/raw/4090846/us.json", function(error, topology) {
   svg.selectAll("path")
       .data(topojson.object(topology, topology.objects.counties).geometries)
     .enter().append("path")

diff --git a/thumbnail.png b/thumbnail.png
diff --git a/index.html b/index.html
@@ -15,7 +15,7 @@
 </style>
 <body>
 <script src="http://d3js.org/d3.v3.min.js"></script>
-<script src="topojson.js"></script>
+<script src="http://d3js.org/topojson.v0.min.js"></script>
 <script>
 
 var width = 960,

diff --git a/topojson.js b/topojson.js
@@ -1,63 +0,0 @@
-topojson = (function() {
-
-  function mesh(topology) {
-    var arcs = [], i = -1, n = topology.arcs.length;
-    while (++i < n) arcs.push([i]);
-    return object(topology, {type: "MultiLineString", arcs: arcs});
-  }
-
-  function object(topology, o) {
-    var tf = topology.transform,
-        kx = tf.scale[0],
-        ky = tf.scale[1],
-        dx = tf.translate[0],
-        dy = tf.translate[1],
-        arcs = topology.arcs;
-
-    function arc(i, points) {
-      if (points.length) points.pop();
-      for (var a = arcs[i < 0 ? ~i : i], k = 0, n = a.length, x = 0, y = 0, p; k < n; ++k) points.push([
-        (x += (p = a[k])[0]) * kx + dx,
-        (y += p[1]) * ky + dy
-      ]);
-      if (i < 0) reverse(points, n);
-    }
-
-    function line(arcs) {
-      var points = [];
-      for (var i = 0, n = arcs.length; i < n; ++i) arc(arcs[i], points);
-      return points;
-    }
-
-    function polygon(arcs) {
-      return arcs.map(line);
-    }
-
-    function geometry(o) {
-      o = Object.create(o);
-      o.coordinates = geometryType[o.type](o.arcs);
-      return o;
-    }
-
-    var geometryType = {
-      LineString: line,
-      MultiLineString: polygon,
-      Polygon: polygon,
-      MultiPolygon: function(arcs) { return arcs.map(polygon); }
-    };
-
-    return o.type === "GeometryCollection"
-        ? (o = Object.create(o), o.geometries = o.geometries.map(geometry), o)
-        : geometry(o);
-  }
-
-  function reverse(array, n) {
-    var t, j = array.length, i = j - n; while (i < --j) t = array[i], array[i++] = array[j], array[j] = t;
-  }
-
-  return {
-    version: "0.0.2",
-    mesh: mesh,
-    object: object
-  };
-})();

diff --git a/README.md b/README.md
@@ -1 +1 @@
-A demo of [TopoJSON](https://github.com/mbostock/topojson) on a U.S. counties shapefile from the U.S. census bureau.
+A demo of [TopoJSON](https://github.com/mbostock/topojson) on a U.S. counties shapefile from the U.S. census bureau. The same TopoJSON file can also be used to show [states](../4090848).
diff --git a/index.html b/index.html
@@ -2,12 +2,16 @@
 <meta charset="utf-8">
 <style>
 
-.stroke {
-  fill: none;
-  stroke: #000;
+path {
+  fill: #ccc;
+  stroke: #fff;
   stroke-width: .5px;
 }
 
+path:hover {
+  fill: red;
+}
+
 </style>
 <body>
 <script src="http://d3js.org/d3.v3.min.js"></script>
@@ -17,8 +21,6 @@
 var width = 960,
     height = 500;
 
-var color = d3.scale.category20c();
-
 var path = d3.geo.path();
 
 var svg = d3.select("body").append("svg")
@@ -29,13 +31,6 @@
   svg.selectAll("path")
       .data(topojson.object(topology, topology.objects.counties).geometries)
     .enter().append("path")
-      .attr("d", path)
-      .style("fill", function(d) { return color(d.id / 1000 | 0); })
-      .style("fill-opacity", function(d) { return ((d.id % 6) + 6) / 12; });
-
-  svg.append("path")
-      .datum(topojson.mesh(topology))
-      .attr("class", "stroke")
       .attr("d", path);
 });
 

diff --git a/README.md b/README.md
@@ -1 +1 @@
-A demo of [TopoJSON](https://github.com/mbostock/topojson) on a U.S. counties shapefile from the U.S. census bureau. The original GeoJSON file was 2.2M; the TopoJSON file is 660K, a reduction of 70.5%! (Or gzipped, a 71% reduction from 596K to 176K.)
+A demo of [TopoJSON](https://github.com/mbostock/topojson) on a U.S. counties shapefile from the U.S. census bureau.
diff --git a/index.html b/index.html
@@ -25,9 +25,9 @@
     .attr("width", width)
     .attr("height", height);
 
-d3.json("../4090846/us-counties.json", function(error, topology) {
+d3.json("../4090846/us.json", function(error, topology) {
   svg.selectAll("path")
-      .data(topojson.object(topology, topology.objects[0]).geometries)
+      .data(topojson.object(topology, topology.objects.counties).geometries)
     .enter().append("path")
       .attr("d", path)
       .style("fill", function(d) { return color(d.id / 1000 | 0); })

diff --git a/index.html b/index.html
@@ -31,7 +31,7 @@
     .enter().append("path")
       .attr("d", path)
       .style("fill", function(d) { return color(d.id / 1000 | 0); })
-      .style("fill-opacity", function(d) { return ((d.id % 10) + 2) / 12; });
+      .style("fill-opacity", function(d) { return ((d.id % 6) + 6) / 12; });
 
   svg.append("path")
       .datum(topojson.mesh(topology))

diff --git a/index.html b/index.html
@@ -30,7 +30,7 @@
       .data(topojson.object(topology, topology.objects[0]).geometries)
     .enter().append("path")
       .attr("d", path)
-      .style("fill", function(d) { return color(d.id % 1000); })
+      .style("fill", function(d) { return color(d.id / 1000 | 0); })
       .style("fill-opacity", function(d) { return ((d.id % 10) + 2) / 12; });
 
   svg.append("path")

diff --git a/index.html b/index.html
@@ -17,10 +17,7 @@
 var width = 960,
     height = 500;
 
-var color = d3.scale.linear()
-    .domain([0, 30000, 60000])
-    .range(["steelblue", "orange", "brown"])
-    .interpolate(d3.interpolateHcl);
+var color = d3.scale.category20c();
 
 var path = d3.geo.path();
 
@@ -33,7 +30,8 @@
       .data(topojson.object(topology, topology.objects[0]).geometries)
     .enter().append("path")
       .attr("d", path)
-      .style("fill", function(d) { return color(d.id); });
+      .style("fill", function(d) { return color(d.id % 1000); })
+      .style("fill-opacity", function(d) { return ((d.id % 10) + 2) / 12; });
 
   svg.append("path")
       .datum(topojson.mesh(topology))

diff --git a/index.html b/index.html
@@ -17,8 +17,12 @@
 var width = 960,
     height = 500;
 
-var formatId = d3.format("06d"),
-    path = d3.geo.path();
+var color = d3.scale.linear()
+    .domain([0, 30000, 60000])
+    .range(["steelblue", "orange", "brown"])
+    .interpolate(d3.interpolateHcl);
+
+var path = d3.geo.path();
 
 var svg = d3.select("body").append("svg")
     .attr("width", width)
@@ -29,12 +33,12 @@
       .data(topojson.object(topology, topology.objects[0]).geometries)
     .enter().append("path")
       .attr("d", path)
-      .style("fill", function(d) { return "#" + formatId(d.id); });
+      .style("fill", function(d) { return color(d.id); });
 
   svg.append("path")
       .datum(topojson.mesh(topology))
       .attr("class", "stroke")
       .attr("d", path);
 });
 
-</script>
+</script>
diff --git a/index.html b/index.html
@@ -25,9 +25,9 @@
     .attr("height", height);
 
 d3.json("../4090846/us-counties.json", function(error, topology) {
-  svg.append("path")
-      .datum(topojson.object(topology, topology.objects[0]))
-      .attr("class", "fill")
+  svg.selectAll("path")
+      .data(topojson.object(topology, topology.objects[0]).geometries)
+    .enter().append("path")
       .attr("d", path)
       .style("fill", function(d) { return "#" + formatId(d.id); });
 

diff --git a/index.html b/index.html
@@ -2,10 +2,6 @@
 <meta charset="utf-8">
 <style>
 
-.fill {
-  fill: #ccc;
-}
-
 .stroke {
   fill: none;
   stroke: #000;
@@ -21,7 +17,8 @@
 var width = 960,
     height = 500;
 
-var path = d3.geo.path();
+var formatId = d3.format("06d"),
+    path = d3.geo.path();
 
 var svg = d3.select("body").append("svg")
     .attr("width", width)
@@ -31,7 +28,8 @@
   svg.append("path")
       .datum(topojson.object(topology, topology.objects[0]))
       .attr("class", "fill")
-      .attr("d", path);
+      .attr("d", path)
+      .style("fill", function(d) { return "#" + formatId(d.id); });
 
   svg.append("path")
       .datum(topojson.mesh(topology))

diff --git a/index.html b/index.html
@@ -2,9 +2,14 @@
 <meta charset="utf-8">
 <style>
 
-path {
+.fill {
+  fill: #ccc;
+}
+
+.stroke {
   fill: none;
   stroke: #000;
+  stroke-width: .5px;
 }
 
 </style>
@@ -23,8 +28,14 @@
     .attr("height", height);
 
 d3.json("../4090846/us-counties.json", function(error, topology) {
+  svg.append("path")
+      .datum(topojson.object(topology, topology.objects[0]))
+      .attr("class", "fill")
+      .attr("d", path);
+
   svg.append("path")
       .datum(topojson.mesh(topology))
+      .attr("class", "stroke")
       .attr("d", path);
 });
 

diff --git a/README.md b/README.md
@@ -1,3 +1 @@
-A demo of [TopoJSON](https://github.com/mbostock/topojson) on a U.S. counties shapefile from the U.S. census bureau. The original GeoJSON file was 2.2M; the TopoJSON mesh is 436K, a reduction of 80.4%! (Or gzipped, a 80.1% reduction from 596K to 120K.)
-
-TopoJSON is a work in progress. Currently, it can produce a mesh but not yet reconstruct the source geometries. That capability will be coming shortly.
+A demo of [TopoJSON](https://github.com/mbostock/topojson) on a U.S. counties shapefile from the U.S. census bureau. The original GeoJSON file was 2.2M; the TopoJSON file is 660K, a reduction of 70.5%! (Or gzipped, a 71% reduction from 596K to 176K.)
diff --git a/topojson.js b/topojson.js
@@ -1,23 +1,63 @@
-var topojson = {
-  version: "0.0.1",
-  mesh: function(topology) {
-    var kx = topology.transform.scale[0],
-        ky = topology.transform.scale[1],
-        dx = topology.transform.translate[0],
-        dy = topology.transform.translate[1];
-    return {
-      type: "MultiLineString",
-      coordinates: topology.arcs.map(function(arc) {
-        var y0 = 0,
-            x0 = 0;
-        return arc.map(function(point) {
-          var x1 = x0 + point[0],
-              y1 = y0 + point[1];
-          x0 = x1;
-          y0 = y1;
-          return [x1 * kx + dx, y1 * ky + dy];
-        });
-      })
+topojson = (function() {
+
+  function mesh(topology) {
+    var arcs = [], i = -1, n = topology.arcs.length;
+    while (++i < n) arcs.push([i]);
+    return object(topology, {type: "MultiLineString", arcs: arcs});
+  }
+
+  function object(topology, o) {
+    var tf = topology.transform,
+        kx = tf.scale[0],
+        ky = tf.scale[1],
+        dx = tf.translate[0],
+        dy = tf.translate[1],
+        arcs = topology.arcs;
+
+    function arc(i, points) {
+      if (points.length) points.pop();
+      for (var a = arcs[i < 0 ? ~i : i], k = 0, n = a.length, x = 0, y = 0, p; k < n; ++k) points.push([
+        (x += (p = a[k])[0]) * kx + dx,
+        (y += p[1]) * ky + dy
+      ]);
+      if (i < 0) reverse(points, n);
+    }
+
+    function line(arcs) {
+      var points = [];
+      for (var i = 0, n = arcs.length; i < n; ++i) arc(arcs[i], points);
+      return points;
+    }
+
+    function polygon(arcs) {
+      return arcs.map(line);
+    }
+
+    function geometry(o) {
+      o = Object.create(o);
+      o.coordinates = geometryType[o.type](o.arcs);
+      return o;
+    }
+
+    var geometryType = {
+      LineString: line,
+      MultiLineString: polygon,
+      Polygon: polygon,
+      MultiPolygon: function(arcs) { return arcs.map(polygon); }
     };
+
+    return o.type === "GeometryCollection"
+        ? (o = Object.create(o), o.geometries = o.geometries.map(geometry), o)
+        : geometry(o);
+  }
+
+  function reverse(array, n) {
+    var t, j = array.length, i = j - n; while (i < --j) t = array[i], array[i++] = array[j], array[j] = t;
   }
-};
+
+  return {
+    version: "0.0.2",
+    mesh: mesh,
+    object: object
+  };
+})();
diff --git a/README.md b/README.md
@@ -1,3 +1,3 @@
-A demo of [TopoJSON](https://github.com/mbostock/topojson) on a U.S. counties shapefile from the U.S. census bureau. The original GeoJSON file was 2.2M; the TopoJSON mesh is 628K, a reduction of 72%! (Or gzipped, a 70% reduction from 596K to 176K.)
+A demo of [TopoJSON](https://github.com/mbostock/topojson) on a U.S. counties shapefile from the U.S. census bureau. The original GeoJSON file was 2.2M; the TopoJSON mesh is 436K, a reduction of 80.4%! (Or gzipped, a 80.1% reduction from 596K to 120K.)
 
 TopoJSON is a work in progress. Currently, it can produce a mesh but not yet reconstruct the source geometries. That capability will be coming shortly.
diff --git a/topojson.js b/topojson.js
@@ -3,13 +3,19 @@ var topojson = {
   mesh: function(topology) {
     var kx = topology.transform.scale[0],
         ky = topology.transform.scale[1],
-        x0 = topology.transform.translate[0],
-        y0 = topology.transform.translate[1];
+        dx = topology.transform.translate[0],
+        dy = topology.transform.translate[1];
     return {
       type: "MultiLineString",
       coordinates: topology.arcs.map(function(arc) {
+        var y0 = 0,
+            x0 = 0;
         return arc.map(function(point) {
-          return [point[0] * kx + x0, point[1] * ky + y0];
+          var x1 = x0 + point[0],
+              y1 = y0 + point[1];
+          x0 = x1;
+          y0 = y1;
+          return [x1 * kx + dx, y1 * ky + dy];
         });
       })
     };

diff --git a/topojson.js b/topojson.js
@@ -7,8 +7,8 @@ var topojson = {
         y0 = topology.transform.translate[1];
     return {
       type: "MultiLineString",
-      coordinates: topology.coordinates.map(function(lineString) {
-        return lineString.map(function(point) {
+      coordinates: topology.arcs.map(function(arc) {
+        return arc.map(function(point) {
           return [point[0] * kx + x0, point[1] * ky + y0];
         });
       })

diff --git a/thumbnail.png b/thumbnail.png
diff --git a/README.md b/README.md
@@ -1 +1,3 @@
-A demo of [TopoJSON](https://github.com/mbostock/topojson) on a U.S. counties shapefile from the U.S. census bureau. The original GeoJSON file was 2.2M; the TopoJSON mesh is 628K.  TopoJSON is still a work in progress. Currently, it can produce a mesh but not yet reconstruct the source geometries. That capability will be coming shortly.
+A demo of [TopoJSON](https://github.com/mbostock/topojson) on a U.S. counties shapefile from the U.S. census bureau. The original GeoJSON file was 2.2M; the TopoJSON mesh is 628K, a reduction of 72%! (Or gzipped, a 70% reduction from 596K to 176K.)
+
+TopoJSON is a work in progress. Currently, it can produce a mesh but not yet reconstruct the source geometries. That capability will be coming shortly.
diff --git a/README.md b/README.md
@@ -0,0 +1 @@
+A demo of [TopoJSON](https://github.com/mbostock/topojson) on a U.S. counties shapefile from the U.S. census bureau. The original GeoJSON file was 2.2M; the TopoJSON mesh is 628K.  TopoJSON is still a work in progress. Currently, it can produce a mesh but not yet reconstruct the source geometries. That capability will be coming shortly.
diff --git a/index.html b/index.html
@@ -22,7 +22,7 @@
     .attr("width", width)
     .attr("height", height);
 
-d3.json("../4090846/us-states.json", function(error, topology) {
+d3.json("../4090846/us-counties.json", function(error, topology) {
   svg.append("path")
       .datum(topojson.mesh(topology))
       .attr("d", path);

diff --git a/index.html b/index.html
@@ -22,7 +22,7 @@
     .attr("width", width)
     .attr("height", height);
 
-d3.json("../4090846/us-state-boundaries.json", function(error, topology) {
+d3.json("../4090846/us-states.json", function(error, topology) {
   svg.append("path")
       .datum(topojson.mesh(topology))
       .attr("d", path);

diff --git a/index.html b/index.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<style>
+
+path {
+  fill: none;
+  stroke: #000;
+}
+
+</style>
+<body>
+<script src="http://d3js.org/d3.v3.min.js"></script>
+<script src="topojson.js"></script>
+<script>
+
+var width = 960,
+    height = 500;
+
+var path = d3.geo.path();
+
+var svg = d3.select("body").append("svg")
+    .attr("width", width)
+    .attr("height", height);
+
+d3.json("../4090846/us-state-boundaries.json", function(error, topology) {
+  svg.append("path")
+      .datum(topojson.mesh(topology))
+      .attr("d", path);
+});
+
+</script>
diff --git a/topojson.js b/topojson.js
@@ -0,0 +1,17 @@
+var topojson = {
+  version: "0.0.1",
+  mesh: function(topology) {
+    var kx = topology.transform.scale[0],
+        ky = topology.transform.scale[1],
+        x0 = topology.transform.translate[0],
+        y0 = topology.transform.translate[1];
+    return {
+      type: "MultiLineString",
+      coordinates: topology.coordinates.map(function(lineString) {
+        return lineString.map(function(point) {
+          return [point[0] * kx + x0, point[1] * ky + y0];
+        });
+      })
+    };
+  }
+};
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		A demo of [TopoJSON](https://github.com/mbostock/topojson) on a U.S. counties shapefile from the U.S. census bureau.
		A demo of [TopoJSON](https://github.com/mbostock/topojson) on a U.S. counties shapefile from the U.S. census bureau. The same TopoJSON file can also be used to show [states](../4090848).
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		A demo of [TopoJSON](https://github.com/mbostock/topojson) on a U.S. counties shapefile from the U.S. census bureau. The original GeoJSON file was 2.2M; the TopoJSON mesh is 628K. TopoJSON is still a work in progress. Currently, it can produce a mesh but not yet reconstruct the source geometries. That capability will be coming shortly.