UPDATE: I just noticed, that this is only applied when browser is refreshed after initial visit.
This code imports a font (from a url) that is applied to holoview’s gridmatrix and hv.table:
import bokeh
from bokeh.themes.theme import Theme
from bokeh.sampledata.iris import flowers
import panel as pn
import holoviews as hv
from holoviews.operation import gridmatrix
FONT = "source sans pro"
theme = Theme(
json = {
"attrs": {
"Axis": {
"major_tick_line_alpha": 0,
"major_tick_line_color": "#3C3E42",
"minor_tick_line_alpha": .5,
"minor_tick_line_color": "#3C3E42",
"axis_line_alpha": 0,
"axis_line_color": "#3C3E42",
"major_label_text_color": "#3C3E42",
"major_label_text_font": FONT,
"major_label_text_font_size": "1.025em",
"axis_label_standoff": 10,
"axis_label_text_color": "#3C3E42",
"axis_label_text_font": FONT,
"axis_label_text_font_size": "1.03em",
"axis_label_text_font_style": "normal",
"axis_label_text_align": "left",
"axis_label_text_baseline": "top",
},
"Title": {
"text_color": "#3C3E42",
"text_font": FONT,
"text_font_size": "1.15em"
}
}
})
css = '''
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro&display=swap');
// html is needed for gridmatrix's diagonal plot at left-bottom position
html {
overflow: hidden;
font-family: 'Source Sans Pro', sans-serif !important;
}
.bk-root {
font-family: 'Source Sans Pro', sans-serif !important;
}
'''
hv.extension('bokeh')
hv.renderer('bokeh').theme = theme
pn.extension(raw_css=[css], comms='vscode')
print('holoviews: ', hv.__version__)
print('panel: ', pn.__version__)
print('bokeh: ', bokeh.__version__)
# holoviews: 1.14.1
# panel: 0.10.2
# bokeh: 2.2.3
iris_ds = hv.Dataset(flowers, kdims=['sepal_length','sepal_width','petal_length','petal_width'])
grid = gridmatrix(iris_ds).opts(title='Flowers - Block #123')
table = hv.Table(iris_ds)
pn.Row((grid + table)).servable(title='Demo font loading')
Although subtle in appearance compared to default font, compare the ‘l’ in Flowers and ‘g’ in length. Source sans pro is shown in bottom portion of image.