Highcharts Demo

author(s): Torstein Hønsi

by Murali Kaliappan

HTML

<div id="container" style="height: 400px"></div>
<script src="https://code.highcharts.com/highcharts.js"></script>

JavaScript

var optimumLineValue = 135;
Highcharts.chart('container', {
    chart: {
        type: 'line'
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },  
    yAxis :{
    	plotLines :[{
      	value : optimumLineValue,
        color:"green",
        width:1,
        dashStyle:"DashDot",
          zIndex : 8,
          label : { text : "this is text", x : 75,y:-4,style :{ color : "green",fontSize : "14px"} }
        }]
    },
    series: [{
        data: [{y:29.9,color:'red'}, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, {y:54.4,color:'red'}]
   },optimumLineValue != null ? {
						  			 name : "Optimum Line",
						  			 color:'green',
						  			 data : [optimumLineValue],
						  			 marker: { enabled: false },
						  			 dataLabels: { enabled: false },
						  			 enableMouseTracking: false,	
						  			 events: {
						  	            legendItemClick: function () {
						  	                return false; 
						  	            }
						  	        }
						  		 } : { showInLegend : false }],
    
});