当前位置: 首页 > news >正文

go.Bar如何让hovertext显示为legend

在 Plotly 的 go.Bar 图中,如果你想让鼠标悬停时 (hover) 显示的文本 (hovertext) 与图例 (legend) 一致,可以通过 hovertemplate 来控制悬停时的显示内容。


实现方法

hovertemplate 是一种自定义工具,允许你完全控制悬停时的文本显示格式。可以将它设置为和图例名称(name 属性)一致的内容。

以下是具体方法:


完整示例

import plotly.graph_objects as go# 创建柱状图数据
fig = go.Figure()fig.add_trace(go.Bar(x=["A", "B", "C"],  # X轴数据y=[10, 20, 15],     # Y轴数据name="Legend Label 1",  # 图例名称hovertemplate='%{legendgroup}',  # 使用图例分组作为悬停文本legendgroup="Legend Label 1"  # 绑定图例和hover显示内容
))fig.add_trace(go.Bar(x=["A", "B", "C"],y=[5, 15, 10],name="Legend Label 2",hovertemplate='%{legendgroup}',  # 同样使用图例分组作为悬停文本legendgroup="Legend Label 2"
))# 更新布局
fig.update_layout(title="Bar Chart with Hovertext as Legend",xaxis_title="Categories",yaxis_title="Values",hovermode="x unified"  # 鼠标悬停效果可以设置为按x轴对齐
)fig.show()

关键点解释

  1. hovertemplate='%{legendgroup}':

    • legendgroup 属性可以绑定图例组,hovertemplate 中引用 %{legendgroup} 就能动态显示图例的名称。
  2. legendgroup 属性:

    • 图例组的作用是将图例和悬停文本绑定在一起。
    • 如果未显式设置 legendgroup,可以直接使用图例的名称(name 属性)来代替。
  3. 图例名称的来源:

    • name="Legend Label 1":柱状图的图例名称。hovertemplate 可通过 %{legendgroup} 动态使用此名称。
  4. 其他悬停数据可用字段:

    • %{x}:显示 X 轴值。
    • %{y}:显示 Y 轴值。
    • %{customdata}:显示自定义数据(如果设置了 customdata)。
    • %{text}:如果设置了 text 属性(与 hovertext 绑定),则可显示额外文本。

修改悬停文本的样式

你也可以在 hovertemplate 中使用 HTML 或其他格式化方式:

示例:
hovertemplate = '<b>%{legendgroup}</b><br>Value: %{y}<extra></extra>'
  • <b></b>:加粗图例名称。
  • <br>:换行。
  • <extra></extra>:隐藏默认的悬停框。

总结

通过设置 hovertemplate='%{legendgroup}' 并结合 legendgroup 属性,可以让悬停时的文本与图例保持一致。

http://www.lryc.cn/news/512818.html

相关文章:

  • 【Vue】分享一个快速入门的前端框架以及如何搭建
  • Flink源码解析之:如何根据JobGraph生成ExecutionGraph
  • UE(虚幻)学习(三) UnrealSharp插件中调用非托管DLL
  • leetcode 3219. 切蛋糕的最小总开销 II
  • vant 地址记录
  • Lua语言入门 - Lua常量
  • 在Microsoft Windows上安装MySQL
  • windows下vscode使用msvc编译器出现中文乱码
  • Git 解决 everything up-to-date
  • Windows配置cuda,并安装配置Pytorch-GPU版本
  • Neo4j 图数据库安装与操作指南(以mac为例)
  • 2024年12月个人工作生活总结
  • PHP:IntelliJ IDEA 配置 PHP 开发环境及导入PHP项目
  • 【嵌入式C语言】指针数组结构体
  • 国产数据库TiDB从入门到放弃教程
  • 深入解析 Spring 属性:spring.codec.max-in-memory-size
  • 在K8S中,如何查看Pod状态的详情?事件显示cpu不足如何处理?
  • ArcGIS教程(009):ArcGIS制作校园3D展示图
  • REDIS2.0
  • 算法练习——模拟题
  • 京东供应链创新与实践:应用数据驱动的库存选品和调拨算法提升履约效率
  • pytorch张量的fill_方法介绍
  • WAP短信格式解析及在Linux下用C语言实现
  • Linux的诞生与发展、体系结构与发行版本
  • 为什么Mysql用B+树作为索引
  • 探索 DC-SDK:强大的 3D 地图开发框架
  • C#高级篇 反射和属性详解【代码之美系列】
  • 算法 class 005 (对数器C语言实现)
  • windows系统安装完Anaconda之后怎么激活自己的虚拟环境并打开jupyter
  • leetcode 面试经典 150 题:矩阵置零