首页 > 解决方案 > 在 plotly 中更新绘图上的 xy 数据

问题描述

我正在通过使用以下代码生成 JSON 来使用 plotly 构建网页:

def get_json_data() -> str:
    df1 = pd.read_csv()
    fig = make_subplots(
        rows=2, cols=1,
        shared_xaxes=True,
        vertical_spacing=0.03,
        specs=[[{"type": "xy"}],
               [{"type": "table"}]],
        subplot_titles=["Close price history", "Close price forecast"],
    );
    fig1 = px.line(df1, x=df1.index, y='field']);
    fig.add_trace(fig1['data'][0], row=1, col=1);
    fig.add_table(
        header=dict(values=["ColumnA"]),
        cells=dict(values=[[100]),
        domain=dict(x=[0, 1], y=[0, 0.3]),
        row=2, col=1
    );
    fig.update_layout(
        autosize=False,
        height=1300,
        width=1500);
    graphJSON = json.dumps(fig, cls=plotly.utils.PlotlyJSONEncoder, indent=4);
    return graphJSON;

结果用于呈现具有以下内容的 html 文件div

<div id='chart' class='chart'”&gt;</div>

和一个脚本,如

<script type='text/javascript'>
  var graphs = {{graphJSON | safe}};
  Plotly.plot('chart',graphs,{});
</script>

当新数据到来时,我想更新绘图的 x 和 y 数据,而不是整个页面。例如,如果用户放大了,我不想刷新一切让他/她再次放大,但我只想添加新数据。有可能用情节来做到这一点吗?

标签: pythonhtmlplotlyplotly-express

解决方案


推荐阅读