효과 보기: http://keleyi.com/keleyi/phtml/html5/7.htm 전체 코드: 코드 복사 코드는 다음과 같습니다. HTML5 캔버스를 사용하여 베지어 곡선 그리기 원본 텍스트 <br>function draw(id) <br>{ <br>var canvas=document.getElementById(id); <br>if(canvas==null) <br>return false; <br>var context=canvas.getContext('2d') <br>context.fillStyle="#eeeeff" <br>context.fillRect( 0,0,400,300); <br>var n=0; <br>var dy=150; <br>context.beginPath(); .globalCompositeOperation='and'; <br>context.fillStyle='rgb(100,255,100)'; <br>context.StrokeStyle='rgb(0,0,100)' <br>var x=Math.sin(0); <br>var y=Math.cos(0); <br>var dig=Math.PI/15*11 <br>for(var i=0;i<30;i ) <br />{ <br /> var x=Math.sin(i*dig); <br />var y=Math.cos(i*dig); <br />context.bezierCurveTo(dx x*s,dy y*s-100,dx x*s 100,dy y*s,dx x*s,dy y*s); <br />} <br />context.closePath() <br />context.fill() <br /> 🎜>} <br />draw("keleyi_com") <br />