d3 v5中quadtree.visit的行为是否不同?

时间:2019-05-01 19:39:28

标签: javascript d3.js

我正在将d3从v3.5.5转换为v5。我将浏览可用的旧功能,然后显示在新版本中遇到的问题。

这是起作用的旧功能

  circle
     .each(collide(.5))
     .style("fill", function(d) { return d.color; })
     .attr("cx", function(d) { return d.x; })
     .attr("cy", function(d) { return d.y; });
}


// Resolve collisions between nodes.
function collide(alpha) {

  var quadtree = d3.geom.quadtree(nodes);

  return function(d) {
    var r = d.radius + maxRadius + padding,
        nx1 = d.x - r,
        nx2 = d.x + r,
        ny1 = d.y - r,
        ny2 = d.y + r;
    quadtree.visit(function(quad, x1, y1, x2, y2) {

      if (quad.point && (quad.point !== d)) {
        var x = d.x - quad.point.x,
            y = d.y - quad.point.y,
            l = Math.sqrt(x * x + y * y),
            r = d.radius + quad.point.radius + (d.act !== quad.point.act) * padding;
        if (l < r) {
          l = (l - r) / l * alpha;
          d.x -= x *= l;
          d.y -= y *= l;
          quad.point.x += x;
          quad.point.y += y;
        }
      }
      return x1 > nx2 || x2 < nx1 || y1 > ny2 || y2 < ny1;
    });
  };
}

对象圆定义为

var circle = svg.selectAll("circle")
    .data(nodes)
    .enter().append("circle")

this是一个节点的例子。

这是我的v5新版本

除了将d3.geom.quadtree(nodes)替换为d3.quadtree(nodes)之外,我的新版本相同。我无法在quadtree.visit内部使用该函数。

所有需要的值(x1,x2,y1,y2)都存在于节点对象中。

quadtree.visit是否有不同的语法?

0 个答案:

没有答案