Highcharts 圆饼图demo 博客分类： javascript Highcharts圆饼图

<div id="container" style="width: 600px; height: 550px; margin: 0 auto"></div>
<script language="JavaScript">
    var beginTime = "2016年12月06日 16:54";
    var endTime = "2017年01月06日 16:54";
    $(document).ready(function() {
        var chart = {
            plotBackgroundColor: null,
            plotBorderWidth: null,
            plotShadow: false
        };
        var title = {
            text: beginTime+' ~  '+endTime
        };
        //鼠标显示
        var tooltip = {
            pointFormat: '{series.name}: <b>{point.y}</b><br/>总调用次数：{point.total}'
        };
        //饼图外显示
        var plotOptions = {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: true,
                    format: '<b>{point.name}</b>: {point.percentage:.1f}%'
                },
                showInLegend: true
            }
        };
        var series= [{
            type: 'pie',
            name: '调用次数',
            data: [
                {
                    name: "逾期平台查询",
                    y: 100
                },
                {
                    name: "人脸比对",
                    y: 20
                },
                {
                    name: "银行帐号认证",
                    y: 300
                },
                {
                    name: "法院公告详情",
                    y: 4
                },
                {
                    name: "名片识别",
                    y: 50
                },
                {
                    name: "营业执照识别",
                    y: 6
                }
            ]
        }];

        var json = {};
        json.chart = chart;
        json.title = title;
        json.tooltip = tooltip;
        json.series = series;
        json.plotOptions = plotOptions;
        $('#container').highcharts(json);
    });
</script>