Question

我有一个简单的多线图，每个数据点都有圆圈。我已编码能够禁用一条或多条可更新Y轴的线。例如，如果我删除Y轴上具有最高值的行，则Y轴将重绘以更新比例。发生这种情况时，线条也会更新到新的比例，但我无法让圈子用线条更新它们的位置。

以下是相关位：

var y = d3.scale.linear().range([height, 0]);
var yAxis = d3.svg.axis()
      .scale(y)
      .orient("left");
y.domain(d3.extent(data, function(d) { return d.pfcLevel; }));

这是更新Y轴（工作）的功能：

function rescaleY() {
    y.domain([0, getMaxY()]);
    svg.select(".y").transition()
        .duration(1000).ease("sin-in-out")
        .call(yAxis);
}

以下是更新行（作品）的功能：

function updateLines() {
    svg.selectAll(".line")
        .transition().duration(500)
        .delay(function(d, i) { return i * 20; })
        .attr("d", function(d) {
            return line(d.values);
        });
}

这是更新圆圈位置（不工作）的功能：

function updateCircles() {
     svg.selectAll(".circle")
         .transition().duration(500)
         .delay(function(d, i) { return i * 10; })
         .attr("cy", function(d, i) { return y(d.pfcLevel) });
}

Answer 1

类circle的元素是g元素，它们没有cy属性。选择器应该是：

svg.selectAll(".circle circle")
  .transition().duration(500)
  ...

d3在y轴更新时移动圆圈

1 个答案: