0

Can anyone please help me, how to get the hover data by clicking on any point of highchart plots using dash and python. The code and dataset is given below for plotting the highchart bar plot. enter image description here.

code

import pandas as pd
import dash_alternative_viz as dav
import dash
from dash import html

df = pd.read_csv("bar.csv")
bar_plot_dict = {
    "series": [],
    "title": {"text": "Bar Plot"},
    "xAxis": {"categories": df["sectors"]},
    "chart": {"type": "bar", "inverted": True, "height": "900px"},
}

for col, color in zip(
    [i for i in df.columns if i.startswith("col")],
    ["green", "red", "yellow"],
):
    series = {
        "name": col,
        "data": df[col],
        "color": color,
        "type": "bar",
        "stacking": "normal",
    }
    bar_plot_dict["series"].append(series)

app = dash.Dash(__name__)
highchart_barplot = html.Div(dav.HighChart(id="line-plot", options=bar_plot_dict))
app.layout = html.Div([highchart_barplot])
app.run(port=8003, debug=True)

Dataset

,sectors,col 1,col 2,col 3

0,A,4.89555774,15.20538823,235.1483496

1,B,330.7514786,14.43483274,120.3015848

2,C,323.2680204,35.14712088,511.8969181

Muhammad Faizan
  • 76
  • 5
  • Hi @Muhammad Faizan, You can use `mouseOver` callback function from Highcharts config in JS, for example: http://jsfiddle.net/BlackLabel/2azy6g5x/ With python maybe you would be able to find HTML element with `highcharts-tooltip` class and extract required info from it. – ppotaczek Oct 06 '22 at 10:38
  • Hi @ppotaczek, Thanks for immediate reply. can you please help me how can I convert JS example code into python? – Muhammad Faizan Oct 06 '22 at 11:01
  • I don't know python well, but you just need to find a way to add JS function to the chart config. I think this thread: https://stackoverflow.com/questions/8284765/how-do-i-call-a-javascript-function-from-python can be useful for you. – ppotaczek Oct 06 '22 at 11:34

0 Answers0