Highcharts Demo

author(s): Torstein Hønsi

HTML

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

JavaScript

$(function () {
    var chart = new Highcharts.Chart({

        "series": [{"name":"Promotors","data":[267,187],"stack":0,"type":"column","color":"rgba(0,255,0,.2)","borderWidth":0,"shadow":"false","yAxis":1},{"name":"Neutral","data":[104,95],"stack":0,"type":"column","color":"rgba(255,255,0,.2)","borderWidth":0,"shadow":"false","yAxis":1},{"nahttp://jsfiddle.net/jya9x/57/#runme":"Detractors","data":[143,81],"stack":0,"type":"column","color":"rgba(255,0,0,.2)","borderWidth":0,"shadow":"false","yAxis":1},{"data": [{
                    "y": -26.64
            }, {
                    "y": 80.99
            }, {
                "name": "Total Opinions: 675",
                    "y": 35.7
            }, {
                "name": "Total Opinions: 734",
                    "y": 0.47
            }, {
                "name": "Total Opinions: 599",
                    "y": -3.5
            }, {
                "name": "Total Opinions: 536",
                    "y": 0
            }, {
                "name": "Total Opinions: 556",
                    "y": 6.98
            }, {
                "name": "Total Opinions: 510",
                    "y": 4.54

            }],}],
            
            "yAxis": [{
            "title": {
                "text": "NPS"
            },
            max: 50,
            min: -50
        }, {
            "title": {
                "text": "%"
            },
                max: 100,
                min: 0,
                "opposite": false
        }
        ],
            "title": {
            "text": "Net Promotor Score (NPS)"
        },

            "tooltip": {
            //            style: {
            //                "useHTML": true
            //            }
            formatter: function () {
                switch (this.series.name) {
                    case "Promotors":
                        return "<b>" + this.y + "</b> out of " + this.total + " are Promoter";
                    case "Neutral":
                  ...