Plotly:悬停信息中不可读的文本
Plotly: Unreadable text in hover info
借助 Plotly,我可以使用以下代码生成条形图:
import plotly.graph_objects as go
trace0 = dict(
x=list(range(24)),
y=[163, 154, 114, 61, 32, 19, 20, 20, 26, 38, 67, 102, 132, 159],
name="Two",
type="bar",
marker={"color": "rgba(81, 133, 198, 0.3)", "line": {"width": 0}},
)
trace1 = dict(
x=list(range(24)),
y=[0, 0, 0, 4, 19, 37, 49, 49, 39, 25, 7, 1, 0, 0],
name="One",
type="bar",
marker={"color": "rgba(240, 240, 240, 1.0)", "line": {"width": 0}},
)
data = [trace0, trace1]
layout = go.Layout(
paper_bgcolor="rgba(0,0,0,0)",
plot_bgcolor="rgba(0,0,0,0)",
hovermode="x",
)
go.Figure(data=data, layout=layout).update_layout(barmode="stack")
唯一的问题是悬停信息中的标签文本不可读,因为使用的背景颜色与标签颜色太接近:
我该如何解决?是否可以更改悬停信息标签文本背景的颜色或悬停信息标签文本的颜色?
在 plotly community forum 你可以看到:
The text associated to each hoverbox is in fact the trace name. By
default, the line_color/marker_color is inherited by the trace name
color to help users identify each scatter trace by color. You can
change only bgcolor and font_color
所以不,似乎没有一种方法可以在不改变痕迹的颜色属性的情况下改变你想要的东西。如果您真的 想要保留颜色并克服悬停框中信息的可见性差,您可以将 hovermode="x"
更改为 hovermode="x unified"
并改为获取此内容:
另一种方法是使用 hovertemplate
删除多余的文本。您可以在模板中使用 <extra></extra>
以将其删除。
这也为控制悬停信息的外观提供了额外的灵活性。
例如:
import plotly.graph_objects as go
trace0 = dict(
x=list(range(24)),
y=[163, 154, 114, 61, 32, 19, 20, 20, 26, 38, 67, 102, 132, 159],
name="Two",
type="bar",
marker={"color": "rgba(81, 133, 198, 0.3)", "line": {"width": 0}},
hovertemplate="<b>Two</b><br>%{y:,.2f} €<extra></extra>",
)
trace1 = dict(
x=list(range(24)),
y=[0, 0, 0, 4, 19, 37, 49, 49, 39, 25, 7, 1, 0, 0],
name="One",
type="bar",
marker={"color": "rgba(240, 240, 240, 1.0)", "line": {"width": 0}},
hovertemplate="<b>One</b><br>%{y:,.2f} €<extra></extra>",
)
data = [trace0, trace1]
layout = go.Layout(
paper_bgcolor="rgba(0,0,0,0)",
plot_bgcolor="rgba(0,0,0,0)",
hovermode="x",
)
go.Figure(data=data, layout=layout).update_layout(barmode="stack")
借助 Plotly,我可以使用以下代码生成条形图:
import plotly.graph_objects as go
trace0 = dict(
x=list(range(24)),
y=[163, 154, 114, 61, 32, 19, 20, 20, 26, 38, 67, 102, 132, 159],
name="Two",
type="bar",
marker={"color": "rgba(81, 133, 198, 0.3)", "line": {"width": 0}},
)
trace1 = dict(
x=list(range(24)),
y=[0, 0, 0, 4, 19, 37, 49, 49, 39, 25, 7, 1, 0, 0],
name="One",
type="bar",
marker={"color": "rgba(240, 240, 240, 1.0)", "line": {"width": 0}},
)
data = [trace0, trace1]
layout = go.Layout(
paper_bgcolor="rgba(0,0,0,0)",
plot_bgcolor="rgba(0,0,0,0)",
hovermode="x",
)
go.Figure(data=data, layout=layout).update_layout(barmode="stack")
唯一的问题是悬停信息中的标签文本不可读,因为使用的背景颜色与标签颜色太接近:
我该如何解决?是否可以更改悬停信息标签文本背景的颜色或悬停信息标签文本的颜色?
在 plotly community forum 你可以看到:
The text associated to each hoverbox is in fact the trace name. By default, the line_color/marker_color is inherited by the trace name color to help users identify each scatter trace by color. You can change only bgcolor and font_color
所以不,似乎没有一种方法可以在不改变痕迹的颜色属性的情况下改变你想要的东西。如果您真的 想要保留颜色并克服悬停框中信息的可见性差,您可以将 hovermode="x"
更改为 hovermode="x unified"
并改为获取此内容:
另一种方法是使用 hovertemplate
删除多余的文本。您可以在模板中使用 <extra></extra>
以将其删除。
这也为控制悬停信息的外观提供了额外的灵活性。
例如:
import plotly.graph_objects as go
trace0 = dict(
x=list(range(24)),
y=[163, 154, 114, 61, 32, 19, 20, 20, 26, 38, 67, 102, 132, 159],
name="Two",
type="bar",
marker={"color": "rgba(81, 133, 198, 0.3)", "line": {"width": 0}},
hovertemplate="<b>Two</b><br>%{y:,.2f} €<extra></extra>",
)
trace1 = dict(
x=list(range(24)),
y=[0, 0, 0, 4, 19, 37, 49, 49, 39, 25, 7, 1, 0, 0],
name="One",
type="bar",
marker={"color": "rgba(240, 240, 240, 1.0)", "line": {"width": 0}},
hovertemplate="<b>One</b><br>%{y:,.2f} €<extra></extra>",
)
data = [trace0, trace1]
layout = go.Layout(
paper_bgcolor="rgba(0,0,0,0)",
plot_bgcolor="rgba(0,0,0,0)",
hovermode="x",
)
go.Figure(data=data, layout=layout).update_layout(barmode="stack")