Javascript로 화면 PDF로 저장 jspdf html2canvas > 팁앤테크

본문 바로가기
사이트 내 전체검색

팁앤테크

Javascript로 화면 PDF로 저장 jspdf html2canvas

페이지 정보

본문

<script type="text/javascript" src="<?php echo G5_PLUGIN_URL?>/pdf/jspdf.min.js"></script>
<script type="text/javascript" src="<?php echo G5_PLUGIN_URL?>/pdf/html2canvas.min.js"></script>

<script>
$(document).ready(function() {
$('#savePdf').click(function() { // pdf저장 button id
 
    html2canvas($('#pdfDiv')[0]).then(function(canvas) { //저장 영역 div id
           
           // 캔버스를 이미지로 변환
           var imgData = canvas.toDataURL('image/png');
                
           var imgWidth = 190; // 이미지 가로 길이(mm) / A4 기준 210mm
           var pageHeight = imgWidth * 1.414;  // 출력 페이지 세로 길이 계산 A4 기준
           var imgHeight = canvas.height * imgWidth / canvas.width;
           var heightLeft = imgHeight;
           var margin = 10; // 출력 페이지 여백설정
           var doc = new jsPDF('p', 'mm');
           var position = 0;
              
           // 첫 페이지 출력
           doc.addImage(imgData, 'PNG', margin, position, imgWidth, imgHeight);
           heightLeft -= pageHeight;
                
           // 한 페이지 이상일 경우 루프 돌면서 출력
           while (heightLeft >= 20) {
               position = heightLeft - imgHeight;
               doc.addPage();
               doc.addImage(imgData, 'PNG', 0, position, imgWidth, imgHeight);
               heightLeft -= pageHeight;
           }
        
           // 파일 저장
           doc.save('file-name.pdf');    
    });
}); 
});
</script>

추천0

첨부파일

댓글목록

등록된 댓글이 없습니다.

Total 825건 1 페이지
  • RSS
팁앤테크 목록
번호 제목 글쓴이 조회 추천 날짜
825 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 4460 0 11-02
824 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 5890 0 07-10
823 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 7419 0 04-06
822 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 6469 0 02-21
821 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 5836 0 12-31
820 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 6254 0 12-24
819 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 5883 0 12-04
818 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 6574 0 10-17
817 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 6052 0 10-02
816 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 6814 0 08-04
815 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 5429 0 08-04
814 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 6703 0 08-03
813 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 7639 0 07-08
812 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 7970 0 07-08
열람중 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 10440 0 07-06
810 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 5500 0 06-09
809 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 6794 0 06-03
808 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 6423 0 04-16
807 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 7361 0 03-29
806 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 6074 0 03-26
805 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 8782 0 03-12
804 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 6365 0 03-10
803 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 7101 0 03-03
802 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 9609 0 02-28
801 제로쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 9964 0 02-28

검색

회원로그인

회원가입

사이트 정보

株式会社YHPLUS / 대표 : ZERO
〒140-0011 東京都品川区東大井2-5-9-203
050-5539-7787
오픈카카오톡 (YHPLUS) :
https://open.kakao.com/o/slfDj15d

접속자집계

오늘
2,954
어제
5,213
최대
9,679
전체
2,696,960
Copyright (c) 株式会社YHPLUS. All rights reserved.