Skip to content

Instantly share code, notes, and snippets.

@miko007
Last active January 17, 2025 22:43
Show Gist options
  • Save miko007/a781e071f6f7035a30dd281aba042b2a to your computer and use it in GitHub Desktop.
Save miko007/a781e071f6f7035a30dd281aba042b2a to your computer and use it in GitHub Desktop.
This is a simple "currency scale" to register with Charts.js
class CurrencyScale extends Chart.LinearScale {
static id = "currency";
static defaults = {
currency : "USD",
locale : "en-US"
};
getLabelForValue(value) {
return this.formatCurrency(value);
}
generateTickLabels(ticks) {
ticks.map(tick => tick.label = this.formatCurrency(tick.value));
}
formatCurrency(value) {
return new Intl.NumberFormat(this.options.locale, {style : "currency", currency: this.options.currency}).format(value);
}
}
@miko007
Copy link
Author

miko007 commented Jan 17, 2025

you then can simply add the type to your scales config object, after you registered the scale:

Chart.register(CurrencyScale);

...

new Chart(ctx, {
    options : {
        plugins : {
            scales : {
                y : {
                    type        : "currency",
                    beginAtZero : true,
                    currency    : "EUR",
                    locale      : "de-DE"
                }
            }
        }
    }
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment