Bokeh NumerFormatter Swiss Francs

Question

I am currently working on a Webapp with Bokeh which contains a table of Swiss Franc values. I cannot figure out how to format the numbers in the following style

1'000'000

so with dahes instead of commas as the 1000 separator. Going down the documentation Bokeh seems to be limited to the options given here

https://docs.bokeh.org/en/latest/docs/reference/models/widgets.tables.html?highlight=numberfor#bokeh.models.widgets.tables.NumberFormatter

but the numbro documentation seems to hint that there is more to it.

http://numbrojs.com/format.html

I still cannot find a "de-CH" option or something like this, and even if I did, I do not see how to hand it over in bokeh. Does anyone have any experience?

Best regards.

If your numbers are fixed you could use [this solution](https://stackoverflow.com/questions/62452846/how-to-change-thousands-separator-to-apostrophe-in-format-string) to convert all numbers to string and store it as an extra column in your data / dataframe and use that column for displaying the numbers. — Tony, Jun 17 '21 at 12:21
thanks, that is indeed a viable workaround i have not thought of! However, of course it would be nice just to be able to set the desired format! If nothing else comes up, I am happy to try your solution. Thanks! — Tom, Jun 17 '21 at 13:26

mosc9575 · Answer 1 · 2022-01-28T16:48:27.287

Bokeh gives you the option to define your own tick-formatter using FuncTickFormatter. With this you can define you own rule in JavaScript.

Below you can see on example adapting your rule.

from bokeh.plotting import figure, output_notebook, show
from bokeh.models import FuncTickFormatter
output_notebook()

# create a new plot with the toolbar below
p = figure(plot_width=400, plot_height=400,
           title=None, toolbar_location="below", )
x = [1e3, 3e3, 5e3, 1e4, 3e4]
y = [2, 5, 8, 2, 7]
p.circle(x, y, size=10)
p.xaxis.formatter = FuncTickFormatter(code=
    '''
    var num =  tick.toFixed(2).toString()
    var splitted = num.split(".")
    for (var i=splitted[0].length-3; 0<i; i+=-3){
      num = num.slice(0,i)+"'"+num.slice(i)
    }
    return num
    '''
)

The Output looks like this for a different set of x and y

Ticks < 30k	Ticks 2e6<1e7
`x = [1e3, 3e3, 5e3, 1e4, 3e4]`	`x = [1e6, 5e6, 9e6]`
`y = [2, 5, 8, 2, 7]`	`y = [2, 8, 2]`

Bokeh NumerFormatter Swiss Francs

1 Answers1