quadrantLbelRuntime

by prakhar230792

HTML

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

<div id="container" style="min-width: 500px;"></div>

JavaScript

Highcharts.chart('container', {
	"type": "svg",
	"title": {
		"text": null
	},
	"chart": {
		"type": "scatter",
		"events": {
    	load: function(event) {
      	var chart = event.target,
        		xAxis = chart.xAxis[0];
        
        var quadrantPlotLines = {
        
        //actual plotline that I will add
        bottomLeftQuadrantLabelPlotLineTemplate: {
            id: 'bottomLeftQuadrantLabelPlotLine',
            color: '#FFFFFF',
            width: 0,
            zIndex: 5,
            label: {
                rotation: 0,
                verticalAlign: 'bottom',
                x: 10,
                y: -10,
                style: {}
            }
        }
        };
        
        for (var index = 0; index < xAxis.plotLinesAndBands.length; index++) {
        //iterating already added plotlines to get the quadrant label of the plotline
        	if (xAxis.plotLinesAndBands[index].id == 'bottomLeftQuadrantLabelPlotLineTemplate') {
          	var plotLine = quadrantPlotLines[xAxis.plotLinesAndBands[index].id];
            plotLine.value = xAxis.min;
            //copying quadrant label plotline
            plotLine.label.text = xAxis.plotLinesAndBands[index].options.label.text;
            plotLine.label.style.width = 300 + 'px';
            //remove the plotline that was added at the time of creating chart json object
            xAxis.removePlotLine(xAxis.plotLinesAndBands[index].id);
            //adding new plotline with quadrant laebl
            xAxis.addPlotLine(plotLine);
          
          }
        	
        }
      }
    }
	},
	"plotOptions": {
		"series": {
			"showInLegend": false
		}
	},
	"legend": {
		"enabled": false
	},
	"tooltip": {
		"backgroundColor": "#5F5F5F",
		"borderColor": "#5F5F5F",
		"shadow": false,
		"style": {
			"color": "#FAFAFA",
			"opacity": 0.95
		}
	},
	"colors":...