макет для нескольких таблиц данных в качестве дочерних элементов в каждой вкладке Bokeh - PullRequest
Новая
       8

макет для нескольких таблиц данных в качестве дочерних элементов в каждой вкладке Bokeh

0 голосов
/ 14 февраля 2019

Я хочу иметь несколько таблиц внутри каждого Bokeh Tab (Bokeh Panel)

Однако таблицы скрепляются по горизонтали, и я не нахожу способа их красиво показать.Я использовал тупой Div в качестве быстрого решения, но он создал слишком много места, даже Div с шириной = 1.Как мне этого добиться?Вот мой код: 

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)

Это результат: (полоса прокрутки первой таблицы не отображается; я хочу немного пробела между таблицами в первой строке)

enter image description here

Ответы [ 2 ]

0 голосов
/ 31 июля 2019

Проблема с Div () в том, что между двумя таблицами данных может быть значительный разрыв - гораздо больше, чем нужно. Я думаю, что использование Spacer выглядит лучше 

row2 = row(p1, Spacer(width=600, height=10), p2)
l1 = layout([row2], sizing_mode='fixed')
0 голосов
/ 17 февраля 2019

width и height - необязательные аргументы для Div.Если вы просто создадите объект dumbdiv без этих аргументов, вы получите div, вставленный между p1 и p2 без каких-либо конкретных width или height. 

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

Итак, теперь вам следуетувидеть достаточно места между p1 и p2:

enter image description here

...