Highcharts Demo

author(s): Torstein Hønsi

by Bhabani Raju

HTML

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

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

JavaScript

Highcharts.setOptions({
  lang: {
    decimalPoint: '.',
    thousandsSep: ','
  }
});
$(function() {
  $('#container').highcharts({
    chart: {
      type: 'pie',
      height: '500',
      width: '750',
      borderColor: '#EBBA95',
      borderWidth: 2
    },
    tooltip: {
      formatter: function() {
        var sliceIndex = this.point.index;
        var sliceName = this.series.chart.axes[0].categories[sliceIndex];
        return 'The value for <b>' + sliceName +
          '</b> is <b>' + this.y + '</b>';
      }
    },
    plotOptions: {
      pie: {
        allowPointSelect: true,
        cursor: 'pointer',
        showInLegend: true,
        dataLabels: {
          enabled: true,
          format: '{point.y:,.0f}'
        }
      }
    },
    title: {
      text: 'Rental Amounts for Paramount Directors'
    },
    legend: {
      enabled: true,
      labelFormatter: function() {
        var legendIndex = this.index;
        var legendName = this.series.chart.axes[0].categories[legendIndex];

        return legendName;
      }
    },
    xAxis: {
      categories: ["BADHAM, J", "COPPOLA, F", "GUILERMAN, J", "HILLER, A",
        "SPIELBERG, S"
      ],
    },
    series: [{
      name: 'Directors',
      data: [74100000, 30673000, 36915000, 50000000, 90434000],
    }]
  });
});