时间戳

首页 > 解决方案 > 如何使用滑块将交互式文本添加到 Plotly 条形图？

python - 如何使用滑块将交互式文本添加到 Plotly 条形图？

问题描述

我希望添加交互式文本（如 KPI）以在图表上显示变量。以下是带有滑块的散点图上的 plotly 文档中的示例。我想这样做，但还要在顶部添加文字，说明任何给定年份的平均人口数量并相应更新。例如：对于 1952 年的滑块，图表的顶部会显示 16950402。我还想将其保留在 plotly express 中。

我知道我可以为此使用悬停标签，但我更希望在图表顶部有一些大文本。

有谁知道如何做到这一点？我知道添加带有变量的图形标题或注释是可能的，但我不知道如何使用滑块更新它。

import plotly.express as px

df = px.data.gapminder()
text = df.groupby("year").pop.mean().round(0)
fig = px.scatter(df, x="gdpPercap", y="lifeExp", animation_frame="year", animation_group="country",
           size="pop", color="continent", hover_name="country", 
           log_x=True, size_max=55, range_x=[100,100000], range_y=[25,90])

fig["layout"].pop("updatemenus") # optional, drop animation buttons
fig.show()

这是我想要的输出的一个例子，但我希望标题/文本随滑块改变： 输出

标签： pythonplotly

解决方案

即使有一些可能的错误，我也会根据评论的要求添加代码。这里的想法是使用通过为每个帧px添加标题并redraw = True为每个步骤设置生成的帧fig.layout.sliders[0].steps。

import plotly.express as px

df = px.data.gapminder()
text = df.groupby("year").pop.mean().astype(int).values

fig = px.scatter(df, x="gdpPercap", y="lifeExp", animation_frame="year", animation_group="country",
           size="pop", color="continent", hover_name="country", 
           log_x=True, size_max=55, range_x=[100,100000], range_y=[25,90])\
        .update_layout(
#                        title="Avg Population: {}".format(text[0]), 
                       title_x=0.5)


for i, frame in enumerate(fig.frames):
    frame.layout.title = "Avg Population: {}".format(text[i])
    
for step in fig.layout.sliders[0].steps:
    step["args"][1]["frame"]["redraw"] = True

fig.show()

推荐阅读