Jupyter笔记本上的选项卡小部件大小问题

Question

添加到选项卡小部件的第二个图的大小有问题，它不是所有容器的大小：这是按代码

''' output_co2 = widgets.Output()
output_co = widgets. Output()
tab = widgets.Tab(children=[output_co2, output_co],
layout=widgets.Layout(width='100%', height='100%'))
tab.set_title(0, 'CO2')
tab.set_title(1, 'CO')
display(tab)
with output_co2:
fig = go.Figure()
fig.add_trace(go.Scatter(x=vehicleData['distance_m']/1000,
y=vehicleData['co_gs'],
name='CO [g/s]',
mode="lines",
line=dict(
width=2),
fig.show()
with output_co:
fig = go.Figure()
fig.add_trace(go.Scatter(x=vehicleData['distance_m']/1000,
y=vehicleData['co_gs'],
name='CO [g/s]',
mode="lines",
line=dict(
width=2),
fig.show() '''

在此处输入图像描述在此处输入图像描述

Answer 1

对于plotly，您需要使用go.FigureWidget()来代替go.Figure()，请参阅此处。这样的东西：

output_co2 = widgets.Output()
output_co = widgets.Output()
tab = widgets.Tab(children=[output_co2, output_co])
tab.set_title(0, 'CO2')
tab.set_title(1, 'CO')
display(tab)
with output_co2:
fig = go.FigureWidget() # HERE
fig.add_trace(go.Scatter(x=vehicleData['distance_m']/1000,
y=vehicleData['co_gs'],
name='CO [g/s]',
mode="lines",
line_width=2))
fig.show()
with output_co:
fig = go.FigureWidget() # AND HERE
fig.add_trace(go.Scatter(x=vehicleData['distance_m']/1000,
y=vehicleData['co_gs'],
name='CO [g/s]',
mode="lines",
line_width=2))
fig.show()

备选方案：通过plotly，您可以直接使用go.FigureWidget()而不是widgets.Output()

fig1 = go.FigureWidget()
fig2 = go.FigureWidget()
tab = widgets.Tab(children=[fig1, fig2])
tab.set_title(0, 'CO2')
tab.set_title(1, 'CO')
fig1.add_trace(go.Scatter(x=vehicleData['distance_m']/1000,
y=vehicleData['co_gs'],
mode="lines",
line_width=2))
fig2.add_trace(go.Scatter(x=vehicleData['distance_m']/1000,
y=vehicleData['co_gs'],
mode="lines",
line_width=2))
display(tab)