Lost column of bar chart in Chart.js

I display bar chart by chart.js but I get some problems. This is my data array data: [80, 81, 80, 64, 65, 80, 70, 75, 67, 85, 66, 50]. The last data value is 50 or 10 or 20 and it does not display ( Picture 1 ). If I change to 50.5 or 10.5, it can display but it is too small ( Picture 2 ). Anyone who knows my problem please help me. Thank you so much.

Here is my code :

//WidgetChart 5
    var ctx = document.getElementById("widgetChart5");
    if (ctx) {
      ctx.height = 220;
      var myChart = new Chart(ctx, {
        type: 'bar',
        data: {
          labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
          datasets: [
            {
              label: "My First dataset",
                  data: [80, 81, 80, 64, 65, 80, 70, 75, 67, 85, 66, 50.5],
              borderColor: "transparent",
              borderWidth: "0",
              backgroundColor: "#ccc",
            }
          ]
        },
        options: {
          maintainAspectRatio: true,
          legend: {
            display: false
          },
          scales: {
            xAxes: [{
              display: false,
              categoryPercentage: 1,
              barPercentage: 0.75
            }],
            yAxes: [{
              display: false
            }]
          }
        }
      });
    }

Picture 1 : The last data value ( 50 ) does not display

Picture 2 : Now if change to 50.5 it is still too smal