如何在 Python Plotly 中的鼠标悬停在点上时显示图像?
Plotly 是一个开源的 Python 绘图库,可以生成多种不同类型的图表。Python 用户可以使用 Plotly 创建交互式基于 Web 的可视化,这些可视化可以在 Jupyter 笔记本中显示,保存为独立的 HTML 文件,或作为使用 Dash 的 Web 应用程序的一部分服务。Plotly 也可以在静态文档发布和桌面编辑器(如 PyCharm 和 Spyder)中使用。
Dash 是一个 Python 框架,它用于创建交互式基于 Web 的仪表板应用程序。 dash 库将所有必需的库添加到基于 Web 的仪表板应用程序中。
在本教程中,我们将展示如何在单个浏览器页面上向 Plotly Dash 应用程序添加多个图形。
按照下面的步骤在单个页面上生成 Dash 应用程序。
步骤1
导入 Dash 库。
步骤2
导入 Dash 核心组件,dcc 和 html。我们将使用 dcc.Graph() 方法来设置高度和宽度坐标的样式。
步骤3
使用以下模块导入 Dash 依赖项。
步骤4
导入 plotly.express 模块,并将其别名为 px。我们将使用此方法生成图形。
步骤5
使用 Pandas 模块生成数据集。
步骤6
从特定网址设置图像。示例网址定义如下-
步骤7
创建一个使用 X 和 Y 坐标的散点图 –
步骤8
使用以下命令创建主函数来运行 App 服务器。
步骤9
使用 update_layout() 方法执行单击模式,并使用 update_traces() 方法执行标记大小。
步骤10
生成 App 布局以显示 Dash 图形。它定义如下,
步骤11
创建 callback() 函数,以在特定坐标上悬停数据,如下所示 –
示例
显示悬停 Dash 图中图像的完整代码 –
输出
它将在控制台上显示以下内容。
点击URL,它将在浏览器上显示结果 −
现在,将鼠标悬停在坐标(1,2)上,您将看到以下输出−
同样,当您将鼠标悬停在第二个点上时,它将生成以下输出−