drawBgLine.html 코드 복사코드는 다음과 같습니다. html5는 그라데이션 배경 이미지를 그리고 < ;/ head> ;/ center> <br> //1단계: 캔버스 객체 가져오기 <br> var c = document.getElementById("c") <br> //컨텍스트 가져오기 캔버스 객체 Object <br> var context = c.getContext("2d"); <br> /* <br> * 다른 그래픽을 그리는 코드입니다. <br> context.beginPath() <br> context.lineWidth =10; <br> context.StrokeStyle="red"; <br> context.lineTo(150,50); <br> context.closePath( ); <br> //context.strokRect(220,50,50,50) <br> context.fillStyle="blue" <br> context.fillRect(220,50,50,50) ; <br> context.beginPath(); <br> context.arc(150,150,50,0*Math.PI/180,-180*Math.PI/180,false) <br> context.lineTo(150,150) ; <br> context.closePath(); <br> context.lineWidth=1; <br> context.fillText("briup" ,0,220); <br> context.save(); <br> context.rotate(90*Math.PI/180); <br> context .lineWidth=10; <br> context.StrokeStyle="red"; <br> context.moveTo(0,0) <br> context.lineTo(100,0); (); <br> context.closePath(); <br> */ <br> var g = context.createLinearGradient(0,0,0,200) <br> g.addColorStop( 0,"90BFFF "); <br> g.addColorStop(1,"white"); <br> context.fillStyle = g <br> context.fillRect(0,0,1,200) <br> = c.toDataURL ("image/jpeg").replace("image/jpeg","image/octet-stream") <br>