Highcharts Demo

author(s): Torstein Hønsi

by hmahida

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-3d.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>

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

JavaScript

Highcharts.chart('container', {
    chart: {
        type: 'pie',
        options3d: {
            enabled: true,
            alpha: 45
        }
    },
    title: {
        text: 'Contents of Highsoft\'s weekly fruit delivery'
    },
    subtitle: {
        text: '3D donut in Highcharts'
    },
     
    plotOptions: {
        pie: {
        		size:100,
            innerSize: 50,
            depth: 45,
            allowPointSelect: true,
            cursor: 'pointer',
            dataLabels: {
                enabled: false
            },
            showInLegend: true
        }
    },
     series: [{
        name: '#Device',
        colorByPoint: true,
        data: [{
            name: 'Chrome',
            y: 61.41
        }, {
            name: 'Internet Explorer',
            y: 11.84,
            color: '#0000FF'
        }, {
            name: 'Firefox',
            y: 10.85,
            color: '#00FF00'
        }, {
            name: 'Edge',
            y: 4.67,
            color: '#FF0000'
        }]
    }]
});