完美

[学习|工作|博客|交流平台|完美起航]
 详情

使用highcharts画饼图

时间:[2017-09-20 11:14:04] 作者:[ zyw327 ] 点击:[ 1394 ]
  1. 引入jquery

  2. 引入highcharts

note:注意引用的顺序

<div class='container_charts'></div>
function pie(title, seriesTitle, data) {
    $('.container_charts').highcharts({
        chart: {
        type: 'pie',
        options3d: {
        enabled: true,
        alpha: 45,
        beta: 0
        }
        },
        title: {
        text: title
        },
        tooltip: {
        pointFormat: '{series.name}: <b>{point.percentage:.2f}%</b>'
        },
        colors:['#00A600', '#AAAAFF', '#FF2D2D'] ,
        plotOptions: {
        pie: {
        allowPointSelect: true,
        cursor: 'pointer',
        depth: 35,
        dataLabels: {
        enabled: true,
        format: '{point.name}:{point.y:.2f}元, {point.percentage:.2f}%'
        },
        showInLegend: true
        }
        },
        series: [{
        type: 'pie',
        name: seriesTitle,
        data: data
        }]
    });
}
var data = [
    ['a',   10],
    ['b',   11],
    {
    name: 'c',
    y: 12,
    sliced: true,
    selected: true
    }
];
pie('测试', '测试系列标题', data);


 2   0
 相关评论

zyw327

姓名:  
zyw327
QQ号码:  
327523057
职位:  
NODEJS
GITHUB主页:  
个性签名:  
宝剑锋从磨砺出,梅花香自苦寒来

关注     私信