Chart.js adapter to use native ECMAScript Internationalization API for date formatting
npm install chartjs-adapter-intlchartjs-adapter-intl is a date adapter for Chart.js that uses the native Intl.DateTimeFormat API for date formatting and parsing.
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.