// 获取对象 var Canvas = document.querySelector('Canvas'); //获取绘图环境 var ctx = Canvas.getContext('2d'); // 绘制八卦图 // 3.1 大圆 ctx.beginPath(); ctx.arc(250,250,250,0,Math.PI,true); ctx.closePath(); ctx.stroke(); ctx.beginPath(); ctx.arc(250,250,250,0,Math.PI,false); ctx.fill(); ctx.closePath(); // 3.2 左中圆 ctx.beginPath(); ctx.arc(125,250,125,0,2*Math.PI,false); ctx.closePath(); ctx.fill(); // 3.3右中圆 ctx.beginPath(); ctx.arc(375,250,125,0,2*Math.PI,false); ctx.closePath(); ctx.fillStyle = '#fff'; ctx.fill(); // 3.3 左小圆 ctx.beginPath(); ctx.arc(125,250,20,0,2*Math.PI,false); ctx.closePath(); ctx.fill(); // 3.3 右小圆 ctx.beginPath(); ctx.arc(375,250,20,0,2*Math.PI,false); ctx.closePath(); ctx.fillStyle = '#000'; ctx.fill();
canvas绘制八卦图
最新推荐文章于 2023-07-10 16:00:10 发布