d3.js - 使用 topojson 映射美国邮政编码时出错

Question

加载美国邮政编码 topojson 文件后，我在 d3.js 中遇到错误。 groupdata在这一行未定义:

  function bind(group, groupData) {
     var i, n = group.length, m = groupData.length, n0 = Math.min(n, m), updateNodes = new Array(m), enterNodes = new Array(m), exitNodes = new Array(n), node, nodeData;

错误为:

Uncaught TypeError: Cannot read property 'length' of undefined 

我正在调用和创建路径的代码是:

  d3.json("data/us-atlas/us-zipcodes.json", function(error, topology) {
  svg.selectAll("path")
      .data(topojson.feature(topology, topology.objects.zipcodes).features)
      .enter()
      .append("path")
      .attr("d", path)
  });

我从这个 repo 生成了 zipcode topojson 文件: https://github.com/mbostock/us-atlas .当我在加载时检查拓扑对象时，我在topology.objects.zipcodes 下看到了 32893 条弧。

我已经使用叶绿体示例成功加载了县 http://bl.ocks.org/mbostock/4060606并且正在使用类似的模式。

我使用的是 d3.js 版本 3.2.8 和 topojson.js 版本 1.2.3。

有任何想法吗？它是一个错误的邮政编码文件还是我称错了？

Answer 1

@Hugolpz - 抱歉，我没有回应。我没有收到您的评论通知。

我终于弄明白了。我在这里记录它，所以也许它会帮助某人。

我最初从美国人口普查网站获得了我的邮政编码 shapefile(目前由于政府关闭而关闭)。它被称为 tl_2012_us_zcta510.zip，大小为 836MB。我尝试使用这里建议的参数@mbostock 使用topojson 转换它:http://bl.ocks.org/mbostock/4965422

转换花费了 12 多个小时，为 node.js 提供了 6GB 的内存来将 shapefile 转换为 topojson 文件。它仍然无法在 d3.js 中工作(请参阅原始问题中的错误)。此外，调试如此大的 json 文件也很难调试。原始 shapefile 也不会显示在 QGIS 中。

我最终放弃并搜索了不同的数据集。 Geocommons 有一个 5MB 的邮政编码 shapefile，其中包含邮政编码、州、名称、人口和面积等属性:http://geocommons.com/overlays/54893 .我把它交给了 topojson，它在一分钟内转换了 shapefile:

topojson \
-p name=PO_NAME \
-p zip=ZIP \
-p state=STATE \
-o zips_us_topo.json \
zip_codes_for_the_usa.shp

为了检查json文件以了解它，我使用了 https://github.com/einars/js-beautify用这个命令:

js-beautify zips_us_topo.json -o zips_us_topo_pretty.json

我使用非美化版本在浏览器中加载，因为它更小。

为了映射它，我基本上使用了与@mbostock 的县叶绿体映射相同的代码。如果您需要该文件或 d3 代码或清理过的 topojson 文件，您可以在此处获取它们:

https://gist.github.com/jefffriesen/6892860

http://bl.ocks.org/jefffriesen/6892860