Chartjs-Grouping by month with series of epoch timestamps in Chart.js

by

0👍

In v3 you need a date adapter and scales have been changed, for all changes please read the migration guide

const options = {
  type: 'line',
  data: {
    datasets: [{
      label: '# of Votes',
      data: [{
        x: 1632664467243,
        y: 5
      }, {
        x: 1611664467243,
        y: 10
      }],
      borderColor: 'pink'
    }]
  },
  options: {
    scales: {
      x: {
        type: 'time',
        time: {
          unit: 'month',
          round: 'month'
        }
      }
    }
  }
}

const ctx = document.getElementById('tt').getContext('2d');
new Chart(ctx, options);
<canvas id="tt"></canvas>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.5.1/chart.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/date-fns/1.30.1/date_fns.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-date-fns/dist/chartjs-adapter-date-fns.bundle.min.js"></script>

EDIT:

From the moment adapter readme:

npm install moment chartjs-adapter-moment --save

import { Chart } from 'chart.js';
import 'chartjs-adapter-moment';

new Chart()

Leave a comment