0

I am working with some code that generates barcharts in highcharts and am specifically trying to get all data labels to show up even when points in a series are close or overlapping (depending on the manually/automatically set max high of the graph).

This data is generated so I can only see it on the rendered graph.

bower.json shows highcharts-release: "6.0.7

Overlapping data label

Hoping to get something similar to this example: [https://jsfiddle.net/9qc3fjk2/][1]2

Highcharts.chart('container', {
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
    plotOptions: {
        series: {
            cursor: 'pointer',
            events: {
                click: function () {
                    alert('You just clicked the graph');
            }
        }
    }
},

    series: [{
        name: 'Series 1',
        data: [30, 75, 110, 130, 140, 170, 140, 150, 210, 200, 100, 60],
}, {
        name: 'Series 2',
        data: [40, 80, 100, 120, 150, 171, 145, 140, 130, 110, 90, 70],
}],

});

  [1]: https://i.sstatic.net/qHyQC.png
  [2]: [https://jsfiddle.net/9qc3fjk2/][2]

1 Answer 1

0

It should be enough to enable the allowOverlap option.

  plotOptions: {
    series: {
      dataLabels: {
        enabled: true,
        allowOverlap: true
      }
    }
  }

Live demo: https://jsfiddle.net/BlackLabel/x03wbe8m/

API Reference: https://api.highcharts.com/highcharts/series.line.dataLabels.allowOverlap

Not the answer you're looking for? Browse other questions tagged or ask your own question.