通过.shp和TopoJSON显示纽约州与郡地图

Question

最终目标是显示具有县界的纽约州地图，然后将lat，lon点映射到其上。

这导致了两个主要问题：

1. 一般来说，topojson client API reference中提到的object参数应该是什么？例如topojson.mesh(topology, object, [filter])
2. 我可以提供哪些object和[filter]参数（或者我可以使用哪些其他方法）来正确显示纽约州县界？

获取.shp文件：

• 我从这个CIGUR下载中得到了NY州及其县的形状文件： http://cugir.mannlib.cornell.edu/bucketinfo.jsp?id=7865
• 具体来说，我在下载中使用了cty036.shp文件，您只能下载此特定文件here

查看.shp文件：

• 使用http://www.mapshaper.org
显示时，cty036.shp看起来不错

将.shp文件转换为TopoJSON ：

• 此.shp文件的TopoJSON版本是使用mapshaper.org的TopoJSON导出功能创建的。
• 我将此文件命名为cty036Topo.json，您可以下载我正在使用的文件here

使用D3显示TopoJSON文件：

• 我正在使用的代码......

  var width = 960,
  height = 500;
  
  var projection = d3.geo.mercator()
      .center([-74.875366, 42.88])
      .scale(4500)
      .translate([width / 2, height / 2])
  
  var path = d3.geo.path()
      .projection(projection)
  
  var svg = d3.select("#map").append("svg")
      .attr("width", width)
      .attr("height", height)
      .style("border", "1px solid black");
  
  d3.json("data/cty036Topo.json", function(error, ny) {
      if (error) return console.error(error);
      console.log(ny)
      svg.append("path")
         .datum(topojson.feature(ny, ny.objects.cty036))
         .datum(topojson.mesh(ny, ny.arcs, ))
         .attr("d", path);
  });
  

• 以上javascript在浏览器中生成以下NY地图：

尝试显示县界：

• 现在，尝试在回调中使用topojson.mesh来显示县界

  d3.json("data/cty036Topo.json", function(error, ny) {
      if (error) return console.error(error);
      console.log(ny)
      svg.append("path")
         .datum(topojson.mesh(ny))
         .attr("d", path);
  });
  



你可以看到这类似纽约州的县，但是不对。在此先感谢您的帮助！