Question

我们以下面的图表http://c3js.org/samples/chart_bar.html为例但用以下数据替换列数据：

***************************************
***** ContainsExistsAnyShortRange *****
***************************************
List/Contains: 65ms
List/Exists: 106ms
List/Any: 222ms
Array/Contains: 20ms
Arrays do not have Exists
Array/Any: 281ms
HashSet/Contains: 0ms
***************************************
********* ContainsExistsAny ***********
***************************************
List/Contains: 120522ms
List/Exists: 250445ms
List/Any: 653530ms
Array/Contains: 40801ms
Arrays do not have Exists
Array/Any: 522371ms
HashSet/Contains: 3ms

我们看到我们有很多空格或ZERO值条，我们如何删除它并删除空白区域。（不要隐藏，我知道如何用CSS隐藏它）

Image example, what should be removed

Answer 1

在https://github.com/c3js/c3/issues/81中用Google搜索你需要将0替换为＆＃39; null＆＃39;并添加：

    line: {
     connectNull: true,
    },

var chart = c3.generate({
    data: {
        columns: [
            ['data1', 30, null, 100, null, 150, 250],
            ['data2', 130, null, 140, 200, null, 50]
        ],
        line: {
         connectNull: true,
        },
        type: 'bar'
    },
    bar: {
        width: {
            ratio: 0.5 // this makes bar width 50% of length between ticks
        }
        // or
        //width: 100 // this makes bar width 100px
    }
});

setTimeout(function () {
    chart.load({
        columns: [
            ['data3', 130, -150, 200, 300, -200, 100]
        ]
    });
}, 1000);

Answer 2

添加

line: {
     connectNull: true,
    }

在c3.generate块中。它将连接图表上的所有点/条/ ...，其间的值为零。它适用于null以及0。

从C3.js条形图中排除零值

2 个答案: