반응형

2025/06/11 6

_05_버튼이미지 ~ _09_삼각함수 ( 1 ~ 3 )

_05_버튼이미지이미지들을 보면. 이렇게 있는 이미지가 많다. 이미지 로드가 네트워크를 많이 잡아 먹는다.한장에 하나씩 그림이 있으면 그리기 편한데.한장에 여러개가 있으면. 이 그림을 잘라서 쓴다. 이런 경우가 꽤 많다. 아이콘 이미지들은 따로 있는게 아니라. 하나에 있는 가능성이 높다. 자르는것을 배워야 한다. fpsDrawImage.html한장 그리기 DOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta http-equiv="X-UA-Compatible" content="IE=edge"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>..

코딩/1-JavaScript 2025.06.11

_04_포인트인렉트

_04_포인트인렉트버튼이다. 버튼을 직접 만들어 보는것 html버튼이 내부적으로는 이런 일이 벌어지는것 pointInRect.htmlDOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta http-equiv="X-UA-Compatible" content="IE=edge"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>Documenttitle>head>body> h1>네모를 클릭하세요. h1> canvas id="myCanvas" width="800" height="600" style="border: 1px solid black;..

코딩/1-JavaScript 2025.06.11

_01_캔버스클릭원그리기 , _02_캔버스클릭원지우고원그리기 , _03_FPS셋팅

02_캔버스마우스_01_캔버스클릭원그리기캔버스를 왜 쓰는가태그 가지고 애니메이션을 표현하는데 만드는것이 한계가 있다. css가지고는 한계가 있다. 정교하게 할려면 캔버스에다가 해야한다. clickDrawArc.htmlDOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta http-equiv="X-UA-Compatible" content="IE=edge"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>Documenttitle>head>body> canvas id="myCanvas" width="800" height="600" style=..

코딩/1-JavaScript 2025.06.11

_02_grid , _03_rect , _04_arc , _05_text

_02_grid그리드 html이 대단한 언어이다.테이블 그냥 그려줌 사실상 html은 내부에 엄청난 코딩이 들어있다. 그리드를 다 그려주는것 안에가 그리드 처럼 되어 있다. grid.htmlDOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta http-equiv="X-UA-Compatible" content="IE=edge"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>Documenttitle> head>body> canvas id="myCanvas" width="650" height="650" style="border:..

코딩/1-JavaScript 2025.06.11

01_캔버스요소 => _00_canvas , _01_line

E오학기_477E01_캔버스01_캔버스요소_00_canvas캔버스 태그 도화지라는 뜻. 그림판 옵션이 있어야 한다. 옵션 => 가로 세로 를 넣어주는게 좋다. mycanvas.html DOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta http-equiv="X-UA-Compatible" content="IE=edge"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>Documenttitle>head>body> canvas id="myCanvas" width="480" height="320" style="border: 1px solid..

코딩/1-JavaScript 2025.06.11
반응형