html5 canvas 이미지 합성/ 이미지 겹치기 source-over source-atop 동해둘리의 실전 프로젝트 html canvas 시리즈 #2
동해둘리가 직접 개발했던 실전 프로젝트를 살펴보는 동해둘리의 실전프로젝트 2탄 지난 포스팅에서 html5 에서 제공하는 canvas를 이용하여 이미지를 합성하거나 이미지를 겹치는 방법을 살펴봤었습니다. 앱스토어에서 메리퀸 으로 검색하면 앱을 다운로드 받아서 실제 기능을 확인해 보실 수 있습니다 이번 포스팅에서는, 지난번에 이어서 실제 코드를 살펴보면서 html5 canvas를 이용한 이미지합성 / 이미지겹치기 에 대해 알아보도록 하겠습니다 우선, 위 그림의 침대부분이 canvas 입니다. 그리고 이미지를 합성하기 위한 보이지 않는 hidden 속성의 canvas 가 두개 필요합니다. 캔버스를 지원하지 않는 브라우저 입니다 캔버스를 지원하지 않는 브라우저 입니다 캔버스의 css 설정은 다음과 같습니다. 폭..
IT공부방/HTML5, CSS
2019. 7. 2. 10:27
