1. 程式人生 > >echart環形圖-中間顯示進度資料和標題

echart環形圖-中間顯示進度資料和標題

//標示文字
var labelTop = {
    normal : {
        label : {
            show : false,
position : 'center',
formatter : '{b}',
textStyle: {
                baseline : 'bottom',  //垂直對齊方式
fontSize:12,
color:'#666',
align : 'center'  //水平對齊方式
}
        },
color:'#de4751',
labelLine : {  //標示線
show : false
}
    }
};
//百分比設定 var labelFromatter = { normal : { label : { formatter : function (params){ return 100 - params.value + '/' + '158' }, textStyle: { baseline : 'middle', //垂直對齊方式 fontSize:27, color:'#666', align : 'center' //水平對齊方式 } } } }; //資料位置 var
labelBottom = { normal : { color: '#ccc', label : { show : true, position : 'center' }, labelLine : { show : false } }, emphasis: { color: 'rgba(0,0,0,0)' } }; //環形圖 BeforeCountOption = { title: { text: '待批人員/全部人員', // subtext: '申請明細 >', // sublink: 'http://e.weibo.com/1341556070/AhQXtjbqh',
x: 'center', y: '60', itemGap: 50, textStyle : { color : '#666', fontSize : 12, fontWeight : 'normal' }, subtextStyle : { color : '#de4751', fontSize : 12 } }, series : [ { type : 'pie', center : ['50%', '50%'], radius: ['78%', '85%'], // x: '0%', // for funnel itemStyle : labelFromatter, data : [ {name:'other', value:30, itemStyle : labelBottom}, {name:'待批人員/全部人員', value:70,itemStyle : labelTop} ] } ]

};

附圖;