c3.js 更新条形图数据

Question

我只想显示 'data1' 数据。为此，我正在超时进行。但在它仍然向我显示 'data2' 的值之后。我该如何解决？

  var data1=[['data1', 35, 205, 150, 100, 100, 200], ['data2', 130, 120, 130, 190, 100, 40]];

  var chart = c3.generate({
      data: {
          columns: [
              ['data1', 30, 200, 100, 400, 150, 250],
              ['data2', 130, 100, 140, 200, 150, 50]
          ],
          type: 'bar',
          labels:true
      },
      type: 'bar',

      bar: {
          width: {
              ratio: 0.5 // this makes bar width 50% of length between ticks
          }
      },
      axis: {
       rotated: true
      }
  });


  setTimeout(function () {
      chart.load({
          columns: [
             data1[0]
          ]
      });
  }, 1000);

Answer 1

使用 unload() 方法通过 ID 删除数据。

var data1=[['data1', 35, 205, 150, 100, 100, 200], ['data2', 130, 120, 130, 190, 100, 40]];

var chart = c3.generate({
    data: {
        columns: [
            ['data1', 30, 200, 100, 400, 150, 250],
            ['data2', 130, 100, 140, 200, 150, 50]
        ],
        type: 'bar',
        labels:true
    },
    type: 'bar',

    bar: {
        width: {
            ratio: 0.5 // this makes bar width 50% of length between ticks
        }
    },
    axis: {
     rotated: true
    }
});


setTimeout(function () {
    chart.unload({
        ids: ['data2']
    });
}, 1000);

Updated fiddle

c3.js 更新条形图数据

updating the data of bar chart in c3.js

javascript

d3.js

c3.js