Highcharts : Display the labels (min, max, median etc.) in boxplot

Question

I have created a basic boxplot using highcharts and it shows me the values for maximum, max quartile, median, min quartile and minimum when I hover the mouse over the box plot. I want to somehow display these values in the plot itself beside each of the lines.

I checked out the api and found that "dataLabel" would help but this is not supported for the boxplot. Could someone enlighten me on how to achieve this?

Thanks.

Answer 1

Not possible out of the box, but as mentioned by Steve Gu achievable by scatter. You can even ignore the formatter and disable the marker alltogether:

{
  series: [
    {
      type: 'scatter',
      tooltip: {
        enabled: false
      },
      dataLabels: {
        format: '{key}',
        enabled: true,
        y: 0,
      },
      data: [{ x: 0, y: 975, name: '975'}],
      marker: {
        enabled: false,
      }
    }
  ]
}

just disable marker and set format to key.

Answer 2

Add another data series, which is a type of "Scatter" and apply the data labels to this series using Marker. The trick is to use the same fill color as your background color and 0 line width so the marker will not be visible and only the label will be shown.

{
        name: 'Outlier',
        color: 'white',
        type: 'scatter',
        data: [ // x, y positions where 0 is the first category
            {
                name: 'This is my label for the box',
                x:0,   //box index.  first one is 0.
                y:975 //it will be bigger than the maximum value of of the box
            }
        ],
        dataLabels : {
            align: 'left',
                enabled : true,
                formatter : function() {
                    return this.point.name;
                },
            y: 10,
            },
        marker: {
            fillColor: 'white',
            lineWidth: 0,
            lineColor: 'white'
        }
    }