Question

134

Charts.js Formatting Y Axis with both Currency and Thousands Separator

rated 0 times [ 138] [ 4] / answers: 1 / hits: 94077 / 10 Years ago, sun, february 15, 2015, 12:00:00

I'm using Charts.js to show a graph on my site. Currently, the label shows as a long string of numbers (i.e 123456).
I want it to show as currency with thousands separator: (i.e $123,456)

I'm using the scaleLabel option to put a $ USD symbol before the value:

scaleLabel: <%= ' $' + Number(value)%>

and a function to insert the comma separator:

function(label){return label.value.toString().replace(/B(?=(d{3})+(?!d))/g, ,);}

I just do not know how to use these together to get what I want.

Here is the fiddle: http://jsfiddle.net/vy0yhd6m/79/

(please keep in mind that currently the graph will only work if you remove one of those two pieces of JavaScript cited above)

Thank you for any and all help.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

meadowe

Add To Favorites

Follow

Total Points: 0

Total Questions: 97

Total Answers: 97

Location: Laos

Member since Fri, Sep 11, 2020

4 Years ago

meadowe questions

1 TypeScript: Property 'name' does not exist on type 'any[]'

Thu, Aug 5, 21, 00:00, 3 Years ago

1 How to trigger ASP.NET Core client-side validation from JavaScript

Tue, Sep 29, 20, 00:00, 4 Years ago

1 Trying to play mp3 using Vue.js

Thu, Jul 9, 20, 00:00, 4 Years ago

1 how to solve UnhandledPromiseRejectionWarning on node?

Mon, Jun 8, 20, 00:00, 4 Years ago

1 Server side rendering with next.js vs traditional SSR

Sun, Feb 9, 20, 00:00, 4 Years ago

View All

answered 10 Years ago saulthomasb · Accepted Answer

You should be able to include currency prefix in composition of label inside function...

var options = {

    animation: false,

    scaleLabel:

    function(label){return  '$' + label.value.toString().replace(/B(?=(d{3})+(?!d))/g, ,);}

};

http://jsfiddle.net/vy0yhd6m/80/