更新c3.js中的条形图数据

Question

I want to display only the 'data1' data. for that I am doing it with a timeout. but after it still shows me the values of 'data2'. How can I solve that?

https://jsfiddle.net/1q5zyftL/

  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

Use the unload() method to get rid of data by it's 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