How i can localize days and month name in ChartJS 3.x?

by

👍:0

You can use the Moment.js adapter together with the moment-with-locales.js library. The desired locale can then be defined through the following statement.

moment.locale('it');

Please take a look at below runnable sample and see hot it works.

moment.locale('it');

new Chart('myChart', {
  type: 'line',
  data: {
    labels: ['2021-02', '2021-03', '2021-06', '2021-07', '2021-08', '2021-10', '2021-11'],
    datasets: [{
        label: 'Valori',
        data: [75, 56, 44, 54, 22, 38, 48],        
        borderColor: '#D00',
        fill: false
      }
    ]
  },
  options: {
    scales: {
      x: {
        type: 'time',
        time: {
          unit: 'month',
          displayFormats: {
            month: 'MMMM'
          },
          tooltipFormat: 'MMMM'
        }
      }
    }
  }
});
canvas {
  max-height: 180px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.5.1/chart.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment-with-locales.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-moment"></script>
<canvas id="myChart"></canvas>

Leave a comment