Chartjs-ChartJS doesn't draw the chart

by

2👍

✅

You could try this:

fruits.push(peach);

chart = new Chart(ctx, {
    type: 'pie',
    data: {
        labels: fruits.map(f => f.text),
        datasets: [{ 
            data: fruits.map(f => f.value),
            backgroundColor: fruits.map(f => f.color)
        }]
    }
});

As far as I could tell, Chart.js always requires labels.

0👍

The legend is not shown, you created your own legend by the data you have.

ChartJS normally draws it’s own legend inside the <canvas> element. And within the options you have the ability to turn them off, which you haven’t. So no legend and no chart of the framework is shown.

Anyway; you can use this to use your own legend and hide the framework’s legend

options: {
  legend: {
    display: false
  }
}

Your chart doesn’t show up, because your datastructure doesn’t fit the datastructure required by chartjs.

See: https://www.chartjs.org/docs/latest/charts/doughnut.html#data-structure

Keep in mind that a Pie/Doughnut do have an other data/label structure than line/bar charts

Leave a comment