반응형
html2canvas : 특정 영역을 캡쳐해주는 오픈소스 라이브러리
JSP 단
<!-- html2canvas : 캡처 및 이미지 저장 라이브러리 -->
<script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script>
...
<script>
function do(){
$(window).scrollTop(0); //화면을 맨위로 이동(scrollTop안할 시 보이는 화면만 저장되고 위는 짤림)
// divTest 이라는 div를 영역으로 화면 캡쳐
html2canvas($("#divTest")[0]).then((canvas) => {
var myImage = canvas.toDataURL("image/png");
var nWindow = window.open('');
nWindow.document.body.appendChild(canvas);
nWindow.focus();
// print the window
nWindow.print();
// reload the page
location.reload();
});
}
<script>
...
<body>
<div id="divTest">
<button onclick="javascript:do()">인쇄</button>
</div>
</body>
...반응형
'etc' 카테고리의 다른 글
| [H2] Database "~" not found, either pre-create~~ (0) | 2023.09.03 |
|---|---|
| maven package(build/install) 시, 라이브러리도 추가되게 하기 (0) | 2023.05.23 |
| [VsCode] vscode default 터미널 변경 방법 (0) | 2023.03.13 |
| [Lombok] Lombok 설치(초기 설정) 방법 (0) | 2023.01.06 |
| [IntelliJ] 자동 빌드 설정 (0) | 2022.06.18 |
반응형
html2canvas : 특정 영역을 캡쳐해주는 오픈소스 라이브러리
JSP 단
<!-- html2canvas : 캡처 및 이미지 저장 라이브러리 -->
<script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script>
...
<script>
function do(){
$(window).scrollTop(0); //화면을 맨위로 이동(scrollTop안할 시 보이는 화면만 저장되고 위는 짤림)
// divTest 이라는 div를 영역으로 화면 캡쳐
html2canvas($("#divTest")[0]).then((canvas) => {
var myImage = canvas.toDataURL("image/png");
var nWindow = window.open('');
nWindow.document.body.appendChild(canvas);
nWindow.focus();
// print the window
nWindow.print();
// reload the page
location.reload();
});
}
<script>
...
<body>
<div id="divTest">
<button onclick="javascript:do()">인쇄</button>
</div>
</body>
...반응형
'etc' 카테고리의 다른 글
| [H2] Database "~" not found, either pre-create~~ (0) | 2023.09.03 |
|---|---|
| maven package(build/install) 시, 라이브러리도 추가되게 하기 (0) | 2023.05.23 |
| [VsCode] vscode default 터미널 변경 방법 (0) | 2023.03.13 |
| [Lombok] Lombok 설치(초기 설정) 방법 (0) | 2023.01.06 |
| [IntelliJ] 자동 빌드 설정 (0) | 2022.06.18 |
