echarts 饼配置项内容和展示

      option = {

    legend: {

        selectedMode: false,

        //   left: "40%",

        right: '10%',

        width: '50%',

        align: 'left',

        orient: 'vertical',

        icon: "circle",

        formatter: function(name) {

            var total = 0;

            var target;

            var data = [{
                "value": 0.0,
                "name": "VIP Customer Portal",
                "number": null,
                "itemStyle": {
                    "color": "rgba(116,41,201,1)"
                }
            }, {
                "value": 0.0,
                "name": "PC Client",
                "number": null,
                "itemStyle": {
                    "color": "rgba(255,108,62,1)"
                }
            }, {
                "value": 0.0,
                "name": "Customer Scheduling Order",
                "number": null,
                "itemStyle": {
                    "color": "rgba(253,189,76,1)"
                }
            }, {
                "value": 0.0,
                "name": "Courier App",
                "number": null,
                "itemStyle": {
                    "color": "rgba(63,194,151,1)"
                }
            }, {
                "value": 0.0,
                "name": "Official website",
                "number": null,
                "itemStyle": {
                    "color": "rgba(74,128,244,1)"
                }
            }, {
                "value": 0.0,
                "name": "Customer App",
                "number": null,
                "itemStyle": {
                    "color": "rgba(255,108,207,1)"
                }
            }, {
                "value": 0.0,
                "name": "Shopee express",
                "number": null,
                "itemStyle": {
                    "color": "rgba(194,222,59,1)"
                }
            }, {
                "value": 0.0,
                "name": "Hellofit",
                "number": null,
                "itemStyle": {
                    "color": "rgba(75,208,250,1)"
                }
            }, {
                "value": 0.0,
                "name": "Rimerup",
                "number": null,
                "itemStyle": {
                    "color": "rgba(250,148,75,1)"
                }
            }, {
                "value": 0.0,
                "name": "Shopee platform",
                "number": null,
                "itemStyle": {
                    "color": "rgba(255,223,87,1)"
                }
            }, {
                "value": 0.0,
                "name": "Iluvrun.com",
                "number": null,
                "itemStyle": {
                    "color": "rgba(116,41,201,1)"
                }
            }]

            for (var i = 0, l = data.length; i < l; i++) {

                total += data[i].value;

                if (data[i].name == name) {

                    target = data[i].value;

                }

            }
            if (name.length > 18) {
                name = name.substr(0, 18) + '...';

            }

            return '{a|' + name + '}{b|' + target + '%}'

        },

        textStyle: {

            // overflow: "break",

            // width:200,

            verticalAlign: 'right',

            overflow: 'ellipsis',

            rich: {

                a: {

                    width: 100,

                    // backgroundColor:'rgba(222,22,22,1)',

                    fontSize: 12,

                    // lineWidth:10,

                    // align:'c',

                    overflow: 'hidden',

                    // verticalAlign:'right',

                    // overflow: "break",

                },

                b: {

                    width: 50,

                    // right:0,

                    align: 'right',

                    // backgroundColor:'rgba(22,223,225,1)',

                    fontSize: 12,

                }

            }

        }

    },

    tooltip: {

        trigger: 'item',

        formatter: '{a} <br/>{b} : {c} '

    },

    grid: {
        height:'auto',
        width:'auto',

        x: '25%',

        y: '20%',

        x2: '5%',

        y2: '10%',

    },

    labelLine: {

        show: false,

        length: 0,

    },

    itemStyle: {},

    radius: ['30%', '60%'],

    series: [

        {

            name: '',

            type: 'pie',

            radius: ['20%', '100%'],

            roseType: 'radius',

            labelLine: {

                show: false

            },

            avoidLabelOverlap: false,

            label: {

                show: false,

                position: 'center'

            },

            data: [{
                "value": 220.0,
                "name": "VIP Customer Portal",
                "number": null,
                "itemStyle": {
                    "color": "rgba(116,41,201,1)"
                }
            }, {
                "value": 0.0,
                "name": "PC Client",
                "number": null,
                "itemStyle": {
                    "color": "rgba(255,108,62,1)"
                }
            }, {
                "value": 0.0,
                "name": "Customer Scheduling Order",
                "number": null,
                "itemStyle": {
                    "color": "rgba(253,189,76,1)"
                }
            }, {
                "value": 0.0,
                "name": "Courier App",
                "number": null,
                "itemStyle": {
                    "color": "rgba(63,194,151,1)"
                }
            }, {
                "value": 0.0,
                "name": "Official website",
                "number": null,
                "itemStyle": {
                    "color": "rgba(74,128,244,1)"
                }
            }, {
                "value": 0.0,
                "name": "Customer App",
                "number": null,
                "itemStyle": {
                    "color": "rgba(255,108,207,1)"
                }
            }, {
                "value": 0.0,
                "name": "Shopee express",
                "number": null,
                "itemStyle": {
                    "color": "rgba(194,222,59,1)"
                }
            }, {
                "value": 0.0,
                "name": "Hellofit",
                "number": null,
                "itemStyle": {
                    "color": "rgba(75,208,250,1)"
                }
            }, {
                "value": 0.0,
                "name": "Rimerup",
                "number": null,
                "itemStyle": {
                    "color": "rgba(250,148,75,1)"
                }
            }, {
                "value": 0.0,
                "name": "Shopee platform",
                "number": null,
                "itemStyle": {
                    "color": "rgba(255,223,87,1)"
                }
            }, {
                "value": 0.0,
                "name": "Iluvrun.com",
                "number": null,
                "itemStyle": {
                    "color": "rgba(116,41,201,1)"
                }
            }],

            right: "60%",

            bottom: "60%"

        }

    ]

};