试图修改Voronoi图在D3JS(Trying to modify Voronoi Map in

我想修改该D3例如与我的数据集使用

http://mbostock.github.io/d3/talk/20111116/airports.html

我想我的问题是创建计算的Voronoi多边形坐标的数组，但在这一点上我不知道。

我得到一个Uncaught TypeError: Cannot read property '0' of undefined指向行，其中我打电话的阵列错误。 该代码是活的，请看这里

http://cds.library.brown.edu/projects/mapping-genres/symbol-maps/brown-voronoi-map.html

该地图显示就好了，但数据分，单选按钮，沃罗诺伊线不出现（我不是想显示的数据点之间的线路，这样的代码已被删除）。

任何想法或建议，将最赞赏。 非常感谢！

Answer 1:

有许多的小东西会在这里可以很容易地整理出来，但有些人会需要一些工作。 第一个是你使用D3（V3）的新版本，你要复制的例子是旧版本。 已经有对事物的映射侧版本之间显著的变化。 所以，你可以使用旧版本的D3（V2将工作我认为）或调查的变化。

在Uncaught TypeError: Cannot read property '0' of undefined错误正在生成因为d3.geom.voronoi(positions)线正在生产的NaN。 我不是100％知道为什么，但你可以只过滤这些出去找一个临时的解决办法。 一个简单的过滤器会是这样的：

  g.append("svg:path")
      .attr("class", "cell")
      .attr("d", function(d, i) {
        if (polygons[i][0][0]) { 
          return "M" + polygons[i].join("L") + "Z";
          }
        })

与如果为真时，没有在多边形的第一个元素假值（NULL，NaN时，等）。 请注意，这是临时的解决办法，而你调查为什么你得到楠这不会产生正确的Voronoi多边形。

这些数据点的解决方法是很简单的，你只需要设置半径为东西大于0的10个这样的（虽然我想，你可能想点扩展到像TotalPublished您的数据的属性）。 比如看到最后一行：

circles.selectAll("circle")
      .data(locations.rows
      .sort(function(a, b) { return b.TotalPublished - a.TotalPublished; }))
    .enter().append("svg:circle")
      .attr("transform", function(d) { return "translate(" + projection(d.coordinates) + ")"; })
      .attr("r", 10);

的单选按钮（或复选框）不显示为它不是由JavaScript生成（尽管它可以）。 在这个例子中，你是指在本段中的html产生的：

<div style="position:absolute;bottom:0;font-size:18px;">
  <input type="checkbox" id="voronoi"> <label for="voronoi">show Voronoi</label>
</div>

一旦你通过这个工作，你需要得到工作沃罗诺伊线。 我觉得你的代码是沃罗诺伊行不会显示为复选框未选中。 所以，你可以发表评论本线，看看会发生什么。 一个快速提示与路径是，如果你想只显示线，你需要设置填充风格没有和行程，以任何你想要的颜色。 如果不填充设置为无，你会只看到一个黑色的屏幕。

文章来源: Trying to modify Voronoi Map in D3JS