echarts分組餅圖，多彩版。圓形餅狀圖

百度的echarts插件需要引入到頁面內

var equipment = ['華為', '中興', '愛立信', '索尼', 'www.remulu.com', 'www.edir.cn'];
var project = ['華為', '中興', '烽火', '阿爾卡特', '三星', 'tplink', '惠普', '戴爾'];
var colorList = ['#0090ff', '#06d3c4', '#ffbc32', '#2ccc44', '#ff3976', '#6173d6', '#914ce5', '#42b1cc', '#ff55ac', '#0090ff', '#06d3c4', '#ffbc32', '#2ccc44', '#ff3976', '#6173d6', '#914ce5', '#42b1cc', '#ff55ac', '#0090ff', '#06d3c4', '#ffbc32', '#2ccc44', '#ff3976', '#6173d6', '#914ce5', '#42b1cc', '#ff55ac', '#0090ff', '#06d3c4', '#ffbc32', '#2ccc44', '#ff3976', '#6173d6', '#914ce5', '#42b1cc', '#ff55ac', '#0090ff', '#06d3c4', '#ffbc32', '#2ccc44', '#ff3976', '#6173d6', '#914ce5', '#42b1cc', '#ff55ac', '#0090ff', '#06d3c4', '#ffbc32', '#2ccc44', '#ff3976', '#6173d6', '#914ce5', '#42b1cc', '#ff55ac', '#0090ff', '#06d3c4', '#ffbc32', '#2ccc44', '#ff3976', '#6173d6', '#914ce5', '#42b1cc', '#ff55ac', '#0090ff', '#06d3c4', '#ffbc32', '#2ccc44', '#ff3976', '#6173d6', '#914ce5', '#42b1cc', '#ff55ac', '#0090ff', '#06d3c4', '#ffbc32', '#2ccc44', '#ff3976', '#6173d6', '#914ce5', '#42b1cc', '#ff55ac', '#0090ff', '#06d3c4', '#ffbc32', '#2ccc44', '#ff3976', '#6173d6', '#914ce5', '#42b1cc', '#ff55ac', '#0090ff', '#06d3c4', '#ffbc32', '#2ccc44', '#ff3976', '#6173d6', '#914ce5', '#42b1cc', '#ff55ac']
option = {
    backgroundColor: '#fff',
    tooltip: {
        formatter: function(param) {
            if (param.data.type == null) {

                return param.data.name + ":" + param.value + '個';
            } else {

                return param.data.type + ":" + param.value + '個';
            }
        }
    },

    series: [{
            name: '整體分類',
            type: 'pie',
            radius: [0, '30%'],
            label: {
                position: 'inner',

            },
            itemStyle: {
                normal: {
                    borderColor: '#fff',
                    borderWidth: 2,
                    color: function(params) {
                        return colorList[params.dataIndex]
                    }
                }
            },

            selectedMode: 'single',
            data: [{
                    value: 875,
                    name: '傳輸',

                },
                {
                    value: 1239,
                    name: '話務',

                },
            ]
        },
        {
            name: '招標方式',
            type: 'pie',
            radius: ['40%', '55%'],

            itemStyle: {
                normal: {
                    color: function(params) {
                        return colorList[params.dataIndex]
                    }
                }
            },
            label: {
                normal: {
                    formatter: function(params) {

                        if (params.value != 0)
                            return params.data.type + ":" + params.value + '個';
                        else
                            return '';
                    },
                    show: true,

                },

            },

            data: [{
                    value: 135,
                    name: '傳輸',
                    type: equipment[0],

                },
                {
                    value: 200,
                    name: '傳輸',
                    type: equipment[1],

                },
                {
                    value: 100,
                    name: '傳輸',
                    type: equipment[2],

                },
                {
                    value: 50,
                    name: '傳輸',
                    type: equipment[3],

                },
                {
                    value: 300,
                    name: '傳輸',
                    type: equipment[4],

                },
                {
                    value: 90,
                    name: '傳輸',
                    type: equipment[5],

                },
                {
                    value: 310,
                    name: '話務',
                    type: project[0],

                },
                {
                    value: 234,
                    name: '話務',
                    type: project[1],

                },
                {
                    value: 35,
                    name: '話務',
                    type: project[2],

                },
                {
                    value: 100,
                    name: '話務',
                    type: project[3],

                },
                {
                    value: 40,
                    name: '話務',
                    type: project[4],

                },
                {
                    value: 400,
                    name: '話務',
                    type: project[5],

                },
                {
                    value: 100,
                    name: '話務',
                    type: project[6],

                },
                {
                    value: 20,
                    name: '話務',
                    type: project[7],

                },



            ]
        }
    ]
};

 

效果：

：