html5餅狀圖分類統計動畫特效4034
//餅形圖
// 基于準備好的dom,初始化echarts圖表
var myChart = echarts.init(document.getElementById('echart'));
option = {
    legend: {
        orient : 'vertical',
        x : 'left',
        data:[]
    }, 
  	color:['#4A5873','#F76666','#16CF45','#119FD9','#E5D117','#FF7C41', '#FF5151'],
    
    calculable : false,
    series : [
        {
            name:'',
            type:'pie',
            selectedMode: 'single',
            radius : [0, 90],
            // for funnel
            x: '20%',
            width: '40%',
			y: '90%',
            funnelAlign: 'right',
            max: 1548,
            
            itemStyle : {
                normal : {
                    label : {
                        position : 'inner',
                    },
                    labelLine : {
                        show : false
                    }
                }
            },
            data:[
                {value:335, name:'六大解\n決方案\n\n\n'}
            ]
        },
        {
            name:'',
            type:'pie',
            radius : [100, 200],
            
            // for funnel
            x: '80%', 
            width: '70%',
            funnelAlign: 'left',
            max: 1048,
            itemStyle : {
                normal : {
                    label : {
                        position : 'inner'
                    },
                    labelLine : {
                        show : false
                    }
                }
            },
            data:[
                { value:500, name:'醫院'},
				{ value:500,name:'校園'},
				{ value:500, name:'酒店'},
				{ value:500, name:'工業'},
				{ value:500,name:'商業\n建筑'},
				{ value:500,name:'政府'},
            ]
        }
    ]
};

// 為echarts對象加載數據 
myChart.setOption(option);

技術討論區(0 個討論)

  1. 請先登錄

      發 布
深圳风采彩票