HTML
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Insert title here</title><script type="text/javascript">window.onload = function(){var canvas = document.getElementById('canvas');if(canvas.getContext){var context = canvas.getContext('2d');context.beginPath();//시작점을 (50,200)으로 옮김context.moveTo(50,200);//조절점 지정//(200,50)을 조절점으로 하여 현재 위치 (50,200)에서 (350,200)까지 곡선을 그림context.quadraticCurveTo(200,50,350,200);context.stroke();}else{alert('브라우저가 캔버스를 지원하지 않습니다.');}};</script></head><body><canvas id="canvas" width="500" height="300"></canvas><br><br><img src="../files/exp_01.gif"></body></html>결과
'프로그래밍 > html,css,javascript,jsp' 카테고리의 다른 글
| [javascript] div 추가할때 따옴표 관리 (0) | 2020.10.07 |
|---|---|
| HTML5 예제와 연습 캔버스 곡선 그리기(2) (0) | 2018.12.19 |
| HTML5 예제와 연습 캔버스 그리기 color (0) | 2018.12.19 |
| HTML5 예제와 연습 캔버스 그리기 (3) 라디안 매스함수 (0) | 2018.12.19 |
| HTML5 예제와 연습 캔버스 그리기 (2) (0) | 2018.12.19 |