Highcharts Demo

author(s): Gopinagh

by gopinaghr

HTML

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

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

JavaScript

$(function () {
    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'pie'
        },
        
        plotOptions: {
            pie: {
                   dataLabels: {
                        enabled: true,
                        color: '#000000',
                        connectorColor: '#000000',
                        softConnector: true,
                        formatter: function() {
                            var point = this.point.name;
                            if(point.contains("Quantity Remaining"))
                            {
                                return '<b style="color:red;font-size:20px">'+ this.series.name +'</b>';
                            }
                            else
                            {
                                 return this.point.name;
                            }
                        }
                    }
            }
        },
        
        series: [{ name: 'Zumo de Piña 0,5L' ,data: [  ['Utilized Quantity and Returned Quantity(0.0)',0.0  ], {  name: 'Pickup Quantity(0)',  y: 0.0,  sliced: true, selected: true  },  ['Quantity Loss(0)', 0.0],['Quantity Remaining(1000.0)',100.0] ],   size : 200     } ]
    });
});