分享一下我老师大神的人工智能教程！零基础，通俗易懂！http://blog.csdn.net/jiangjunshow
也欢迎大家转载本篇文章。分享知识，造福人民，实现我们中华民族伟大复兴！
1、问题背景
利用echarts制作一个圆环图，图的容器动态生成，图的数据源利用随机数动态变化，模拟后台获取数据
2、实现源码
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>echarts-圆环图</title> <link rel="shortcut icon" href="../js/echarts-2.2.7/doc/asset/ico/favicon.png"> <script type="text/javascript" src="../js/echarts-2.2.7/doc/asset/js/jquery.min.js" ></script> <script type="text/javascript" src="../js/echarts-2.2.7/doc/example/www2/js/echarts-all.js" ></script> <style> body,html{ width: 99%; height: 99%; font-family: "微软雅黑"; font-size: 12px; } #pie{ width: 100%; height: 80%; } </style> <script> $(document).ready(function(){ randomData(); }); //产生随机数 function randomData() { var first = (Math.random()*1000+1000).toFixed(2); var second = (Math.random()*1000+1000).toFixed(2); var third = (Math.random()*1000+1000).toFixed(2); var fourth = (Math.random()*1000+1000).toFixed(2); var chartId = Math.floor(Math.random()*1000+10000); var pieName = ['第一季度','第二季度','第三季度','第四季度']; var pieValue = new Array(); pieValue.push(first); pieValue.push(second); pieValue.push(third); pieValue.push(fourth); $("#bodyDiv").empty().append("<div id='pie"+chartId+"' style='width:100%;height:100%;'></div>"); buildChart(pieName,pieValue,chartId); } //生成圆环图 function buildChart(pieName,pieValue,chartId) { var pieData = new Array(); for(var i=0;i<pieName.length;i++) { pieData.push(eval('(' + ("{'value':"+pieValue[i]+",'name':'"+pieName[i]+"'}") + ')')); } var pieChart = document.getElementById("pie"+chartId); var echart = echarts.init(pieChart); var option = { title : { text: '一年四季收入比例', x:"center" }, tooltip : { trigger: 'item', formatter: "{a} <br/>{b} : {c} ({d}%)" }, legend: { orient: 'horizontal', x:"center", y:"bottom", data: pieName }, series : [ { name: '季度', type: 'pie', radius : ['50%','70%'], center: ['50%', '50%'], data:pieData, itemStyle: { emphasis: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } } ] }; echart.setOption(option); } //window.setInterval(randomData(),1000); </script> </head> <body id="bodyDiv"> </body></html>3、实现结果