使用HTML5canvas绘制饼图，开始吧！第一步：设置画布宽高constcanvas=document.getElementById("canvas");constcontext=canvas.getContext("2d");//设置画布宽高canvas.width=831;canvas.height=706;第二步：将坐标原点变换到画布中心functiontranslate(context){context.translate(canvas.width/2,canvas.height/2)}第三步：画扇//准备数据constdata=[{value:1048,name:'搜索引擎'},{value:735,name:'直接访问'},{value:580,name:'电子邮件营销'},{value:484,name:'附属广告'},{value:300,name:'VideoAdvertisement'}]//计算比率函数dataProcess(data){lettotal=0for(constitemofdata){total+=item.value}for(constitemofdata){item.percent=item.value/total}}dataProcess(data)//定义颜色constcolors=['#e6a0c4','#c6cdf7','#d8a499','#7294d4','#fdc765']//radiusconstr=300//开始绘制functiondrawFan(context){conststartAngle=-0.5*Math.PIcontext.save()for(leti=0;i
