The last column value does not hide. When I hide the seller 4 the chart does not hide the values of the seller
<!DOCTYPE HTML>
<html lang="pt-br">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/Chart.js"></script>
</head>
<body>
<div>
<canvas id='grafico' style='width:100%;height:350px;'></canvas>
</div>
<script>
var ctx = document.getElementById('grafico');
var ctx = document.getElementById('grafico').getContext('2d');
var data = {
labels: [
"Janeiro",
"Fevereiro",
"Março",
],
datasets: [
{
label: "Vendedor 1",
backgroundColor: 'rgba(64, 126, 192, 1)',
data: [10, 49, 80],
},
{
label: "Vendedor 2",
backgroundColor: 'rgba(99, 171, 99, 1)',
data: [20, 39, 50],
},
{
label: "Vendedor 3",
backgroundColor: 'rgba(255, 226, 151, 1)',
data: [35, 29, 20],
},
{
label: "Vendedor 4",
backgroundColor: 'rgba(188, 86, 86, 1)',
data: [45, 19, 10],
}
]
};
var chart_pagamento = new Chart(ctx, {
data: data,
type: 'bar',
options:{
scaleShowVerticalLines: false,
responsive: false,
title: {
display: true,
text: 'Solicitações tratadas - SLA'
},
legend: {
display: true,
position:'bottom',
},
scales:{
display:true,
gridLines : {
display : false
},
yAxes: [
{
position: 'left',
ticks: {
min: 0,
},
gridLines : {
display : false
}
},
],
xAxes: [{
gridLines : {
//display : false
},
}]
},
animation: {
duration: 0,
onComplete: function () {
var ctx = this.chart.ctx;
ctx.font = Chart.helpers.fontString(Chart.defaults.global.defaultFontSize, 'bold', Chart.defaults.global.defaultFontFamily);
ctx.fillStyle = this.chart.config.options.defaultFontColor;
ctx.textAlign = 'center';
ctx.textBaseline = 'bottom';
this.data.datasets.forEach(function (dataset) {
for (var i = 0; i < dataset.data.length; i++) {
var model = dataset._meta[Object.keys(dataset._meta)[0]].data[i]._model;
ctx.fillText(dataset.data[i], model.x, model.y - 5 );
}
});
}
}
},
});
</script>
</body>
</html>