ECharts
View on GitHub
Home
Example
API & Doc
Download
ZIP (Latest)
Link
Ecom-FE
Data Visualization
ZRender
option
option = { title : { text: '浏览器占比变化', subtext: '纯属虚构', x:'right', y:'bottom' }, tooltip : { trigger: 'item', formatter: "{a}
{b} : {c} ({d}%)" }, legend: { orient : 'vertical', x : 'left', data:['Chrome','Firefox','Safari','IE9+','IE8-'] }, toolbox: { show : true, feature : { mark : true, dataView : {readOnly: false}, restore : true, saveAsImage : true } }, calculable : false, series : (function(){ var series = []; for (var i = 0; i < 30; i++) { series.push({ name:'浏览器(数据纯属虚构)', type:'pie', itemStyle : {normal : { label : {show : i > 28}, labelLine : {show : i > 28, length:20} }}, radius : [i * 4 + 40, i * 4 + 43], data:[ {value: i * 128 + 80, name:'Chrome'}, {value: i * 64 + 160, name:'Firefox'}, {value: i * 32 + 320, name:'Safari'}, {value: i * 16 + 640, name:'IE9+'}, {value: i * 8 + 1280, name:'IE8-'} ] }) } return series; })() }; setTimeout(function(){ var _ZR = myChart.getZrender(); // 补充千层饼 _ZR.addShape({ shape : 'text', style : { x : _ZR.getWidth() / 2, y : _ZR.getHeight() / 2, color: '#bbb', text : '恶梦的过去', textAlign : 'center' } }); _ZR.addShape({ shape : 'text', style : { x : _ZR.getWidth() / 2 + 200, y : _ZR.getHeight() / 2, brushType:'both', color: 'orange', strokeColor: 'yellow', text : '美好的未来', textAlign : 'left', textFont:'normal 20px 微软雅黑' } }); _ZR.refresh(); }, 2000);
Refresh ~