NVD3 X轴订购错误(日期)

时间:2014-05-14 22:29:17

标签: d3.js nvd3.js

我试图想象两个系列,但当我将它们一起显示时,日期不再按顺序排列。

这是小提琴:http://jsfiddle.net/hohenheim/6R7mu/21/注意奇怪的x轴。

有没有办法在nvd3上修复x轴?

数据如下所示:

data1 = [{
      "date": 1396828800,
      "impressions": 49145385
  }, {
      "date": 1396915200,
      "impressions": 46704447
  } ....

1 个答案:

答案 0 :(得分:1)

NVD3" multiBarChart"使用序数(类别)比例,因此它只会按照它们添加到比例的顺序显示您给出的x值。因为您的两个系列仅在x轴上部分重叠,导致问题。

与其他NVD3图表类型不同,multiBarChart不会为您提供设置自己的比例的选项 - 它需要使用序数比例来为条形生成均匀的宽度。但是,您可以通过调用chart.xDomain(arrayOfXValues)来设置x域(每个栏使用的类别列表)。

数组需要是跨越数据的有序数组Date值。为了生成它,您需要d3 time intervals range functions。您可能还需要d3.extent function来查找最大值和最小值。