.elasticX（true）无法使用dc.js [英] .elasticX(true) doesn't work dc.js

问题描述

我有一个复合线路图

.elasticX（true）无法正常工作：/有人可以帮助我

The .elasticX(true) does not work :/ Could Someone help me

var composite = dc.compositeChart("#durationline-chart");
    composite.width(1500).height(350)
        .group(Durations)
        .brushOn(true)
        .yAxisLabel("Duration")
        .x(d3.scale.ordinal())
        .xUnits(dc.units.ordinal)
        .margins({ top: 10, left: 50, right: 10, bottom: 50 })
        .elasticY(true)
        .elasticX(true)
        .renderlet(function(chart) {
                chart.selectAll("g.x text")
                    .attr('transform', "rotate(+20)");
            })
        .compose([
            dc.lineChart(composite)
                .group(Testcase_Time, "Time")
                .colors('#1E90FF'),
            dc.lineChart(composite)
                .group(Testcase_Smartkey, "Smartkey")
                .colors('red')]);

编辑：这是jsfiddle： https://jsfiddle.net/gordonwoodhull/o9xx3fmm/

Here is the jsfiddle: https://jsfiddle.net/gordonwoodhull/o9xx3fmm/

推荐答案

我认为您的意思是，图表过滤后弹性没有发挥作用。

I think you mean the elastic is not kicking in when the chart is filtered.

这是因为交叉过滤器在箱为空的情况下仍会返回箱-它们的值为零。因此dc.js仍然会检测所有垃圾箱的域，包括空垃圾箱。

This is because crossfilter still returns bins if they are empty - they just have value zero. So dc.js still detects the domain of all the bins, including the empty ones.

您可以做的是使用假组删除空垃圾箱

What you can do is use a fake group to remove the empty bins

function remove_empty_bins(source_group) {
    return {
        all:function () {
            return source_group.all().filter(function(d) {
                return d.value != 0;
            });
        }
    };
}


var filtered_group = remove_empty_bins(group);

chart.dimension(dim)
    .group(filtered_group)
    ...

然后dc.js将仅检测非零值的域。 在常见问题解答中。

Then dc.js will detect only the domain of non zero values. More details in the FAQ.

您必须将此值应用于构成图表的所有组。

You have to apply this to all groups that make up the chart.

这篇关于.elasticX（true）无法使用dc.js的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！