Bar and Column

author(s): Torstein Hønsi

by Pranav Kulkarni

HTML

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

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

JavaScript

// Define a custom symbol path
Highcharts.SVGRenderer.prototype.symbols.bar = function (x, y, w, h) {
    return ['M', x, y + h/2, 'L', x + w , y + h/2, 'Z'];
};
if (Highcharts.VMLRenderer) {
    Highcharts.VMLRenderer.prototype.symbols.bar = Highcharts.SVGRenderer.prototype.symbols.bar;
}
Highcharts.chart('container', {
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },

   

    series: [
    {
    type: 'column',
        data: [4.4, 50]},
    {
    type: 'scatter',
    marker: {
            symbol: 'bar',
                fillColor: 'red',
                lineWidth: 2,
                lineColor: 'red' // inherit from series
            },
        data: [50, 50]
    }]
});