Plotly：悬停文本字段中的日期格式问题

Posted 2023-02-19

【中文标题】Plotly：悬停文本字段中的日期格式问题

【英文标题】：Plotly: Date format problem in hover text field

【发布时间】：2021-04-04 00:33:44

【问题描述】：

我正在使用 plotly express 时间线功能绘制甘特图。我在日期字段的悬停文本呈现方面遇到问题。

plotly version: 4.5.4

这里给出的原始示例https://plotly.com/python/gantt/，Finish 字段以正确的格式呈现为%Y-%m-%d。

import plotly.express as px
import pandas as pd

df = pd.DataFrame([
    dict(Task="Job A", Start='2009-01-01', Finish='2009-02-28', Resource="Alex")
])

fig = px.timeline(df, x_start="Start", x_end="Finish", y="Task", color="Resource")
fig.update_yaxes(autorange="reversed")
fig.show()

我尝试使用以下代码自定义悬停文本字段。

import plotly.express as px
import pandas as pd


df = pd.DataFrame([
    dict(Task="Job A", Start='2009-01-01', Finish='2009-02-28', Resource="Alex")
])

fig = px.timeline(df, x_start="Start", x_end="Finish", y="Task", color="Resource"
                  , hover_data="Start": True, 
                              "Finish": True, 
                              "Task": True, 
                              "Resource": False
                 )

fig.show()

现在，显示的 Finish 字段是 Start 和 Finish 的差异（以毫秒为单位）。在上面的示例中，“完成”值显示为 5011200000。

我需要在悬停文本中显示原始的 Finish 值。在这种情况下2009-02-28。

我只能通过在我的数据框中创建 Finish 列的副本并将其用于悬停文本来解决此问题。

有没有一种方法可以在不复制的情况下正确渲染列？

【参考方案1】：

您可以使用 hovertemplate 更改悬停工具提示中显示的值的格式，请参阅 Plotly 网站上的 example 以及 Plotly documentation。

我根据您的代码在下面提供了一个示例，其中开始日期和结束日期均采用%Y-%m-%d 格式。请注意，x_start 和 x_end 对应于 Plotly 图形字典中的 base 和 x 键。

import plotly.express as px
import pandas as pd

df = pd.DataFrame([
    dict(Task="Job A", Start='2009-01-01', Finish='2009-02-28', Resource="Alex"),
    dict(Task="Job B", Start='2009-03-01', Finish='2009-04-30', Resource="Anna")
])

fig = px.timeline(df, x_start="Start", x_end="Finish", y="Task", color="Resource")

fig.update_traces(hovertemplate="Start: %base|%Y-%m-%d<br>"
                                "End: %x|%Y-%m-%d<br>"
                                "Task: %y")

fig.show()

【讨论】：

hovertemplate 确实解决了格式化问题，但我失去了从数据框中显示另一个字段的能力。例如，如果我想在悬停文本中显示优先级列，是否可以使用悬停模板来完成？

是的，您可以使用 hovertemplate 和 customdata 做到这一点，请参阅此示例 chart-studio.plotly.com/~empet/15366/…。

感谢您的帮助。我面临的问题似乎记录了错误。 github.com/plotly/plotly.py/issues/2518。我正在使用 hover_data 在同一个数据框中呈现数据。使用 hovertemplate，我将不得不创建一个副本或不同的 Dataframe 来呈现其他字段。我暂时保留重复字段。