Dock highcharts legend to very bottom of chart

0
votes

I have a very simple and compact chart that needs to be placed to the verry bottom of the chart (grey box), not the plot area, as shown: (I want the legend to be placed where the red one is). I've tried a lot from the highcharts docs but so far nothing. PS.: the dimensions really need to stay like that :)

Target

Here is the fiddle I've been playing with: https://jsfiddle.net/gq2hywa7/2

1
javascripthighchartsreact-highcharts

1 Answers

1
votes

You can customize the legend position by setting legend.x and legend.y properties.

Demo: https://jsfiddle.net/BlackLabel/8qofaewj/

  "legend": {
    "enabled": true,
    "padding": 0,
    "itemHoverStyle": {
      "color": "rgba(0,0,0,0.8)"
    },
    "backgroundColor": "#FFFFFF",
    "margin": 0,
        y: 13
  },

API: https://api.highcharts.com/highcharts/legend.y