작업 전.. html2canvas 및 jspdf 라이브러리에 대한 설명.. 우선 2개의 라이브러리를 대충 설명하면 html2canvas : DOM을 기반으로 하여 전체 또는 특정 영역의 스크린샷을 생성하는 라이브러리 jsPDF : javascript로 PDF를 생성해주는 라이브러리 대충 위와 같은 기능을 제공하는 라이브러리인 것만 인지하고 아래 그림을 보도록 하자. 우리가 작성한 HTML을 PDF로 변환하는 과정은 위와 같다. 보통 인쇄 기능을 구현하거나, PDF로 변환할 때 사용자가 원하는 엘리먼트를 잡고 body를 변경해주거나, 직접 파라메터로 HTML 엘리먼트를 넣어주는데 여기서는 HTML 엘리먼트를 우선 이미지로 변환한 뒤, PDF로 변환해준다. ( 물론 인쇄도 된다. ) 대충 이해 했으면 이제 ..

웹에서 인쇄 기능을 구현하는 것은 간단하다. window객체에서 제공하는 print함수를 이용하면 DOM에 있는 내용을 그대로 가지고 인쇄 할 수 있다. 설명 window 객체에서 제공하는 print함수는 별개의 파라메터를 받지 않고, 현재 문서를 인쇄해주는 기능을 제공하는 함수이다. 즉, 사용자가 원하는 특정영역을 인쇄하기 위해서는 DOM을 조작 할 필요가 있다. 그러기 위해 자주 사용하는 방법은 아래와 같다. 1. print가 되기전에 document.body에 사용자가 원하는 영역의 element를 저장해준다. 2. print를 수행한다. 3. print가 수행되고 난후, document.body에 기존에 있던 element를 다시 저장해준다. 여기서 1번을 수행하지 않으면 특정영역이 아닌 문서의 ..