개발자의 끄적끄적

[javascript/jquery] javascript canvas reset example / 자바스크립트 캔버스 초기화 하는 방법 javascript 에서 canvas 를 이용하여 이미지 작업도 하고 그림도 그릴수 있고 여러가지를 할 수 있습니다. 그러다 보면 canvas 를 초기화 해야하는 경우가 생기곤 하는데요, 그럴때는 아래와 같이 clearRect 와 beginPath 를 이용하시면 됩니다. var canvas = document.getElementById('canvas'); var context = canvas.getContext('2d'); context.clearRect(0, 0, cnvs.width, cnvs.height); context.beginPath(); 위 내용 보시면 아시겠지..

[javascript/jquery] canvas to image 방법 javascript에서 canvas 에 있는 내용을 img 태그로 뽑아 내고 싶을때 하는 방법입니다. 우선 위와 같은 태그가 있다고 가정하고, var img_view = document.getElementById('img'); img_view.src = canvas.toDataURL(); canvas.toDataURL() 로 canvas 에서 뽑아낸 내용을 img 태그가 담겨있는 img_view 에 src 로 넣어주면 됩니다. 엄청 간단합니다! 하지만 여기서 !! 크로스브라우징 이슈 (CROS) 들이 생겨나는 경우가 많습니다. 이부분은 아직 뾰족한 해결책은 못찾았습니다.. 찾는대로 바로 공유하겠습니다! 참고하세요!