Question

根据条形图上的长度，我在缩放图表时遇到了一些麻烦。例如，在jsfiddle中，我无法在大小为25的数据点之外绘制一个条。我知道解决这个问题的一种方法是使体的宽度和高度更大。但我认为缩放整个图形会更有效率，因此一个条形图最终看起来不会异常大。

http://jsfiddle.net/NkkDC/

我在想，我必须在这里扩展“y”功能，但我不确定如何。

bars.on("click", clickEvent)
    .transition().duration(2000).delay(200)
    .attr("y", function(d, i) { return i * 20; })
    .attr("width", x)
    .attr("height", 20);

提前致谢：）

Answer 1

每次添加新值时，xScale的输入域都会发生变化（因为您可以添加新的最大值），因此我们需要在重新渲染图表时重新计算xScale。在渲染函数中移动x-scale的声明应该可以解决这个问题：

    var xScale = d3.scale.linear()
.domain([0, d3.max(data)])
.range([0, 420]);

http://jsfiddle.net/NkkDC/1/

D3：根据数据点缩放图

1 个答案: