Question

我已经成功地从python创建了图形图，并且为数据点创建了自定义html工具提示。但是，如果有人点击数据点，我没有成功添加打开链接的功能。我想要的是弹出一个单独的选项卡，显示链接到该特定数据点的更多信息。

任何人都可以想到一种方法来实现这一点吗？

Answer 1

这是一个解决方法，但它确实实现了所需的功能

您可以将一些html放入注释中。这包括Text形式的超链接。

如果要单击某个点而不是文本，则可以对位于数据点上方的空字符串Text =“”进行注释。

我倾向于使用python API创建我的绘图，因此注释的代码将采用以下形式：

plotAnnotes = []

plotAnnotes.append(dict(x=xVal[i],
                        y=yVal[i],
                        text="""<a href="https://plot.ly/">{}</a>""".format("Text"),
                        showarrow=False,
                        xanchor='center',
                        yanchor='center',
                        ))

并在布局中包含annotations = plotAnnotes。 xVal [i]和yVal [i]的值将来自您的数据。

Answer 2

现在还不太可能，但最好的选择可能是在文本中包含一个链接作为悬停，这是一个示例：https://plot.ly/~chris/2540（单击代码选项卡以查看如何复制图表）

Answer 3

我认为最好的办法是将图表嵌入网页，然后使用PostMessage API收听点击事件。

Plotly做了几个教程;其中一个用于plotly.js，另一个用于embedded chart。

希望这些帮助！

Answer 4

FigureWidget here有一种对我有用的解决方法。

Answer 5

如果您使用 Dash，您可以将网址存储在 customdata 字段中，并在处理 clickData 输入的回调中检索它，如下所示。

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

app = dash.Dash(__name__)
df = pd.DataFrame(
    dict(
        x=[1, 2],
        y=[2, 4],
        urls=["https://www.google.com","https://plotly.com/dash/"],
    )
)
app.layout = html.Div(
    [
        dcc.Graph(
            id="graph-id",
            figure=px.scatter(data_frame=df, x="x", y="y", custom_data=("urls",)),
        ),
    ]
)

@app.callback(
        Output('graph-id', 'children'), 
        [Input('graph-id', 'clickData')])
        def open_url(clickData):
            if clickData != 'null':
            url = clickData['points'][0]['customdata'][0]
            webbrowser.open_new_tab(url)
        else:
            raise PreventUpdate

通过点击图中的数据点打开网址？

5 个答案: