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

Question

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

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

我从 Stackoverflow 得到了一些帮助:

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

Seems like a workaround is to assign ._rangeBandPadding(1) the composite chart. Though as mentioned in the github thread that breaks the bar sizes, so adding .gap(1) and .centerBar(true) to the bar chart got everything looking nice.

但之后我得到了这个输出

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

Answer 1

我无法解释为什么它会起作用，但是通过范围带和旧式 .gap(1) 的一些奇怪组合，我能够让它正确绘制。

诀窍是

        ._rangeBandPadding(1)

在综合图表上，以及

        .gap(1)
        .centerBar(true)

在子条形图上，几乎与原始问题中所述相同。因此，这本质上是先前问题和答案的重复，但我已将其应用于此分支中的 JSFiddle:

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

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