python - Bokeh 嵌套列布局

Question

我想在 Bokeh 中创建一个具有 2 列的嵌套布局。左列有 2 个图，一个在另一个之上。右栏有许多小部件，全部堆叠在一起。我还希望所有内容都能在浏览器窗口中自动调整:

我目前有这样的东西:

from bokeh.io import curdoc
from bokeh.layouts import row, column, widgetbox, layout
from bokeh.models import ColumnDataSource
from bokeh.models.widgets import Slider, TextInput, Button, CheckboxGroup, RadioButtonGroup
from bokeh.plotting import figure

# Set up data
source = ColumnDataSource(data=dict(time=[1,2,3], acc=[1,2,3]))
source_raw = ColumnDataSource(data=dict(time=[1,2,3], acc=[1,2,3]))

## Top
plot_orig = figure(tools="crosshair,pan,reset,save,wheel_zoom")
line_orig = plot_orig.line('time', 'acc', source=source, line_width=1, line_alpha=1)

## Bottom
plot_new = figure(tools="crosshair,pan,reset,save,wheel_zoom")
line_new = plot_new.line('time', 'acc', source=source, line_width=1, line_alpha=1)

# Set up widgets
sub = TextInput(value="1", title="Option #:")
trial = TextInput(value="1", title="Option #:")

signal_type = RadioButtonGroup(labels=["Raw", "Filtered", "Both"], active=1)
flip_signal_active = []
flip_signal_btn = CheckboxGroup(labels=["Flip signal"], active=flip_signal_active)
filter_order = Slider(title="Filter order", value=2, start=2, end=20, step=1)
filter_threshold = Slider(title="Filter threshold (Hz)", value=10, start=1, end=20, step=1)
reset_options_btn = Button(label="Set Default Options", button_type="danger")

value = Slider(title="Minimum value", value=0.6, start=0, end=1, step=0.01)
distance = Slider(title="Minimum distance", value=30, start=0, end=100, step=0.01)
deletions = TextInput(value="", title="Peaks to delete (comma separated):")
reset_params_btn = Button(label="Set Default Parameters", button_type="danger")
save_params_btn = Button(label="Save Parameters", button_type="success")

# Set up layouts and add to document   
sub_trial = widgetbox(sub, trial)
options = widgetbox(signal_type, flip_signal_btn, filter_order, filter_threshold, reset_options_btn)
parameters = widgetbox(value, distance, deletions, reset_params_btn, save_params_btn)

new_layout = layout([
  column([plot_orig, plot_new], sizing_mode='stretch_both'),
  column([sub_trial, options, parameters], sizing_mode='stretch_both'),
], sizing_mode='stretch_both')

curdoc().add_root(new_layout)

这让我很接近，因为正确的东西堆叠在一起并且调整大小似乎有效但是，绘图和小部件堆栈应该位于单独的列中:

我尝试添加一个行来从小部件堆栈中分割绘图，但一切最终都变得很小:

new_layout = layout([row(
  column([plot_orig, plot_new], sizing_mode='stretch_both'),
  column([sub_trial, options, parameters], sizing_mode='stretch_both'),
)], sizing_mode='stretch_both')

Answer 1

我不知道是否有办法让下面的代码在大小调整模式下很好地工作

但是，如果您可以不使用它们，请设置数字plot_width和plot_height(例如700x275) 并使用网格图布局:

grid = gridplot([[column([plot_orig, plot_new]),widgetbox(sub_trial.children+options.children+parameters.children)]])

curdoc().add_root(grid)

这与column(row(column(),column()))相同，只是您可以选择是否想要合并工具栏