chartjs-adapter-intl


Introduction

chartjs-adapter-intl is a date adapter for Chart.js that uses the native Intl.DateTimeFormat API for date formatting and parsing.

Requires Chart.js 3.0.0 or later.

Note: once loaded, this adapter overrides the default date-adapter provided in Chart.js (as a side effect).

Installation

You can install this adapter via pnpm:

``sh
pnpm install chartjs-adapter-intl
`

via npm:

`sh
npm add chartjs-adapter-intl
`

via yarn:

`sh
yarn add chartjs-adapter-intl
`

$3

By default, https://cdn.jsdelivr.net/npm/chartjs-adapter-intl returns the latest (minified) version, however it's highly recommended to always specify a version in order to avoid breaking changes. This can be achieved by appending @{version} to the URL:

`html


`

Read more about jsDelivr versioning on their website.

Usage

To use this adapter, you need to import it into your project. The adapter will automatically register itself with Chart.js.

`javascript
import { Chart } from 'chart.js';
import 'chartjs-adapter-intl';

const config = {
type: 'line',
data: {
datasets: [{
data: [
{ x: '2023-01-01T00:00:00Z', y: 10 },
{ x: '2023-01-02T00:00:00Z', y: 20 }
]
}]
},
options: {
scales: {
x: {
type: 'time',
time: {
unit: 'day'
}
}
}
}
};

const myChart = new Chart(document.querySelector('#myChart'), config);
`

Configuration

This adapter supports the following configuration options:

- locale: The locale to use for formatting dates. Defaults to 'en-US'.

`javascript
const config = {
type: 'line',
data: {
datasets: [{
data: [
{ x: '2023-01-01T00:00:00Z', y: 10 },
{ x: '2023-01-02T00:00:00Z', y: 20 }
]
}]
},
options: {
scales: {
x: {
type: 'time',
adapters: {
date: {
locale: 'fr-FR'
}
},
time: {
unit: 'day'
}
}
}
}
};

const myChart = new Chart(document.querySelector('#myChart'), config);
`

Development

To build the project, run:

`sh
pnpm run build
`

To run tests, use:

`sh
pnpm test
`

License

chartjs-adapter-intl` is available under the MIT license.