Utilizing the C3 chart library to showcase data in my project, I aim to display legends (labels) instead of numbers on the AxisX:
Data JSON format:
[
{"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}
]
My approach to achieve the desired outcome:
var chart = c3.generate({
bindto: '.ks-chart-orders-block',
data: {
url: '/Home/AbsencesByDepartementFiltredByReasons',
mimeType: 'json',
type:'bar',
keys:{
value: ['Aut','NoAut','CM']
},
}
}
});
Result obtained: https://i.sstatic.net/xjLcb.jpg Expected Result: https://i.sstatic.net/JZT3f.jpg