如何使用带有 json 的 c3 js 在图表上显示图例

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
         }
       }
     }
 });

如何使用带有 json 的 c3 js 在图表上显示图例

How to show legends on chart using c3 js with json

javascript

charts

json

c3.js