Robert E
Robert E

Reputation: 750

Rounding results in highcharts jquery script

I know this is a bit out there... but gonna ask anyways. I'm using highcharts jquery script (http://www.highcharts.com/) to generate a pie chart. I am trying to round off the number results in the pie chart and cannot find any documentation to do so. I'm stuck!

My data looks something like this:

data: [
    ['Equity',   3],
    ['Cash',     6]
]

And the pie chart outputs: 33.333333333333 and 66.666666666666

I'd rather get the results rounded up and down respectively so it reads and shows 33 and 64. Does anyoone know how this can be set up in highcharts?

Upvotes: 19

Views: 32938

Answers (6)

caktux
caktux

Reputation: 5513

tooltip: {
  valueDecimals: 2
},

Upvotes: 31

RailsZilla.com
RailsZilla.com

Reputation: 143

try

percentageDecimals: 0 

in your tooltip

Upvotes: 0

Ricardo Lohmann
Ricardo Lohmann

Reputation: 26320

Instead of use formatter you can set yDecimals as 2:

tooltip: {
    yDecimals: 2
}

yDecimals: Number
How many decimals to show in each series' y value. This is overridable in each series' tooltip options object. The default is to preserve all decimals.

Upvotes: 6

Batjaa
Batjaa

Reputation: 41

tooltip: {
    formatter: function() {
        return '<b>'+ this.point.name +'</b>: '+ Math.round(this.percentage*100)/100 +' %';
    }
},

Upvotes: 4

eolsson
eolsson

Reputation: 12727

There's a numberFormatfunction available in the Highcharts API that you can use (see http://www.highcharts.com/ref/#highcharts-object).

Quoted from API doc:

numberFormat (Number number, [Number decimals], [String decimalPoint], [String thousandsSep]) : String

Formats a JavaScript number with grouped thousands, a fixed amount of decimals and an optional decimal point. It is a port of PHP's function with the same name. See PHP number_format for a full explanation of the parameters.

tooltip: {
    formatter: function() {
        return ''+ this.series.name +''+
            this.x +': '+ Highcharts.numberFormat(this.y, 0, ',') +' millions';
    }
}, ...

Parameters

  • number: Number The raw number to format.
  • decimals: Number The desired number of decimals.
  • decimalPoint: String The decimal point. Defaults to "." or to the string specified globally in options.lang.decimalPoint.
  • thousandsSep: String The thousands separator. Defaults to "," or to the string specified globally in options.lang.thousandsSep.

Returns

A string with with the input number formatted.

Upvotes: 21

Yanofsky
Yanofsky

Reputation: 1856

In in the tooltip option in the configuration object use Math.round() in the formatter function.

   tooltip: {
     formatter: function() {
        return '<b>'+ this.point.name +'</b>: '+ Math.round(this.percentage) +' %';
     }
  },

Upvotes: 46

Related Questions