0

We use highcharts to display different types of data. It all works fine. Now, our goal is to add a call out functionality.

The callouts should be added to very specific instances wherever the hikes in the points are found.

I saw this example

Adding call outs to a Highcharts - Stacked Bar

but this adds callouts for all the points. As per my use case, I need add callouts only for John as per the above example.

Community
  • 1
  • 1
user1050619
  • 19,822
  • 85
  • 237
  • 413

1 Answers1

1

You can use Pawel's solution from similar topic: Adding call outs to a Highcharts - Stacked Bar

You can add if statement inside your dataLabels formatter to check if your dataLabel is connected with specific series. Then you can show the callout or remove label, depending on the series name.

  formatter: function() {
    return this.series.name === 'John' ? '<div class="callout top" data-name="Jane">Callout for John!</div>' : false;
  }

Here you can find an example how it can work: http://jsfiddle.net/5joufkwa/30/

Community
  • 1
  • 1
Grzegorz Blachliński
  • 5,132
  • 10
  • 13
  • This worked. Is there a way to dynamically add callouts once the graph is generated? The callouts and its values are stored in a separate table. Once the graph is generated I read those values and apply the callouts. – user1050619 Sep 08 '16 at 16:36
  • You can change an idea of adding the callouts and use Render.label method in your case. Look at this example: http://jsfiddle.net/5joufkwa/31/ – Grzegorz Blachliński Sep 09 '16 at 08:52