Search code examples
javascriptangularjschart.jspie-chart

Can't draw pie chart using chartjs - TypeError: Cannot create property '_meta' on number '16'


I'm facing problem in generating pie chart with single data(sometimes I need to generate a pie chart with just single data).

The data count is less than hundred. My array contains only single property and count is 16 that means

pieChartUniqueLabelsArray = ['YourName']

pieChartUniqueCountsArray = [16]

I'm receiving the following error.

TypeError: Cannot create property '_meta' on number '16'

How can I draw this pie chart using chartjs. Help will be very appreciated.

Here is my code:

myPieChart = new Chart(ctx, {
                  type: "pie",
                  data: {
                      labels: pieChartUniqueLabelsArray,
                      datasets: pieChartUniqueCountsArray,
                  },
                  options: {
                      maintainAspectRatio: false,
                      legend: {
                          display: false,
                      },
                      plugins: {
                          labels: [{
                                  render: "label",
                                  position: "outside",
                                  fontSize: 18,
                              },
                              {
                                  render: "value",
                                  fontSize: 15,
                                  position: "border",
                              },
                          ]
                      },
                      tooltips: {
                          titleFontSize: chartMouseOverFontSize,
                          bodyFontSize: chartMouseOverFontSize
                      },
                  },
              });

Solution

  • Your datasets structure is incorrect. Data structure.

    var pieChartUniqueCountsArray = [
      {
        data: [16]
      }
    ];