반응형 programming/Graphics35 html5 canvas 직사각형 종류와 표현 html의 canvas에 직사각형을 표현하는 방법은 3가지가 있다. 배경색이 있는 직사각형을 그릴 수 있고, 테두리만 있는 직사각형을 그릴 수 있다. canvas 의 구역 중 일부를 직사각형으로 지정하여 삭제할 수 있다. 추가로 직사각형의 좌표는 직사각형의 좌측상단을 기준으로 한다. html5 canvas 직사각형 종류와 표현 html의 canvas 에 직사각형을 표현하는 방법은 3가지가 있다. canvas에 그려지는 직사각형에 배경색을 지정하거나 테두리만 표시할 수 있다. 그리고, 직사각형으로 범위를 지정하여 해당 범위만 삭제할 수 있다. 직사각형을 그리기 위해 좌표계를 이해할 필요가 있다. 이부분은 이전에 작성한 내용을 참고한다. html5 canvas 직사각형 좌표의 이해 기준 좌측상단 canvas.. 2022. 6. 30. html5 canvas 직사각형 좌표의 이해 기준 좌측상단 html5 웹페이지의 canvas 태그를 이용해 직사각형을 그릴 수 있다. fillRect 메서드를 이용하여 직사각형을 그릴 수 있으며 x좌표, y좌표는 좌측상단을 기준으로 직사각형이 그려진다. fillRect 메서드의 인자값은 4가지로 순서대로 x좌표, y좌표, 너비, 높이 를 지정한다. html5 canvas 직사각형 좌표의 이해 기준 좌측상단 html 의 canvas 태그를 이용하여 이미지를 표시하고 직사각형을 그릴 때 어떤 위치에 그릴지 좌표를 입력하게 된다. 프로그램을 만들 때 그래픽적인 부분이 들어갈 때 애매한 것이 좌표이다. 처음에 이 좌표의 구성이 애매할 수 있지만 x, y 좌표의 기준은 직사각형이 그려질 좌측 상단임을 알아두자. x y 좌표는 좌측 상단의 위치 html5의 canvas 태.. 2022. 6. 26. html5 canvas 태그 웹브라우저에 그래픽을 표현하기 웹페이지에 그래픽 요소를 추가할 때 canvas 태그를 사용한다. canvas 태그는 단순한 그래픽부터 역동적인 게임제작까지 가능하게 해 준다. canvas 태그로 웹페이지에 그래픽 영역을 지정하고 canvas api 를 이용하여 그래픽적 요소를 추가하고 동적인 움직임을 줄 수 있다. html5 canvas 태그 웹브라우저에 그래픽 표현하기 html5를 이용해 웹페이지를 작성할 때 그래픽적인 요소를 추가하고 싶을 때가 있다. canvas 태그는 웹페이지에 그래픽적인 요소를 추가하고 그릴 수 있는 그래픽 태그이기도 하다. 그래픽은 칙칙한 텍스트보다 좀 더 동적이고 호기심을 불러일으키는 장치이기도 하다. 그래픽 사용을 위해 html canvas 태그를 사용하기 위해 학습할 내용은 canvas 태그와 함께 c.. 2022. 6. 24. 알고두 온라인 저장소 공유된 프로젝트 불러오기 Load shared algodoo project 알고두 온라인 저장소를 살펴보면 다른 사람들의 작업물들을 볼 수 있고 시뮬레이션 동작을 할 수 있다. 알고두르 시뮬레이션을 만들 때 참고해 볼 만한 것들이 많이 있다. 어디가나 고인물은 있다. 알고두로 간단한 시뮬레이션을 만들 수도 있지만 복잡한 게임을 만드는 것도 가능하다. 알고두 온라인 저장소 공유된 프로젝트 불러오기 Load shared algodoo project 내가 알고두를 열심히 공부하고는 있지만 어디까지 무엇을 할지는 잘 모른다. 그럴 땐 남들이 만들어 놓은 것을 살펴보면 재미있다. 알고두는 사람들마다 자신들이 만들어놓은 시뮬레이션 장면들을 공유하기도 한다. 간단한 시뮬레이션부터 복잡한 게임까지 다양하다. 이런 것들을 사용하고 어떻게 만들었을까? 라는 생각이 든다면 시작이 되는 셈이다. 이.. 2022. 2. 4. 이전 1 2 3 4 ··· 9 다음 반응형
