javascript - 如何使用 c3 js 和 json 在图表上显示图例

Question

我正在使用 C3 图表来显示我的项目的一些数据，我想在 AcisX 中显示图例(在我的例子中为标签)而不是数字:

数据json格式:

[
    {"Label":"DQUA","Aut":3.75,"NoAut":3.75,"CM":32},
    {"Label":"DPRO","Aut":43.9,"NoAut":0,"CM":144},
    {"Label":"DMAI","Aut":1.6999999999999993,"NoAut":0,"CM":0},
    {"Label":"DENG","Aut":0,"NoAut":0,"CM":16}
] 

我尝试完成任务:

       var chart = c3.generate({
         bindto: '.ks-chart-orders-block',
         data: {
          url:  '/Home/AbsencesByDepartementFiltredByReasons',
          mimeType: 'json',
          type:'bar',
          keys:{
            value: ['Aut','NoAut','CM']
          },
         }
       }
     });

得到的结果: 预期结果:

Answer 1

您需要使用自定义类别修改 x 轴:

var chart = c3.generate({
     bindto: '.ks-chart-orders-block',

     data: {
      url:  '/Home/AbsencesByDepartementFiltredByReasons',
      mimeType: 'json',
      type:'bar',
      keys:{
        x: 'Label',
        value: ['Aut','NoAut','CM']
      },
     },

     axis: {
       x: {
         type: 'category',
         tick: {
           centered: true
         }
       }
     }
 });