javascript - Get name of clicked point in Highcharts when the point has drilldown - Stack Overflow

admin管理员组

文章数量:1279090

I have a pie chart where one of the points have drilldown and the other points do not. When I detect a click using plotOptions.series.point.events.click and try to return the name of the clicked point, it works for every point except the one with drilldown.

If I do:

plotOptions: {
  series: {
    point: {
      events: {
        click: function(e) {
          console.log(this.name);
        }
      }
    }
  }
}

Then the proper name would show up for every point except the one with drilldown, which would return a null point. It might be because the graph updates first via drilldown and the point no longer exists when the event callback occurs. How can I make it so that both the regular points and drilldown points return properly when clicked?

I added a JSFiddle to illustrate my point: / I just took the pie drilldown example from Highcharts demo page and made it so that Firefox does not have a drilldown. Note in the browser's console that when I click Firefox, the name gets displayed. When I click any other slice, the displayed name is null.

I have a pie chart where one of the points have drilldown and the other points do not. When I detect a click using plotOptions.series.point.events.click and try to return the name of the clicked point, it works for every point except the one with drilldown.

If I do:

plotOptions: {
  series: {
    point: {
      events: {
        click: function(e) {
          console.log(this.name);
        }
      }
    }
  }
}

Then the proper name would show up for every point except the one with drilldown, which would return a null point. It might be because the graph updates first via drilldown and the point no longer exists when the event callback occurs. How can I make it so that both the regular points and drilldown points return properly when clicked?

I added a JSFiddle to illustrate my point: http://jsfiddle/Pq6gb/2/ I just took the pie drilldown example from Highcharts demo page and made it so that Firefox does not have a drilldown. Note in the browser's console that when I click Firefox, the name gets displayed. When I click any other slice, the displayed name is null.

• javascript
• jquery
• highcharts

Share Improve this question Follow edited Jul 3, 2014 at 16:26 user3758133 asked Jul 2, 2014 at 21:13 user3758133user3758133 23844 silver badges1313 bronze badges 3

• please create a fiddle of your code – Rahul Gupta Commented Jul 3, 2014 at 6:02
• JSFiddle added to my original question. – user3758133 Commented Jul 3, 2014 at 16:26
• Word of explanation: It's caused by calling drilldown event before point.click - in drilldown event, clicked point is destroyed. I will see why first we call drilldown, then click event. – Paweł Fus Commented Jul 4, 2014 at 11:51

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 7

This is fixed now in the current development version of drilldown.src.js: http://jsfiddle/highcharts/Pq6gb/3/

point: {
    events: {
        click: function(e) {
            console.log(e.type, this.name);
        }
    }
}

Although not ideal, this would give you some event for regular and drilldown:

chart: {
    ...,
    events: {
        drilldown:  function (e) {
            console.log(e.point); // The point, with name, that was clicked
        }
    }
}

Along with your own code this would fire one event for regular points (your own code), and two events for drilldown points. You would then be able to check name == null in series.point.events.click, and ignore it, and handle it in chart.events.drilldown (API reference).

本文标签： javascriptGet name of clicked point in Highcharts when the point has drilldownStack Overflow