DC.js-复合图-线间填充

Question

我想知道是否有一种方法可以组成一个包含3条线的图表，以有效地围绕核心数据创建阈值/条带：

第1行显示了实际的核心数据点 第2行显示了在核心上方n处的上一行 第3行显示的是位于核心下方n处的下一行

Core数据将是没有区域填充的线，但我想填充2＆3之间的区域以显示核心后面的n。

我尝试添加其他行，并将下部的颜色设置为透明，但上部绘制了颜色。

speedSumGroup       = runDimension.group().reduceSum(function(d) {return d.Speed * d.Run;}),
  speedSumGroupUpper    = runDimension.group().reduceSum(function(d) {return (d.Speed * d.Run) + 1000;}),
  speedSumGroupLower = runDimension.group().reduceSum(function(d) {return (d.Speed * d.Run) - 1000;})
  ;

fiddle

编辑1 ： 使用堆积线将d3 StackLayout参数设置为order = Ascending / Offset = Expand来查看此fiddle。 现在的问题是，讨厌的剩余区域填充在底部。 我使用Expand的原因是因为它应用了正确的y值。 如果我能以某种方式使用Wiggle，但强迫数据在同一y轴上绘制而不是叠加，那么我们（几乎）就成为了赢家。