I have this example code and I wanted each set that contained 4 data, however I wanted each die to have a specific name example, in the first set I have, first class, second class, third class and fourth class, this repeats for the other sets, I want each label to have a different label , eg: first set with A, B, C and D, the second set is either 1,2,3,4 the third Q , W, E, and F, and so on. Follow the code.
<!-- Grafico Inicio -->
<canvas class="bar-charts"></canvas>
<!-- Grafico Final-->
<!-- Script para os Graficos-->
<script src="../js/Chart.js"></script>
<script src="../js/jquery.js"></script>
<script type="text/javascript">
var ctx = document.getElementsByClassName('bar-charts');
// Type, Date e options
var chartGraph = new Chart(ctx, {
type: 'bar',
data: {
labels: [" "," "," "," "," "," "," "," "],
datasets: [{
label: "Primeira Classe",
data: [2,4,7,24,3,14,22,19],
borderWidth: 5,
backgroundColor: 'rgba(77,166,253,0.85)'
},{
label: "Segunda Classe",
data: [2,4,7,24,3,14,22,19],
borderWidth: 5,
backgroundColor: 'rgba(77,166,253,0.85)'
},{
label: "Terceira Classe",
data: [2,4,7,24,3,14,22,19],
borderWidth: 5,
backgroundColor: 'rgba(77,166,253,0.85)'
},{
label: "Quarta Classe",
data: [2,4,7,24,3,14,22,19],
borderWidth: 5,
backgroundColor: 'rgba(77,166,253,0.85)'
}],
},
options: {
title:{
display:true,
text:"Chart.js Bar Chart - Stacked"
},
tooltips: {
mode: 'index',
intersect: false
},
responsive: true,
scales: {
xAxes: [{
stacked: true,
}],
yAxes: [{
stacked: true
}]
}
}
});
</script>