html PDF 다운로드

$("#btnPdf").on("click", function () {
      html2canvas(document.getElementById("gridData"), {
          onrendered: function(canvas) {

              // 캔버스를 이미지로 변환
              var imgData = canvas.toDataURL('image/png');

              var imgWidth = 190; // 이미지 가로 길이(mm) A4 기준
              var pageHeight = imgWidth * 1.414;  // 출력 페이지 세로 길이 계산 A4 기준
              var imgHeight = canvas.height * imgWidth / canvas.width;
              var heightLeft = imgHeight;

              var doc = new jsPDF('p', 'mm');
              var position = 10;

              // 첫 페이지 출력
              doc.addImage(imgData, 'PNG', 10, position, imgWidth, imgHeight);
              heightLeft -= pageHeight;

              // 한 페이지 이상일 경우 루프 돌면서 출력
              while (heightLeft >= 20) {
                  position = heightLeft - imgHeight;
                  doc.addPage();
                  doc.addImage(imgData, 'PNG', 10, position, imgWidth, imgHeight);
                  heightLeft -= pageHeight;
              }

              // 파일 저장
              doc.save('sample_A4.pdf');

        }
    });
});

pdf 라이브러리 등록

pdfJs.zip

jspdf.min.js - pdf다운로드

html2canvas.min.js - 컨버터

bluebird.min.js - ie 적용

es6-promise.auto.js

pdfJs.zip

0.16MB

pdfJs.zip

0.16MB