在条形图上悬停数据而不绘制文本-Plotly

问题描述

我正在努力做一些可能很简单的事情。
考虑一下：我有单位ID，每个单位ID都有数据。
我想构造一个条形图，并能够选择我想要的任何单位ID。
为此，我选择了px。我正在根据某种范围分割方法（使用pd.cut）构造条形图
我得到的结果非常接近我想要的结果。
当我将鼠标悬停在图表的不同单位上时，我会看到单位ID，范围和确切值但是文本也被绘制在图形上，使图形非常混乱。
我尝试使用归因于替换％{text}％的其他px.bar，但没有成功。

再现我所拥有情节的小代码

import dash_core_components as dcc
import numpy as np
import pandas as pd
import dash
import dash_html_components as html
import plotly.express as px

data = np.random.rand(300)
unit_id = np.random.choice(range(1000),300,replace=False)
data_tuple = sorted([(str(uid),data) for uid,data in zip(unit_id,data)],key=lambda x: x[1])

y_data = [y[1] for y in data_tuple]
x_data = [i for i in range(1,len(y_data) + 1)]
range_bins = pd.cut(np.array(np.array(y_data).astype(float)),10)
data_range_lbl = [str(v) for v in range_bins]

sorted_unit_id = [x[0] for x in data_tuple]
unit_id_text = [sorted_unit_id[i] + '<br><b>Value</b>: ' + str(y_data[i]) for i in range(0,len(sorted_unit_id))]
fig = px.bar(x=data_range_lbl,y=[1 for i in range(0,len(data_range_lbl))],text=unit_id_text)

fig.update_layout(dragmode='select')
fig.update_traces(hovertemplate=
                  '<b>Die Id</b>: %{text}' +
                  '<br><b>Range</b>: %{x}<br>')
app = dash.Dash(__name__)
app.layout = html.Div([
    html.Div(id='container-button-timestamp'),dcc.Graph(
        id='sample-graph',figure=fig
    ),])

if __name__ == '__main__':
    app.run_server(debug=True,port=8050)

外观：

解决方法

使用hovertext可以达到目的。

从px.bar属性中删除了text：
fig = px.bar(x=data_range_lbl,y=[1 for i in range(0,len(data_range_lbl))])

并更改了fig.update_traces：

fig.update_traces(
    hovertext=unit_id_text,hovertemplate=
    '<b>Die Id</b>: %{hovertext}' +
    '<br><b>Range</b>: %{x}<br>')

bar-chart plotly python