如何在dc.js图表中从X轴上删除周末日期

Question

如何在dc.js图表中从X轴上删除周末日期

d3.jsdc.jscrossfilter

3

我有从2018年1月份起每一天的数据，我正在创建一个堆叠折线图。由于每个周末的数据计数为零，因此每个周末都会在我的图表上显示一个下降（因为数据达到了零）。我想避免这种下降。我有一个日期列和一个星期几列。星期几列的值从1到7表示每周的每一天（1是星期一，7是星期日）。我可以修改我的x轴或图表以仅显示工作日的数据吗？ Fiddle

var data = [
 { Type: 'T', Date: "2018-01-01", DocCount: 10, Day: 1},
 { Type: 'E', Date: "2018-01-01", DocCount: 10, Day: 1},
 ...
]

chart
.height(350)
.width(450)
.margins({top: 10, right: 10, bottom: 5, left: 35})
.dimension(dateDim)
.group(tGroup)
.stack(eGroup, "E")
.valueAccessor( function(d) {
    return d.value.count;
})
.transitionDuration(500)
.brushOn(false)
.elasticY(true)
.x(d3.time.scale().domain([minDateTime, maxDateTime]))
.xAxis().ticks(10).tickFormat(d3.format("s"));

- Aayushi Jain

1个回答

阿里云服务器只需要99元/年，新老用户同享，点击查看详情

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，

- Gordon · Accepted Answer

时间轴始终会严格按照日期映射到x坐标，它没有“跳过日期”的概念。

相反，建议使用序数比例尺。使用序数比例尺，您可以精确地决定输入和输出值。 dc.js还会通过自动确定输入（域）值来帮助您。

要告诉图表使用序数比例尺，请执行以下操作：

chart
.x(d3.scale.ordinal())
.xUnits(dc.units.ordinal)

删除任何空日期，例如这样。 remove_empty_bins 来自常见问题解答，但我修改它以查看 count 元素。

function remove_empty_bins(source_group) {
    return {
        all:function () {
            return source_group.all().filter(function(d) {
                //return Math.abs(d.value) > 0.00001; // if using floating-point numbers
                return d.value.count !== 0; // if integers only
            });
        }
    };
}
var nz_tGroup = remove_empty_bins(tGroup),
    nz_eGroup = remove_empty_bins(eGroup);
chart
.group(nz_tGroup)
.stack(nz_eGroup, "E")

唯一的问题是，如果有一天没有任何数据怎么办？您仍然希望将其降至零吗？在这种情况下，我认为您可能需要修改上面的remove_empty_bins中的筛选器。

您的JSFiddle的分支。