Highcharts Legend Symbol Position

by klodoma

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="container" style="height: 400px"></div>

JavaScript

Highcharts.chart('container', {

  chart: {
    type: 'column'
  },

  title: {
    text: 'Round legend symbols'
  },

  xAxis: {
    categories: ['Jan', 'Feb', 'Mar', 'Apr']
  },

  legend: {
    align: "left",
    verticalAlign: "top",
    layout: "vertical",
    floating: true,
		x: 80,
    y: 40,

		useHTML: true,
    symbolHeight: 5,
    symbolWidth: 5,
    symbolRadius: 0,
    
    "itemStyle": {
      "color": "#000",
      "fontSize": "20px",
      "fontFamily": "Arial",
      "fontWeight": "bold",
      "fontStyle": "normal"
    }    
  },

  series: [{
    data: [1, 3, 2, 4]
  }, {
    data: [6, 4, 5, 3]
  }, {
    data: [2, 7, 6, 5]
  }]

});