Chartjs-Chart.js bar chart coming up as blank with smaller datasets

by

1👍

✅

You missed labels array in the data. You have to define labels (same length of data). And you can see the results.
(Hint: I suggest that set maintainAspectRatio as true)

Here is the working example:

const data = [0,0,0,1,0,0,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]


const charts = document.getElementById("chart1");
  new Chart(
    charts,
    {
      type: 'bar',
      data: {
        labels: Array.from('x'.repeat(data.length-1)), // you can five any labels array you want
        datasets: [
          {
            label: 'Conversions',
            data: data
          }
        ]
      },
      options: {
        scales: {
          y: {
            beginAtZero: true,
            suggestedMin: 0,
            suggestedMax: 1
          },
        }
      }
    }
  );

Leave a comment