another Highcharts example amount/month

by katalin_2003

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
<br />
<button id="button">Get Y axis extremes</button>
<button id="button2">Val Min/Max</button>
<ul id="legend"></ul>

CSS

li {
    cursor: pointer;
}
#legend {
    border: 1px solid #000;
    width: 200px;
}

JavaScript

$(function () {
    $('#container').highcharts({
        credits: {
            enabled: false
        },
        chart: {
            showAxes: true,
            type: 'spline',
            marginRight: 30
            /*,        // hidden legend and now chart extends to the right. default was 130
            marginBottom: 25 */
        },
        tooltip: {
            crosshairs: [true],
            shared: true
        },
        title: {
            text: 'katalin_2003',
            x: -20 //center
        },
        subtitle: {
            text: 'NPR',
            x: -20
        },
        xAxis: {
            categories: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
            labels: {
                align: 'center'
            },
            title: {
                // align: 'high',
                offset: 30,
                text: '2014',
                rotation: '0'
            }
        },
        yAxis: {
            title: {
                text: 'MARGE'
            },
            lineWidth: 1/*,
            plotLines: [{
                value: 12000,
                width: 2,
                color: 'lightgreen',
                label: {
                    text: 'MAX',
                    verticalAlign: 'right',
                    style: {
                        color: 'blue',
                        fontWeight: 'bold'
                    }
                } 
            }]*/
        },
        legend: {
            enabled: false, // using custom legend
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'top', //'middle', 'bottom'
            borderWidth: 0
        },
        series: [{
            name: "MARGE NPR",
            data: [2165, 1831, 2798, 2200, 2237, 2799, 2400, 2500, 2865, 2850, 12000, 6000]
        }, {
            name: "MARGE TRD",
            color: 'red',
            dashStyle: 'shortdot',
            data: [1165, 2831, 3198, 1500, 4337, 6499,...