echarts饼图

 

export function gztjsj(data) {

    data = JSON.parse(JSON.stringify(data))

    let config = {

        color: ["#D6750C", "#498ADD", "#3AAFDA", "#656DEB", "#3AAFDA"],

        tooltip: {

            show: false,

            trigger: "item",

            formatter: "{a} <br/>{b}: {c} ({d}%)",

        },

        // grid: {

        //     // left: '1%',

        //     right: '10%',

        //     bottom: '3%',

        //     containLabel: true

        // },

        legend: {

            orient: 'vertical',

            left: '75%', //图例距离左的距离

            y: 'center', //图例上下居中

            data: ["直接访问", "邮件营销", "联盟广告", "视频广告", "搜索引擎"],

           textStyle: { //图例文字的样式

                color: '#fff',

                fontSize: 14

            },

        },

        title: {

            text: '总计\n' + data.reduce((pre, ele) => {

                pre += parseInt(ele.value)

                return pre

            }, 0) + "个",

            // left: "center",

            left: '35%',

            top: "center",

            textStyle: {

                color: "#D3D6D9",

                fontSize: 14,

            },

        },

        series: [{

            name: "工种统计",

            type: "pie",

            // radius: ["40%", "75%"],

            radius: ["50%", "88%"],

            avoidLabelOverlap: false,

            center: ['40%', '50%'],

            label: {

                show: true,

                position: "inside",

                alignTo: "edge",

                fontSize: "10",

                // position: 'center',

                // formatter: `{b}\n{c}个\n{d}%`,

                formatter: `{c}个`,

            },

            emphasis: {

                label: {

                    show: true,

                    fontSize: '12',

                    // fontWeight: 'bold',

                    formatter: `{b}\n{c}个\n{d}%`,

                }

            },

            // data: [

            //     { value: 335, name: '直接访问' },

            //     { value: 310, name: '邮件营销' },

            //     { value: 234, name: '联盟广告' },

            //     { value: 135, name: '视频广告' },

            //     { value: 1548, name: '搜索引擎' },

            // ],

            data,

        }, ],

    }

    return config

}