gpt4 book ai didi

javascript - d3数据缩放问题

转载 作者:行者123 更新时间:2023-12-03 08:14:08 25 4
gpt4 key购买 nike

过了一段时间,我终于想出了如何在 d3 线性中缩放数据。但如果您查看以下屏幕截图,您可能会注意到数字似乎没有适当缩放: screenshot所以:例如4.55 和 16.2 的长度几乎相同,但它们不应该是这样的(而且当我在 0 到 565 之间缩放时,4 应该更靠近左侧)

这就是我创建线性比例的方法:

var scaledData = d3.scale.linear()
.domain(d3.extent(data, function(d){return d.Betrag;}))
.range([0, width-35]);

这就是我绘制条形的方式:

var bar = chart.selectAll("g")
.data(data)
.enter().append("g")
.attr("transform", function(d, i) { return "translate(0," + i * barHeight + ")"; });

bar.append("rect")
.attr("width", function(d) { return scaledData(Math.abs(Math.round(d.Betrag))); })
.attr("height", barHeight - 1);

bar.append("text")
.attr("x",function(d) { return scaledData(Math.abs(Math.round(d.Betrag)))+3; })
.attr("y", barHeight / 2)
.attr("dy", ".35em")
.text(function(d) { return Math.abs(d.Betrag); });
});

我在这部分尝试了不同的事情 scaledData(Math.abs(Math.round(d.Betrag))) 但无论我做什么,它都不会按照我的想法做应该...也许作为一个新手,我仍然不完全理解尺度的事情...我认为问题来自于我如何设置域。如果我用 [0,2000] 替换 d3.extend 函数,一切都很好......

最佳答案

您必须显示您的数据才能确定,但​​我认为您的数据中有负值,因此您的域看起来大约在 [-600, 1800] 之间。但是,当您计算宽度时,您首先取数据的绝对值,因此您的最低可能值为 0。解决方案位于 d3.extent 访问器函数中,以评估数据的绝对值(如果这实际上是您想要的) )。

关于javascript - d3数据缩放问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34024353/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com