Setting the font of the LaTeX mathematical notation elements in Bokeh?

[mattrobin]

Bokeh allows for text elements with LaTeX mathematical notation formatting. However, once a string has been processed with the math formatting, the font becomes a Times-like font. The default font for the rest of Bokeh is Helvetica. I would like to make the fonts in my figure be consistent, regardless of whether it is a font that had the LaTeX math formatting processed or not. Within the LaTeX formatting section of the Bokeh documentation, it's noted that

You can use some of Bokeh’s standard text properties to change the appearance of rendered math text.

with the examples appending the text property name to the end of the element (e.g. figure.xaxis.axis_label_text_color for the text color). Unfortunately, using figure.xaxis.axis_label_text_font does not seem to work.

Is there a way to set the font for the LaTeX elements of the figure? Or even a way to change the global LaTeX engine's (seemingly mathjax) font so that I can get the fonts to match?

Example showing the differing font:

from bokeh.plotting import figure as Figure
from bokeh.io import show

figure = Figure(x_axis_label=r'$$\text{Different font with math formatting }M_{2}^{3}$$',
                y_axis_label=r'Normal bokeh font', width=400, height=400)
figure.line(x=[0, 1, 2, 3], y=[4, 6, 5, 7])
show(figure)

(Cross posted from my question on StackOverflow which I asked a couple weeks ago.)

[bryevdv]

I would like to make the fonts in my figure be consistent, regardless of whether it is a font that had the LaTeX math formatting processed or not

Then, just to be clear, you will have to use a math-font for everything. You can't use Helvetica, for instance, for the MathJax output, because Helvetica is not a math-font (i.e. it literally does not have any characters for "epsilon" or "integral symbol" or "extra large left double angle bracket" or anything like that).

According to the MathJax documentation only the following math-fonts are supported:

• MathJax TeX (default)
• STIX General
• Asana Math
• Neo Euler
• Gyre Pagella
• Gyre Termes
• Latin Modern

So, in principle, you can configure MathJax to use one of these fonts and also set the font property of Bokeh text elements to use the same. But you'll probably have to use a custom page template that loads the necessary font files remotely, since AFAIK none of them are commonly built-in to browsers.

cc @mattpap for more thoughts

Edit: I actually unintentionally linked to the MathJax 2 docs above. It actually seems that MathJax 3 has dropped all support for different fonts:

MathJax version 3 currently supports only one font, the MathJax TeX font.

So it would seem the only option for exact match would be to use MathJax TeX everywhere. Alternatively there might also be a text font with a similar appearance to MathJax TeX for the latin alphabet characters that could be used for Bokeh text.

[bryevdv]

I guess I should add, there has also been some discussion about embedding math content inside larger strings, e.g

axis_label="some plain test $$\frac{sin(x^2)}{x}$$"

which would cause "some plain text" part to render in Bokeh's configured font, and only the "math part" \frac{sin(x^2)}{x} to render in the MathJax font. But as far as I know that work has not been done yet (please confirm @mattpap). Also with that it's not clear what your expectations are. Do you even want the "sin" part of the above to match the Bokeh font? That is definitely not going to be possible as far as I can tell.

[mattrobin]

Thanks for the detailed explanation @bryevdv. My primary use case is scientific publications, so being commonly built into browsers is less of a concern. Though, I prefer to have them as sharable interactive documents which can easily be adapted to the scientific publications when possible.

Sorry that my question didn't give detailed expectations. At the time I thought, setting everything to the same font was the most straight forward path to what I was hoping for. I suppose multiple possible methods would meet my desired result. That being, I want the resulting figure to be suitable for polished presentations, both in scientific publications and elsewhere. And having such different fonts didn't meet that case (e.g., I would be uncomfortable publishing a paper with two different fonts on the axes as above).

So simply setting all the fonts to be a math font does appear to be one solution. Though getting all fonts within the figure to match does seem to be slightly more work, since, as far as I can tell, there is no way to set the global font. Additionally so, since I would want this choice to be consistent for all types of figures I use in my paper. Fonts with a similar or complementary appearances might also be possible.

Sorry, I'm not sure that I do have exact expectations, as multiple possible solutions would probably be sufficient, and I'm not sure which one is the easiest to accomplish in Bokeh. I will probably just look into how difficult it will be to recursively search a figure for all text elements and change the font to a math-based font.

Thanks again!

[bryevdv]

@mattrobin please take note of #13214 which will allow inline math expressions in 3.3. So you can change the Bokeh font to exactly (or perhaps closely, at least) match the math font.