Highcharts : drawing a line on using 'Renderer' path API

by KSK Kushwah

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="height: 300px; width:300px;"></div>

<br>
    <a href="http://api.highcharts.com/highcharts#Renderer.path">Renderer API documentation</a>

JavaScript

$(function () {
    $('#container').highcharts({
    
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar']
        },
    
        series: [{
            data: [29.9, 71.5, 256]
        }]
    
    }, function(chart) { // on complete
         console.log("chart = ");
        console.log(chart);
        //chart.renderer.path(['M', 0, 0, 'L', 100, 100, 200, 50, 300, 100])
        chart.renderer.path(['M', 75, 223.5,'L', 259, 47])//M 75 223.5 L 593 223.5
            .attr({
                'stroke-width': 2,
                stroke: 'red'
            })
            .add();
        
    });
});