mingit55/canvas

Canvas로 다양한 그리기 도구 제작하기

canvas

이 프로젝트의 목표는 캔버스를 이용하여 다양한 그리기 도구를 제작하는 것입니다.
목표인 도구들의 종류는 다음과 같습니다.

1. 펜

자유롭게 선을 그릴 수 있는 툴입니다. 선의 굵기, 색상, 선의 모양을 선택할 수 있습니다.

2. 직선

마우스를 첫 클릭한 지점에 직선을 그릴 수 있는 보조선이 생깁니다. 이후, 클릭할 때마다 보조선에 맞춰 직선이 그려지게 됩니다. 선의 굵기, 색상, 선의 모양을 선택할 수 있습니다.

3. 곡선

마우스를 클릭하고 끌어당기면 선이 마우스를 향한 방향으로 휘어집니다. 'Adobe Illustrator'의 곡선 툴을 참고하여 만들었습니다. 선의 굵기, 색상, 선의 모양을 선택할 수 있습니다.

4. 다각형

마우스를 처음 클릭한 지점을 기준으로 커서를 따라서 다각형을 생성합니다. 기준점에서 멀어질 수록 사이즈도 커지며, 클릭할 때마다 다각형이 그려지게 됩니다. 각의 개수와 선의 굵기, 색상, 선의 모양을 선택할 수 있습니다.

5. 원

마우스를 처음 클릭한 지점을 기준으로 커서를 따라서 원을 생성합니다. 기준점에서 멀어질 수록 사이즈도 커지며, 컴퍼스와 같이 서서히 원을 그릴 수 있습니다. 선의 굵기, 색상, 선의 모양을 선택할 수 있습니다.

6. 채우기

클릭한 지점과 같은 색상을 현재 선택한 색상으로 바꿉니다. 바꿀 색상을 선택할 수 있습니다.

7. 지우개

모든 도구의 결과를 지울 수 있습니다. 지워지는 정도(%)를 설정을 할 수 있습니다.

추후, layer, history 등의 기능이 구현 될 수 있습니다.