horizontal bar

[einaranjo]

hi
in my learning process, I am trying to create a horizontal bar chart.
But it comes out of vertical bars, can someone give me an idea what I'm doing wrong?

function createChart(campo, prefix, initial_value) {
  var input_chart = document.createElement("CANVAS");
  document.body.appendChild(input_chart);
  const ctx = input_chart.getContext('2d');
// <block:setup:1>
const glabels = ['ene','feb','mar','abr','may','jun','jul'];
const gdata = {
  labels: glabels,
  datasets: [{
    label: 'My First Dataset',
    data: [65, 59, 80, 81, 56, 55, 40],
    fill: false,
    backgroundColor: [
      'rgba(255, 99, 132, 0.2)',
      'rgba(255, 159, 64, 0.2)',
      'rgba(255, 205, 86, 0.2)',
      'rgba(75, 192, 192, 0.2)',
      'rgba(54, 162, 235, 0.2)',
      'rgba(153, 102, 255, 0.2)',
      'rgba(201, 203, 207, 0.2)'
    ],
    borderColor: [
      'rgb(255, 99, 132)',
      'rgb(255, 159, 64)',
      'rgb(255, 205, 86)',
      'rgb(75, 192, 192)',
      'rgb(54, 162, 235)',
      'rgb(153, 102, 255)',
      'rgb(201, 203, 207)'
    ],
    borderWidth: 1
  }]
};

// <block:config:0>
const gconfig = {
  type: 'bar',
  data: gdata,
  options: {
    indexAxis: 'y',
    // Elements options apply to all of the options unless overridden in a dataset
    // In this case, we are setting the border of each horizontal bar to be 2px wide
    elements: {
      bar: {
        borderWidth: 2,
      }
    },
    responsive: true,
    plugins: {
      legend: {
        position: 'right',
      },
      title: {
        display: true,
        text: 'Chart.js Horizontal Bar Chart'
      }
    }
  },
};
// </block:config>
  
  var myChart = new Chart(ctx, gconfig);
  return input_chart;

[einaranjo]

change to ver 3.2.1 and problem solve