CODEWITHSUNDEEP
apichartsgoogle-visualizationnumber-formatting
B Seven
B Seven

Reputation: 45943

How do you set percentage in Google Visualization Chart API?

How do you set the vertical axis to display percent such as 25%, 50%, 75%, 100%?

Upvotes: 23

Views: 47126

Answers (3)

jroi_web
jroi_web

Reputation: 1982

var options = {
        title: 'Chart Title',
        vAxis: {
            minValue: 0,
            maxValue: 100,
            format: '#\'%\''
        } 
    };

Try escaping the % sign. I've used this to just append the % sign in the y axis.

Upvotes: 37

Pat Price
Pat Price

Reputation: 31

Using bar charts, I found my results haphazard and I got to consistency by doing the following: 1. In your data column, set a value of 100, even if you add a dummy value of 100. 2. Select all the numeric cells in the column and format them using Format, Number, Normal 3. Now format them to % using Format, Number, Percent Rounded

Your graph should now show 100% on the vertical scale and if you have a dummy value for 100% you will want to hide it, so you can either format it by clicking on it in the graph and changing the color (but this doesn't seem to work every time) or go to Advanced Edit, Customize, Columns, select your column name (from the graphic legend) and set the bar color to None or whatever your background color is.

Good luck.

Upvotes: 3

B Seven
B Seven

Reputation: 45943

chart.draw(data, {vAxis: {format:'#%'} } );

To get comma for thousands, use {format:'#,###%'}.

See http://code.google.com/apis/chart/interactive/docs/gallery/linechart.html

Upvotes: 31

Related Questions