Chartjs-How to access all data in a function with ChartJs?

by

1👍

The Chart.js animation onComplete callback function must be defined inside the chart options.

options: {
  animation: {
    onComplete: ctx => {
      // do your stuff
    }
  }
}

Please take a look at your amended code below and see how it works.

var chartData = {
  labels: ["January", "February", "March", "April", "May", "June"],
  datasets: [{
    fillColor: "#79D1CF",
    strokeColor: "#79D1CF",
    data: [60, 80, 81, 56, 55, 40]
  }]
};

new Chart('myChart1', {
  type: "line",
  data: chartData,
  options: {
    animation: {
      onComplete: ctx => {
        console.log(ctx.chart.data.datasets);
        console.log(ctx.chart.options.scales.x);
      }
    }
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.8.0/chart.min.js"></script>
<canvas id="myChart1" height="300" width="500"></canvas>

Leave a comment