DC.js复合图表在条形图中心对齐折线图的点

时间:2015-10-21 18:58:59

标签: dc.js

我正在尝试创建一个复合图表,我的要求是绘制条形图,折线图和虚线图。为此,我绘制了一张复合图表。现在我有条形图点开始从条形图开始的问题,但是我需要从线的中心开始。

您可以在this JSFiddle中看到问题。

Composite Chart with line chart points on start of bar

我从Stackoverflow得到了一些帮助:

Align points in centre of bars (DC.JS composite chart)

  

似乎一种解决方法是分配._rangeBandPadding(1)复合图表。虽然在github线程中提到了打破条形大小,但是在条形图中添加.gap(1)和.centerBar(true)使一切看起来都很好。

但之后我得到了这个输出

[http://jsfiddle.net/nauman3128/nr0rgzvc/9/][2]

After implementing found solution

1 个答案:

答案 0 :(得分:4)

我无法解释为什么会有效,但是通过范围乐队和旧式.gap(1)的奇怪组合,我能够正确地绘制它。

诀窍是

        ._rangeBandPadding(1)
复合图表上的

        .gap(1)
        .centerBar(true)
儿童条形图上的

,与原始问题中的说法非常相似。所以这基本上是早期问题和答案的重复,但我已经在这个分支中将它应用到你的JSFiddle:

http://jsfiddle.net/gordonwoodhull/nr0rgzvc/22/

此外,为子条形图设置barPadding非常重要 。所以我们正在使用复合带的范围布局,以及条形图的经典间隙填充,这听起来是一个非常糟糕的主意......但输出看起来还不错!