D3.js scale:返回一个常量和一个scale的值中较小的一个?

时间:2013-04-10 16:48:48

标签: javascript d3.js

我在条形图中使用了D3序数量表:

var y = d3.scale.ordinal().rangeRoundBands([0, height], .1);

我这样称呼它来定位一些g元素,我的条形图中的每个条形图都有一个元素:

var barEnter = bar.enter()
  .insert("g", ".axis")
  .attr("class", "bar")
  .attr("transform", function(d, i) {
    return "translate(0," + (y(d.State) + height) + ")";
  });

当有很多条形时它很有效,因为它们均匀分布。

enter image description here

然而,它有效,但只有几个条形时看起来不那么好:

enter image description here

有没有办法可以修改y函数或transform属性,以便在只有几个条形图时更明智地设置transform?我不完全理解序幕规模在幕后的作用。

1 个答案:

答案 0 :(得分:0)

为了别人的利益,我就是这样解决的。

我意识到当y scale的域中只有几个元素时就会出现问题。所以我最终填充了scale的域名,如下所示:

if (ydomain.length < 12) {
  for (var i = ydomain.length; i < 12; i++) {
    ydomain.push('y_' + i);
  }
}
y.domain(ydomain);

我怀疑这是最优雅的做事方式,但它确实奏效了。