IPython控制台显示含ipywidgets与Plotly交互式图表的优化方案问询

我希望在IPython控制台中显示包含ipywidgets和Plotly的交互式图表，控件变化时图表能自动重绘。这个功能在Jupyter Notebook里可正常运行，但IPython控制台无法直接显示图表。我当前的实现步骤是：1. 启动Jupyter服务器；2. 传输图表对象；3. 执行图表，已编写helper.py和main.py实现，但流程过于繁琐，现寻求更简洁的实现方案（排除直接使用Jupyter Notebook的方式）。

当前代码：

helper.py #

from IPython.display import display, clear_output
import plotly.express as px
import pandas as pd
import ipywidgets as widgets  # 原代码遗漏该导入，此处补充

class Dummy():

    def __init__(self):
        self.range_1 = range(10)
        self.range_2 = range(20)

    def display(self):
        dropdown_1 = widgets.Dropdown(
            options=self.range_1,
            description='Start Offset:',
            value=0
        )

        dropdown_2 = widgets.Dropdown(
            options=self.range_2,
            description='End Offset:',
            value=0
        )

        output = widgets.Output()

        def update_figure(change):
            with output:
                clear_output(wait=True)
                fig = px.line(pd.DataFrame([dropdown_1.value * dropdown_2.value]))
                fig.show(renderer='notebook')

        dropdown_1.observe(update_figure)
        dropdown_2.observe(update_figure)

        fig = widgets.VBox([dropdown_1, dropdown_2, output])
        display(fig)

main.py #

import os
import sys

import pickle
import nbformat
from nbclient import NotebookClient
import jupytext

sys.path.insert(1, os.getcwd())
import helper


obj = helper.Dummy()
pickled = pickle.dumps(obj)

nb = jupytext.reads(f"import pickle; obj = pickle.loads({pickled}); obj.display()")
client = NotebookClient(nb, timeout=600, store_widget_state=True)
client.execute()
nbformat.write(nb, 'executed_notebook.ipynb')
os.system("jupyter notebook executed_notebook.ipynb")

方案1：Plotly浏览器渲染+IPython交互控件 #

直接在IPython控制台使用ipywidgets.interact，搭配Plotly的browser渲染器，控件变化时自动在浏览器打开更新后的图表，无需手动启动Jupyter服务器：

import ipywidgets as widgets
import plotly.express as px
import pandas as pd

def update_figure(start_offset, end_offset):
    fig = px.line(pd.DataFrame([start_offset * end_offset]))
    fig.show(renderer='browser')  # 直接在浏览器打开交互式图表

# 创建交互控件
widgets.interact(
    update_figure,
    start_offset=widgets.Dropdown(options=range(10), description='Start Offset:', value=0),
    end_offset=widgets.Dropdown(options=range(20), description='End Offset:', value=0)
)

IPython控制台会显示文本形式的控件选项，选择不同值后，图表将自动在默认浏览器中打开并更新。

方案2：使用Panel库构建独立交互式应用 #

Panel是专门用于构建交互式仪表盘的库，支持在IPython控制台中启动本地服务器展示带控件的Plotly图表，流程极简：

1. 先安装依赖：

pip install panel plotly pandas ipywidgets

2. 实现代码：

import panel as pn
import plotly.express as px
import pandas as pd

pn.extension('plotly')  # 加载Plotly扩展

# 创建控件
start_offset = pn.widgets.Select(options=range(10), name='Start Offset', value=0)
end_offset = pn.widgets.Select(options=range(20), name='End Offset', value=0)

# 定义图表更新函数
@pn.depends(start_offset.param.value, end_offset.param.value)
def update_figure(start, end):
    return px.line(pd.DataFrame([start * end]))

# 构建布局
dashboard = pn.Column(start_offset, end_offset, update_figure)

# 在IPython中启动服务器展示
dashboard.show()

运行后，Panel会自动启动本地HTTP服务器，并在浏览器中打开交互式仪表盘，控件变化时图表实时更新，全程无需处理Jupyter相关文件或服务器。

方案3：使用Plotly Dash构建轻量Web应用 #

Dash是Plotly官方的交互式Web应用框架，适合快速构建带控件的图表应用，可直接在IPython控制台启动：

1. 安装依赖：

pip install dash pandas ipywidgets

2. 实现代码：

from dash import Dash, dcc, html, Input, Output
import plotly.express as px
import pandas as pd

# 初始化Dash应用
app = Dash(__name__)

# 构建布局
app.layout = html.Div([
    dcc.Dropdown(options=range(10), value=0, id='start-offset'),
    dcc.Dropdown(options=range(20), value=0, id='end-offset'),
    dcc.Graph(id='output-graph')
])

# 定义回调函数更新图表
@app.callback(
    Output('output-graph', 'figure'),
    Input('start-offset', 'value'),
    Input('end-offset', 'value')
)
def update_figure(start, end):
    return px.line(pd.DataFrame([start * end]))

# 启动应用
if __name__ == '__main__':
    app.run_server(debug=True)

在IPython控制台运行代码后，会自动启动本地服务器，浏览器打开对应地址即可看到交互式图表，控件变化时图表实时更新。

内容的提问来源于stack exchange，提问作者Sergej