Search code examples
pythonheaderbokehdashboard

How to add header to a bokeh dashboard in python?


I created a dashboard in bokeh, but how I can I ad a universal header to it?

enter image description here I did a lot of research before, but it seems like nobody asked this simple question before.

Thanks for helping me :)


Solution

  • As Eugene mentioned you can use a div-container to set the title and later set it in the column output.

    Here some example code that might be helpful to understand:

    output_file("slider.html")
    title = Div(text='<h1 style="text-align: center">Example Header</h1>')
    p1 = figure(plot_width=300, plot_height=300)
    p1.circle([1, 2, 3, 4, 5], [6, 7, 2, 4, 5], size=20, color="navy", alpha=0.5)
    tab1 = Panel(child=p1, title="circle")
    
    p2 = figure(plot_width=300, plot_height=300)
    p2.line([1, 2, 3, 4, 5], [6, 7, 2, 4, 5], line_width=3, color="navy", alpha=0.5)
    tab2 = Panel(child=p2, title="line")
    
    tabs = Tabs(tabs=[tab1, tab2])
    
    layout = column(title, tabs, sizing_mode='scale_width')
    
    curdoc().add_root(layout)