본문 바로가기
JavaScript/Html2canvas

html2canvas를 이용하여 프린트하기

도나가 2021. 9. 1. 11:44 
html2canvas(document.getElementById("id")).then(function(canvas) {
		 //document.body.appendChild(canvas)
		 var dataUrl = canvas.toDataURL(); //attempt to save base64 string to server using this var
		    var windowContent = '<!DOCTYPE html>';
		    windowContent += '<html>';
		    windowContent += '<head>';
		    windowContent += '<style> @media print {img {width: 100%; height: 100%;}}</style>' ;
		    windowContent +=  '<title>Print canvas</title>';
		    windowContent +=  '</head>';
		    windowContent += '<body>'
		    windowContent += '<img src="' + dataUrl + '">';
		    windowContent += '</body>';
		    windowContent += '</html>';
		    var printWin = window.open('','','width=800,height=800');
		    printWin.document.open();
		    printWin.document.write(windowContent);
		    printWin.document.close();

			//셋타임아웃을 주는 이유는 css가 먹히라고
		    setTimeout(function(){
		    printWin.focus();
		    printWin.print();
		    printWin.close();},10);


	});

 

티스토리툴바