多层次分类echarts 饼配置项内容和展示

中间和外围实现联动,实现总分展示关系

配置项如下
      app.title = '嵌套环形图';
var placeHolderStyle = {
    normal : {
        color: 'rgba(0,0,0,0)',
        label: {show:false},
        labelLine: {show:false}
    },
    emphasis : {
        color: 'rgba(0,0,0,0)'
    }
};

option = {
    tooltip: {
        trigger: 'item',
        formatter:function(obj){
	        	console.log(obj);
	        	if(obj.name=='invisible'){
	        		return null;
	        	}					
				else{
					
					return  obj.seriesName+"<br/>"+obj.name+": "+obj.value+" ("+obj.percent*2+"%)";
				}
	    },
    },
    legend: {
        top:'4%',
        data:['线上渠道','线下渠道']
    },
    series: [
        {
            name:'渠道分类',
            color: ['#86D560', '#AF89D6'],
            type:'pie',
            selectedMode: 'single',
            center:['50%','55%'],
            radius: [0, '30%'],

            label: {
                normal: {
                    position: 'inner'
                }
            },
            labelLine: {
                normal: {
                    show: false
                }
            },
            data:[
                {value:335, name:'线上渠道', selected:true},
                {value:679, name:'线下渠道'}
    
            ]
        },
        {
            clockWise:false,
            name:'线上渠道',
            color: ['#86D560', '#AF89D6', '#59ADF3', '#FF999A', '#FFCC67'],
            type:'pie',
            startAngle:'80',
            radius: ['55%', '75%'],
            center : ['45%', '50%'],
            data:[
                {value:335, name:'直达'},
                {value:310, name:'邮件营销'},
                {value:234, name:'联盟广告'},
               {value:879, name:'invisible', itemStyle : placeHolderStyle},
            ]
        },
        {
            name:'线下渠道',
            color: ['#AF89D6', '#AF89D6', '#59ADF3', '#FF999A', '#FFCC67'],
            type:'pie',
            startAngle:'100',
            radius: ['55%', '75%'],
           center : ['55%', '50%'],
            data:[
                {value:335, name:'直达'},
                {value:335, name:'invisible', itemStyle : placeHolderStyle},
                
            ]
        }
    ]
};
    
截图如下