调整 jupyter 小部件输出的布局

Question

下面的代码使用户能够交互式地显示连续的图。

我希望在此图中隐藏标题 "Figure 1" 及其灰色框。我阅读了 this guide 但没有找到答案。

import ipywidgets as widgets
from IPython.display import display, clear_output
from traitlets import CInt, link

class Counter(widgets.DOMWidget):
    value = CInt(0, sync=True)


counter = Counter()
def button_plus(name):
    if counter.value != passage_list[-1]  :
        counter.value = passage_list[passage_list.index(counter.value)+1] 
    else :
        print("last passage from the list")

def button_minus(name):
    if passage_list.index(counter.value) != 0  :
        counter.value = passage_list[passage_list.index(counter.value)+1] 
    else : 
        print("first passage from the list")


# 1 step forward button
wplus = widgets.Button(description='> Next passage')

# 1 step backward button
wminus = widgets.Button(description='Previous passage <')

# dropdown widget with passages timestamp
wpick = widgets.Dropdown(
    options=passage_list,
    value=passage_list[0],
    description='Passage:',
    disabled=False,
)
wplus.on_click(button_plus)
wminus.on_click(button_minus)

link((wpick, 'value'), (counter, 'value'));

#display(wminus, wpick,wplus)
ui = widgets.HBox([wminus, wpick,wplus])

out = widgets.interactive_output(plot2_passage, {'passage': wpick})

display(ui, out)

Answer 1

我认为这是使用默认的 matplotlib notebook 后端，它提供了 header 条。交互性允许您平移/缩放图表。

尝试将 %matplotlib inline 添加到单元格的顶部。这应该摆脱灰色条，但您可能会失去缩放/平移功能。

Answer 2

我以编辑 custom.css 文件结束：

F12 在浏览器中查找哪个 class 用于灰色栏： "ui-dialog-titlebar"
找到 custom.css : 在 windows , C:\Users\user.jupyter\custom\custom.css
在 custom.css 文件末尾添加这些行：

.ui-dialog-titlebar { 显示：none； }

调整 jupyter 小部件输出的布局

tweak layout for jupyter widget output

jupyter-notebook

ipywidgets