Echarts-案例【饼状图案例(一)】
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Echarts饼状图案例(含南丁格尔图)</title> <script type="text/javascript" src="js/echarts_56.js" ></script> <style type="text/css"> #main{ width:600px; height:400px; } </style> </head> <body> <div id="main"> </div> <script type="text/javascript"> var eobj=echarts.init(document.getElementById("main")); var option={ series:[{ name:"访问来源", //饼图的名称 type:'pie', //类型为饼图 //饼图的半径 radius:'55%', //55%指的是外半径为可视区(div盒子的宽高中较小的一项)的尺寸的55%长度 //南丁格尔图 // roseType:'angle', //数据的数组内容 data:[ {value:120,name:'塞饭'}, {value:300,name:'学校上机'}, {value:60,name:'跑步+听歌'}, {value:240,name:'课余网课学习'}, {value:120,name:'洗漱+收拾'} , {value:420,name:'睡觉觉'} ], itemStyle:{ normal:{ shadowBlur:20, shadowColor:'rgba{0,0,0,0}' //阴影颜色 } } }] }; eobj.setOption(option); </script> </body> </html>
效果:

浙公网安备 33010602011771号