# Open url when a point on a graph is clicked

**URL:** <https://community.plotly.com/t/open-url-when-a-point-on-a-graph-is-clicked/10642>\
**Category:** Dash Python\
**Created:** [June 1, 2018, 6:12pm UTC](https://community.plotly.com/t/open-url-when-a-point-on-a-graph-is-clicked/10642 "2018-06-01T18:12:48Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![zealot311](https://avatars.discourse-cdn.com/v4/letter/z/a5b964/32.png) [@zealot311](https://community.plotly.com/u/zealot311)\
**Post date:** [June 1, 2018, 6:12pm UTC](https://community.plotly.com/t/open-url-when-a-point-on-a-graph-is-clicked/10642/1 "2018-06-01T18:12:48Z")

</div>

What I am trying to do is basically the same as in the issue here: [Open url in new tab when chart is clicked on](https://community.plotly.com/t/open-url-in-new-tab-when-chart-is-clicked-on/3576), but instead of using JavaScript I would like to do this using Python inside of a Dash app. Has anyone gotten something like this to work in Python?

---

<div class="post-metadata">

**Author:** ![chriddyp](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/chriddyp/32/16855_2.png) [@chriddyp](https://community.plotly.com/u/chriddyp)\
**Post date:** [June 4, 2018, 10:27pm UTC](https://community.plotly.com/t/open-url-when-a-point-on-a-graph-is-clicked/10642/2 "2018-06-04T22:27:01Z")

</div>

I don’t think this is possible with the existing components. `dcc.Location` can be used to edit the _existing_ page’s location but it can’t be used to create a new tab. Your options are:  
Option 1 - Create your own component that wraps `window.open` ([https://dash.plot.ly/plugins](https://dash.plot.ly/plugins))  
Option 2 - Embed the page you want to open as an `html.Iframe` and update the `src` property of that `Iframe` whenever the `dcc.Graph.clickData` property changes  
Option 3 - Fork the `dcc.Graph` component and add a custom click handler

---

<div class="post-metadata">

**Author:** ![chriddyp](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/chriddyp/32/16855_2.png) [@chriddyp](https://community.plotly.com/u/chriddyp)\
**Post date:** [June 5, 2018, 8:58pm UTC](https://community.plotly.com/t/open-url-when-a-point-on-a-graph-is-clicked/10642/3 "2018-06-05T20:58:04Z")

</div>

Option 4 - Add text annotations to points of interest: [Time series plot with links to points of interest](https://community.plotly.com/t/time-series-plot-with-links-to-points-of-interest/10681/2?u=chriddyp)

---

<div class="post-metadata">

**Author:** ![pieterg](https://avatars.discourse-cdn.com/v4/letter/p/dec6dc/32.png) [@pieterg](https://community.plotly.com/u/pieterg)\
**Post date:** [January 30, 2020, 1:11pm UTC](https://community.plotly.com/t/open-url-when-a-point-on-a-graph-is-clicked/10642/4 "2020-01-30T13:11:22Z")

</div>

Has this been added in the meantime?

---

<div class="post-metadata">

**Author:** ![chriddyp](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/chriddyp/32/16855_2.png) [@chriddyp](https://community.plotly.com/u/chriddyp)\
**Post date:** [January 30, 2020, 1:51pm UTC](https://community.plotly.com/t/open-url-when-a-point-on-a-graph-is-clicked/10642/5 "2020-01-30T13:51:03Z")

</div>

it has not, but it’s still a good idea!

---

<div class="post-metadata">

**Author:** ![vahlgreen](https://avatars.discourse-cdn.com/v4/letter/v/a587f6/32.png) [@vahlgreen](https://community.plotly.com/u/vahlgreen)\
**Post date:** [May 3, 2024, 8:17am UTC](https://community.plotly.com/t/open-url-when-a-point-on-a-graph-is-clicked/10642/6 "2024-05-03T08:17:41Z")

</div>

Has this been added in the meantime?

---

<div class="post-metadata">

**Author:** ![davidharris](https://avatars.discourse-cdn.com/v4/letter/d/df705f/32.png) [@davidharris](https://community.plotly.com/u/davidharris)\
**Post date:** [May 3, 2024, 9:35am UTC](https://community.plotly.com/t/open-url-when-a-point-on-a-graph-is-clicked/10642/7 "2024-05-03T09:35:00Z")

</div>

This is a bit of a hack, and probably has its limitations, but this kind of thing does work for adding some hyperlinked text to a figure:

```python
def _add_trace_label(fig, x=0.0, label="", y=0.0, hyperlink=None, xmode="date"):
    "Add a label to a plot"
    hlinkedtext = f'<a href="{hyperlink}">{label}</a>' if hyperlink else label
    fig.add_trace(go.Scatter(x = [x], y=[y], 
                                name=label, legendgroup=label,
                                mode="text", text=hlinkedtext,
                                ))

```
