Задания «группы» динамически в столбчатой ​​диаграмме c3js

Question

// взять этот код в качестве примера

Здесь я уточнил yvalue [0], yvalue [1] в группах .. Но я нужен общий дизайн, где я не знаю количество групп, которые мне нужно создать (т. е. количество сегментов), это зависит от данных json.

Рассмотрите этот пример здесь, у меня есть total, total1, поэтому у меня есть только 2 значения. Но если третья переменная say total2 указана в json, у меня должен быть сегмент для нее в моей гистограмме и так далее. выполняться без изменения групп каждый раз, когда поле добавляется. Есть ли способ достичь этого?

Благодаря

var datajson = [ { 
country : "china", 
total : 20, 
total1 : 10 
}, { 
country : "India", 
total : 40, 
total1 : 20 
}, { 
country : "aus", 
total : 10, 
total1 : 30 
}, { 
country : "nxz", 
total : 50, 
total1 : 40 
} 

    ]; 

    var xvalue; 
    var yvalue = []; 
    var i = 0; 

    var obj = datajson[0] 
    for (var key in obj) { 
     if (xvalue === undefined) 
      xvalue = key; 
     else { 
      yvalue[i] = key; 
      i++; 
     } 

    } 



    var chart = c3.generate({ 
     bindto : '#chart', 
     data : { 
      json : datajson, 

      type : 'bar', 
      keys : { 
       x : xvalue, // it's possible to specify 'x' when category axis 
       value : [yvalue[0],yvalue[1]], 
      }, 
      groups : [ [yvalue[0],yvalue[1]] ] 
     }, 
     bar : { 
      width : { 
       ratio : 0.3 
      // this makes bar width 50% of length between ticks 
      } 
     }, 
     axis : { 
      x : { 
       type : 'category' 

     }, 


     } 
    }); 

Answer 1

Ваш вопрос, кажется, большую часть ответа (вы уже генерировании yvalue массив из свойств объекта).

Вам просто не нужно указывать элементы по одному, вместо этого вы можете просто передать массив сразу, и все готово.

groups: [yvalue]