D3.js 为什么散点图和六点图的点接近度不同？

请查看Hexbin和散点图：

为什么在Hexbinplot中，点彼此不接触，而在scatterplot中，点清楚地接触到接近点

我原以为我的《赫克斯宾》情节是这样的：但事实并非如此

我正在使用d3.hexbin插件

除了一点点的缩放之外，从Hexbin图到散点图（我处理的是同一个数据集）唯一不同的代码是：

对于Hexbin：

 var color = d3.scale.linear()
                .range(["white", "steelblue"])
                .interpolate(d3.interpolateLab);

var hexbin = d3.hexbin()
               .extent([[0,0],[size - padding , padding]])
               .radius();

hexbin.x(function(d,i){return x(subdata[0][i]);})
hexbin.y(function(d,i){return y(subdata[0][i]);})

svg.append("clipPath")
    .attr("id", "clip")
    .append("rect")
    .attr("class", "mesh")
    .attr("width", w)
    .attr("height", size);

svg.append("g")
    .attr("clip-path", "url(#clip)")
    .selectAll(".hexagon")
    .data(hexbin(datum))
    .enter()
    .append("path")
    .attr("class", "hexagon")
    .attr("d", hexbin.hexagon())
    .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; })
    .style("fill", function(d) { return color(d.length); });    

对于散点图：

 svg.selectAll("circle")
.data(datum)
.enter()
.append("circle")
.style("fill", "steelblue")
.attr("cx", function (d, i) {
    return x(subdata[0][i]);
})
.attr("cy", function (d,i) {
    return y(subdata[0][i]);
})
.attr("r", 3)

我哪里做错了

Edit1:如果您设置了

.attr("d", hexbin.hexagon(5))
//radius value here ------^

…，只有在六边形生成器中设置相同的值时，六边形才会接触：

var hexbin = d3.hexbin()
    .radius(5)//same value here
    .extent([[0, 0], [width, height]]);

根据你的结果，我认为情况并非如此。因此，解决方案可以简单地删除该值：

.attr("d", hexbin.hexagon())
//no radius here --------^

---

嗨，Gerardo，即使做了指定的更改，它仍然没有更改。我将编辑的代码，包括半径部分也。我使用的是d3版本3，您必须在

var hexabin

中设置半径。是的，我设置了。我将var hexbin中的半径改为radius（10）和in.attr（“d”，hexbin.hexagon（10））…并且，我尝试了其他不同的组合…可能是我在代码中的其他地方做错了…？可能吧。最好的办法是使用fiddle/plunker/codepen/任何东西创建一个工作代码。我在这里创建了一个虚拟数据集：它向我显示了一个奇怪的hexbin错误。x不是我在ide中测试时没有得到的函数…我想我在这里做错了…我目前正在处理这个…谢谢，