多个数据表作为每个散景选项卡中的子项的布局

Question

我想在每个散景选项卡（散景面板）内有几张桌子

但是，表格水平连接在一起，我没有找到一种很好地展示它们的方法。我使用了一个愚蠢的 Div 作为快速解决方案，但它创建了太多空间，甚至是宽度为 1 的 Div。我将如何实现这一目标？这是我的代码：

from bokeh.models.widgets import Panel, Tabs, TableColumn,DataTable, Div

import numpy as np

from bokeh.io import output_notebook, show

from bokeh.models import ColumnDataSource

from bokeh.layouts import row, column, layout

output_notebook()

columns = [

        TableColumn(field="A", title="A"),

        TableColumn(field="B", title="B"),

        TableColumn(field="C", title="C"),

        TableColumn(field="D", title="D"),]

data1 = {"A":np.random.randint(23, 89, 10), 

        "B": np.random.randint(23, 89, 10), 

        "C": np.random.randint(23, 89, 10), 

        "D": np.random.randint(23, 89, 10)}

source1 = ColumnDataSource(data1)

p1 = DataTable(source=source1, columns=columns, width=300, height=200,editable=True)

data2 = {"A":np.random.randint(23, 89, 10), 

        "B": np.random.randint(23, 89, 10), 

        "C": np.random.randint(23, 89, 10), 

        "D": np.random.randint(23, 89, 10)}

source2 = ColumnDataSource(data2)      

p2 = DataTable(source=source2, columns=columns, width=300, height=200,editable=True)

data3 = {"A":np.random.randint(23, 89, 10), 

        "B": np.random.randint(23, 89, 10), 

        "C": np.random.randint(23, 89, 10), 

        "D": np.random.randint(23, 89, 10)}

source3 = ColumnDataSource(data3)       

p3 = DataTable(source=source3, columns=columns, width=300, height=200,editable=True)

dumbdiv = Div(text=""" """,

width=1, height=20)

l1 = layout([[p1, p2], [p3]], sizing_mode='fixed')

# l1 = layout([[p1, dumbdiv, p2]], sizing_mode='fixed')

tab1 = Panel(child=l1, title="Three Tables")

tabs = Tabs(tabs=[tab1],sizing_mode='scale_width')

show(tabs)

这是结果：（第一个表格的滚动条没有显示；我希望第一行的表格之间有一些空间）

Answer 1

该width和height是可选的ARGS Div。如果您只是创建一个dumbdiv没有这些参数的对象，您将在 p1 和 p2 之间插入一个 div，而没有任何特定的width或height.dumbdiv = Div() l1 = layout([[p1, dumbdiv, p2], [p3]], sizing_mode='fixed')所以，现在你应该看到 p1 和 p2 之间有足够的空间：

Answer 2

Div() 的问题是两个数据表之间可能存在相当大的差距 - 远远超过需要。我认为使用 Spacer 看起来更好row2 = row(p1, Spacer(width=600, height=10), p2)l1 = layout([row2], sizing_mode='fixed')