问题与d3投影albers生成方格的地图

时间:2014-07-20 04:40:18

标签: d3.js topojson

我正在将Bostock的US Atlas(未经过滤的us-states shp文件)中的地图文件转换为topojson。我最终得到了这张地图。有谁知道为什么?

enter image description here

我的投影代码:     var svg = d3.select(“#interactive”)。insert(“svg”)     .attr(“width”,w)     .attr(“height”,h);

var projection = d3.geo.albers().scale([600]);

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

d3.json("us-states.json", function(error, us) {
  if (error) return console.error(error);

  svg.append("path")
      .datum(topojson.mesh(us))
      .attr("d", path);
});

我尝试过的原始文件(做同样的事情):1 2, 转换后的文件:1 2

1 个答案:

答案 0 :(得分:2)

事实证明这就是应该做的事情!

有两个修复程序。

要显示边框,我们可以保留当前代码,但是我们需要将填充设置为none,并且只需设置边框样式。这样的事情有效:

.states_borders{
stroke: #00001d;
  stroke-width: .5px;
  fill: white;
   /* stroke-dasharray: 1,1;  */
  stroke-linejoin: round;
  stroke-linecap: round;
}

要正确显示状态本身,我们需要使用topojson.feature来构建数据对象。