Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

345
Views
Add hyperlink to Python Plotly Sunburst diagram

If possible, I need to add hyperlinks to a Plotly Sunburst chart so that a user can click and go to a webpage with more information.

Sunburst chart showing where hyperlinks are needed

I've tried organizing the data two different ways

Here's the data in coffeeURL.csv:

ids,labels,parents
Enzymatic-Flowery,Flowery,
Enzymatic-Fruity,Fruity,
Enzymatic-Herby,Herby,
<a href=Flower-Floral.html>Flowery-Floral</a>,Floral,Enzymatic-Flowery
<a href=Flower-Fragrant.html>Flowery-Fragrant</a>,Fragrant,Enzymatic-Flowery
<a href=Fruity-Citrus.html>Fruity-Citrus</a>,Citrus,Enzymatic-Fruity
<a href=Fruity-Berry-like.html>Fruity-Berry-like</a>,Berry-like,Enzymatic-Fruity
<a href=Herby-Alliaceous.html>Herby-Alliaceous</a>,Alliaceous,Enzymatic-Herby
<a href=Herby-Leguminous.html>Herby-Leguminous</a>,Leguminous,Enzymatic-Herby

Here's the script:

import plotly.graph_objects as go
import pandas as pd

df = pd.read_csv('coffeeURL.csv')

fig = go.Figure()

fig.add_trace(go.Sunburst(
    ids=df.ids,
    labels=df.labels,
    parents=df.parents,
    domain=dict(column=1),
    maxdepth=2,
    insidetextorientation='radial'
))

fig.update_layout(
    margin = dict(t=10, l=10, r=10, b=10)
)

fig.show()
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

  • you can achieve this is you use dash and a callback
  • your URLs are not accessible to me so have used results of a Google search with results going into an Iframe
import pandas as pd
import io
import plotly.graph_objects as go
from jupyter_dash import JupyterDash
from dash import html, dcc
from dash.dependencies import Input, Output
from dash.exceptions import PreventUpdate

# Build App
app = JupyterDash(__name__)

df = pd.read_csv(io.StringIO("""ids,labels,parents
Enzymatic-Flowery,Flowery,
Enzymatic-Fruity,Fruity,
Enzymatic-Herby,Herby,
<a href=Flower-Floral.html>Flowery-Floral</a>,Floral,Enzymatic-Flowery
<a href=Flower-Fragrant.html>Flowery-Fragrant</a>,Fragrant,Enzymatic-Flowery
<a href=Fruity-Citrus.html>Fruity-Citrus</a>,Citrus,Enzymatic-Fruity
<a href=Fruity-Berry-like.html>Fruity-Berry-like</a>,Berry-like,Enzymatic-Fruity
<a href=Herby-Alliaceous.html>Herby-Alliaceous</a>,Alliaceous,Enzymatic-Herby
<a href=Herby-Leguminous.html>Herby-Leguminous</a>,Leguminous,Enzymatic-Herby"""))

fig = go.Figure()

fig.add_trace(go.Sunburst(
    ids=df.ids,
    labels=df.labels,
    parents=df.parents,
    domain=dict(column=1),
    maxdepth=2,
    insidetextorientation='radial'
))

fig.update_layout(
    margin = dict(t=10, l=10, r=10, b=10)
)

app.layout = html.Div(
    [
        dcc.Graph(
            id="figure",
            figure=fig,
        ),
        html.Iframe(
            id="details",
            src="https://www.google.com/search?igu=1&ei=&q=flowers",
            style={"height": "1067px", "width": "100%"},
        ),
    ]
)


@app.callback(Output("details", "src"), [Input("figure", "clickData")])
def clickPoint(clickData):
    if clickData:
        try:
            clicked_id = clickData["points"][0]["id"]
            clicked_id = clicked_id.split(">")[1].split("<")[0]
            return f"https://www.google.com/search?igu=1&ei=&q={clicked_id}"
        except IndexError:
            raise PreventUpdate
    else:
        raise PreventUpdate


app.run_server(mode="inline")
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!