HighChart不同事物数据的饼图

时间:2016-11-18 06:56:24

标签: javascript jquery highcharts

我正在使用HichChart的饼图来显示有关不同学生报告的数据 - 此图表分为几个部分:

  • 正面数据。
  • 负面数据。

我已经让它适合单个学生,但是当我在某个人的积极区域内,然后我在另一个学生身上时,就会出现问题 - 饼图使用正面的颜色(我不记得告诉它这样做)。主要问题是,当我处于钻井阶段时,我必须返回,否则它会加载不同颜色的不同数据。

这是我的代码:

<div id="ChartContainer" style="width: 600px; height: 400px; margin: 0 auto"></div>

$(function(){
    HighCharts.chart('ChartContainer', {
        chat: {
            type: 'pie'
        },
        title: {
            text: 'Positive: 426 / Need Work: 28'
        },
        plotOptions: {
            pie: {
                size: 250,
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: true,
                    color: '#000000',
                    connectorColor: '#000000',
                    formatter: function() {
                        return '<b>' + this.point.name + '</b>: ' + this.percentage + '%';
                    }
                }
            }
        },
        tooltip: {
            formatter: function() {
                return '<b>' + this.point.name + '</b>: ' + this.percentage + '%';
            }
        },
        series: [{
            data: [{
                name: 'Positive',
                y: 4,
                color:'#00ff00',
                drilldown: 'Posit'
            }, {
                name: 'Negative',
                y: 4,
                color: '#ff7a0f',
                drilldown: 'Negit'
            }, ]
        }],
        drilldown: {
            series: [{
                color: 'green',
                id: 'Posit',
                data: [
                    {name:'one', y:4, color: 'Red'},
                    ['two', 2],
                    ['three', 1],
                    ['four', 2],
                    ['five', 1]
                ]

            }, {
                 color: 'Blue',
                id: 'Negit',
                data: [
                    {name:'one', y:4, color: 'Blue'},
                    ['Seven', 4],
                    ['Eight', 2],
                    ['Nine', 3]
                ]

            }

           ]
        }
    });
});

1 个答案:

答案 0 :(得分:0)

你忘了加入https://code.highcharts.com/modules/drilldown.js 在script标签中。它应该在index.html中引用。你的价值转换为百分比。那就是它显示了不同的价值。