Highchart - add "onclick event" for total value stackLabel

Question

This question is a follow up to In high chart how to add event for label click

Is there a way to make the total sum number (ie. 10,9, 11, 11, 8) as shown at http://jsfiddle.net/t07ok5v3/5/ clickable? (ie. add the same functionality to the "9" as the "Oranges" label). What if there is only one number per column at the top representing the sum? The following code was the code given in the answer to add the label click.

chart.xAxis[0].labelGroup.element.childNodes.forEach(function(label)
{
    label.style.cursor = "pointer";
    label.onclick = function(){
    alert('You clicked on '+this.textContent);
    }
}

UPDATE: I have made the stackLabels all appear to be clickable (they now have cursor "pointer', see jsfiddle link below). Now I just need to add the actual functionality of the click event to the stackLabel. Can someone help me with this?

http://jsfiddle.net/w291/gc1fdd1v/

Note: I don't have access to jquery in the development environment I am using.

UPDATE 2: The answer to this other question seems to solve my problem [so far] (I will update the post with my solution if it works): Click event on clicking on the graph

pawel_d · Accepted Answer · 2017-08-01 12:13:44Z

1

For this purpose, you can use Custom Events plugin. It will allow you to add custom events on various elements like axis labels, legend, etc.

Plugin Reference:
https://www.highcharts.com/plugin-registry/single/15/Custom-Events

Example:
http://jsfiddle.net/trmks8p2/

answered Aug 1, 2017 at 12:13

pawel_d

3,0701 gold badge10 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

cs_user2017 Over a year ago

Do you know if the Custom Events plugin currently works with React-Highcharts?

pawel_d Over a year ago

I did not test it but I do not see why it would not. You can try and test it by yourself.

Collectives™ on Stack Overflow

Highchart - add "onclick event" for total value stackLabel

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related