<< 벤처 기업의 CEO는 어떤 사람이어야 하나? | Home | 올바른 리더란? >>

HTML5 Canvas 예제 - Text2Image

1. Canvas란
 - Canvas는 다양한 도형 그리기 API, 2D 렌더링 기능 제공
 - 선, 면, 그라데이션, 텍스트 렌더링, 패턴 브러쉬 제공
 - 이미지 처리, 비디오 프레임 단위 추출. 동적 Canvas 이미지 추출 제공
 - 픽셀 단위 제어 제공

2. 사용자가 입력한 텍스트를 이미지로 변환하는 예제
 - 참조 라이브러리 : canvas2image.js, base64.js
 - canvas2image 라이브러리 사용시
   var oCanvas = document.getElementById("canvas1");
   Canvas2Image.saveAsPNG(oCanvas);// PNG 변환
   Canvas2Image.saveAsJPEG(oCanvas); //JPG 변환
   Canvas2Image.saveAsBMP(oCanvas); //BMP 변환
 
 - Canvas 라이브러리 사용시
   oCanvas.toDataURL(imageType);

3. 데모 사이트
 - http://mimul.com/html5/canvas2image/

[참조 사이트]



Add a comment Send a TrackBack