How can I show one figure and one datatable on one tab if there is multiple datatables in bokeh?

Question:

I have four figure, on four tabs.
I also have four datatables, one for each datasource/figure.

I want to show only one datatable in one tab.

I tried to use column layout and but it is not iterable.

show( column( data_table4,Tabs(tabs=[tab4]) ), column( data_table3,Tabs(tabs=[tab3]) ) )
Asked By: ptr808

||

Answers:

The trick is to use a layout like row, column or grid inside a TabPanel. Pass the layout to the child argument.

Minimal Example

from bokeh.models import TabPanel, Tabs, DataTable, ColumnDataSource, TableColumn
from bokeh.layouts import column
from bokeh.plotting import figure, show, output_notebook
output_notebook()

source = ColumnDataSource({
    'x': [1, 2, 3, 4, 5],
    'y1':[6, 7, 2, 4, 5],
    'y2':[7, 3, 2, 3, 1],
})

p1 = figure(width=300, height=300)
p1.circle('x', 'y1', size=20, color="navy", alpha=0.5, source=source)
columns1 = [
    TableColumn(field='x', title='x'),
    TableColumn(field='y1', title='y1'),
]
data_table1 = DataTable(source=source, columns=columns1, width=300, height=300)
tab1 = TabPanel(child=column([p1, data_table1]), title="circle")

p2 = figure(width=300, height=300)
p2.line('x', 'y2', line_width=3, color="navy", alpha=0.5, source=source)
columns2 = [
    TableColumn(field='x', title='x'),
    TableColumn(field='y2', title='y2'),
]
data_table2 = DataTable(source=source, columns=columns2, width=300, height=300)
tab2 = TabPanel(child=column([p2, data_table2]), title="line")

show(Tabs(tabs=[tab1, tab2]))

Output

tabs with inner layout

Attention: In bokeh older than 3.0.0 TabPanel was named Panel.

The solution is base on the examples tab_panes and data_table_plot.

Answered By: mosc9575
Categories: questions Tags: , ,
Answers are sorted by their score. The answer accepted by the question owner as the best is marked with
at the top-right corner.