Accepted answer

I was able to achieve it by adding the series as :

              enableMouseTracking: false,

              marker: {
                enabled: false
              dataLabels: {
                defer: false,
                enabled: true,
                y: 40,
                style: {
                    fontSize: '20px',
                    color: 'white'
                format: '{}'
              keys: ['x', 'y', 'name'],
              data: [
                [5.5, 30, Chinese],
                [4, 85, English],
                [2.5, 30, Russian]

complete link :


Well, you can try to use dataLabels, like this: but you will get only one label per circle.

I think the only solution is to use renderer to add texts to the chart. But first you need to calculate where put that label, and that's the hardest part - find intersection for a few circles. After that add labels this way in load event.

Related Query

More Query from same tag