D3.js 如何填补dc.js系列图表中的空白？

我有以下dc.js：

var数据=[
{日期：1，服务：'ABC'，计数：100}，
{日期：2，服务：'ABC'，计数：80}，
{第4天，服务：'ABC'，计数：10}，
{日期：7，服务：'XYZ'，计数：380}，
{日期：8，服务：'XYZ'，计数：400}
];
var ndx=交叉滤波器（数据）；
var dim=ndx.dimension（函数（d）{return[d.service，d.day]；}）；
var grp=dim.group（）.reduceSum（函数（d）{return+d.count；}）；
var图表=dc.系列图表（“#图形”）
.宽度（620）
.身高（175）
.chart（函数（c）{返回dc.lineChart（c）.renderArea（true）；}）
.尺寸（dim）
.集团（grp）
.seriesAccessor（函数（d）{返回d.key[0]；}）
.keyAccessor（函数（d）{返回d.key[1]；}）
.x（d3.scaleLinear（）.domain（[1,8]））
.legend（dc.legend（）.水平（真）.x（80））
.render（）

包含。在本例中，您希望确保任何空值都用零填充，并且非常接近您想要的值

在这里，我对它进行了调整，将所需的BIN作为一个数组而不是参数，因为我们需要大量的BIN—所有服务和所有日期的BIN。方便地说，D3v4包含的内容正是为了实现这一目的

然后我们就用
制作的假组包装我们的组，确保\u group\u bins
然后我们就出发了

有趣的是，这暴露了一个关于您的数据的细节，而这个细节以前是模糊的-因为折线图只在有数据的地方绘制点，所以之前不清楚服务ABC/天3是否为零


功能确保组箱（源组箱）{
返回{
全部：函数（）{
var result=source_group.all（）.slice（0），//复制原始结果（我们不能修改它们）
发现={}；
结果.forEach（函数（d）{
发现[d.key]=true；
});
储物箱forEach（功能（d）{
如果（！找到[d]）
push（{key:d，value:0}）；
});
返回结果；
}
};
};
所需变量=d3.交叉（['ABC'，'XYZ']，d3.范围（1,8））；
风险值数据=[
{日期：1，服务：'ABC'，计数：100}，
{日期：2，服务：'ABC'，计数：80}，
{第4天，服务：'ABC'，计数：10}，
{日期：7，服务：'XYZ'，计数：380}，
{日期：8，服务：'XYZ'，计数：400}
];
var ndx=交叉滤波器（数据）；
var dim=ndx.dimension（函数（d）{return[d.service，d.day]；}）；
var grp=dim.group（）.reduceSum（函数（d）{return+d.count；}）；
grp=确保组箱（grp，需要）；
var图表=dc.系列图表（“#图形”）
.宽度（620）
.身高（175）
.chart（函数（c）{返回dc.lineChart（c）.renderArea（true）；}）
.尺寸（dim）
.集团（grp）
.seriesAccessor（函数（d）{返回d.key[0]；}）
.keyAccessor（函数（d）{返回d.key[1]；}）
.x（d3.scaleLinear（）.domain（[1,8]））
.legend（dc.legend（）.水平（真）.x（80））
.render（）
非常感谢，戈登。这可能是我迄今为止收到的最详细的答案。还感谢您编辑问题中的CSS问题：）