Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Adding a % sign to Google Gauges

I'm using Google Gauges and would like to add a % sign after the value in the gauge. My values display with fine without the percent symbol (whole numbers 0 - 100), but when I start trying to add the percent symbol things get wonky.

Here's what I've tried

// Format the data to include % symbol
var formatter = new google.visualization.NumberFormat(
    {suffix: '\u0025'}
    //{suffix: '%'}
    //{pattern: '#%'}

);

All three attempts display the correct visualization, but for the actual value text I get varying results.

Using either suffix method it adds two decimal places:

6 => 6.00%

26 => 26.00%

and so on

Using the pattern method it multiples the value by 100

6 => 600%

26 => 2600%

and so on

Any clue on how to simply display the value along with a percent symbol?

like image 874
dscl Avatar asked Mar 27 '14 15:03

dscl


People also ask

Which option is available in gauge chart?

Pie, line and scatter charts can display a maximum of two dimensions, bar, block and grid charts three.


1 Answers

It's simpler than all that. If you just make a number formatter, specifying the pattern, and the suffix, you're all set:

http://jsfiddle.net/fHnnn/

like image 197
Jeremy Faller Avatar answered Sep 20 '22 22:09

Jeremy Faller