如何通过点击Python Plotly中的数据点打开URL？

Plotly支持两个不同的库："Dash应用中的Plotly图形"和"Plotly图形对象和Plotly Express"。

Dash是一个Python框架，用于创建交互式基于Web的仪表板应用程序。例如，dash库添加了所有所需的库以用于基于Web的仪表板应用程序。

导入dash核心组件和HTML组件。使用plotly.express方法生成图形。使用Dcc.Graph()方法设置高度和宽度坐标的样式。

按照下面的步骤通过单击数据点打开URL。

步骤1

导入Dash库。

import dash

步骤2

导入Dash核心组件dcc和html。

from dash import dcc, html

步骤3

使用以下模块导入Dash依赖项：

from dash.dependencies import Input,Output

步骤4

导入plotly.express模块并将其别名设置为px。

import plotly.express as px

步骤5

使用pandas模块生成数据集。让我们使用以下方法生成数据集，并在dataframe字典中添加URL。

df = pd.DataFrame(
   dict(
      x=[1, 2],
      y=[2, 4],
      urls=["https://www.tutorialspoint.com","https://plotly.com/dash/"],
   )
)

步骤6

使用URL坐标生成散点图，

fig = px.scatter(df, x="x", y="y",custom_data=["urls"])

步骤7

创建update_layout()方法，执行单击事件并设置标记大小的跟踪。它在下面定义，

fig.update_layout(clickmode='event+select')
fig.update_traces(marker_size=20)

步骤8

在div节中为HTML子项生成应用程序布局。它在下面定义，

app.layout = html.Div([
   dcc.Graph(
      id="graph_interaction",
      figure=fig,
   ),
   html.Pre(id='data')
])

步骤9

生成“url onclick”事件的功能。我们还将设置“if”条件以执行浏览器onclick事件。它在下面定义，

@app.callback(
   Output('data', 'children'),
   Input('graph_interaction', 'clickData'))

def open_url(clickData):
   if clickData:

webbrowser.open(clickData["points"][0]["customdata"][0])
   else:
      raise PreventUpdate

步骤10

创建主要函数以运行服务器。

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

示例

在 Plotly 中单击数据点以打开 URL 的完整代码如下 −

import webbrowser
import dash
from dash.exceptions import PreventUpdate
from dash import dcc, html
from dash.dependencies import Input, Output
import plotly.express as px
import pandas as pd
import json

app = dash.Dash(__name__)
df = pd.DataFrame(
   dict(
      x=[1, 2],
      y=[2, 4],
      urls=["https://www.tutorialspoint.com","https://plotly.com/dash/"],
   )
)
fig = px.scatter(df, x="x", y="y",custom_data=["urls"])
fig.update_layout(clickmode='event+select')
fig.update_traces(marker_size=20)

app.layout = html.Div(
   [
      dcc.Graph(
         id="graph_interaction",
         figure=fig,
      ),
      html.Pre(id='data')
   ]
)

@app.callback(
   Output('data', 'children'),
   Input('graph_interaction', 'clickData'))
def open_url(clickData):
   if clickData:
   webbrowser.open(clickData["points"][0]["customdata"][0
])
   else:
      raise PreventUpdate
      # return json.dumps(clickData, indent=2)

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