带有不同y轴/刻度的分组条形图

时间:2012-04-12 10:23:20

标签: javascript d3.js

我正在尝试创建一个包含70个样本和2个系列的分组条形图。与此示例类似:

http://bl.ocks.org/882152

然而,一个系列是[0 ... 1]而另一个系列是[0 ... 1.000.000]。我不能用我的数字重新创建这个例子。

我也没有真正得到这个例子。不应该是切换的变量,即x - > y,y0 - > x0和y1 - > X0?或者它们不代表x轴和y轴?

感谢的!

编辑:

这是一个演示我的问题的示例(在控制台中查看)。 http://jsfiddle.net/kQSGF/3/

1 个答案:

答案 0 :(得分:2)

问题似乎来自比例定义:

var x = d3.scale.linear().domain([0, 1]).range([h, 0]);

域名设置为[0,1],但只有您的第一个数据系列实际上属于该范围。 您可以考虑将域设置为数据范围,并反转输出范围,以便它显示数据中的值而不是“非”值数量作为条形码:

var x = d3.scale.linear().domain(d3.extent(d3.merge(data))).range([0,h]);

请注意,您仍然不太可能看到较小的数据系列,因为数据范围差异很大