Html2pdf Изменение размера и исправление копирования на одну и ту же страницу

У меня есть следующее ниже:

<div>
    <button id="btn">screenshot</button>
</div>
<script src="https://unpkg.com/jspdf@latest/dist/jspdf.umd.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/html2canvas@1.0.0-rc.7/dist/html2canvas.min.js"></script>
<script>
    window.onload = function () {
        console.log("Window is loaded")
        document.getElementById('btn').addEventListener("click", function () {
            html2canvas(document.getElementById('test')).then(function (canvas) {
                document.body.appendChild(canvas);
                var imgdata = canvas.toDataURL("image/jpg");
                var doc = new jspdf.jsPDF();
                doc.addImage(imgdata, "JPG", 10, 10);
                doc.save("sample.pdf");
            });
        })
    }
</script>

Это работает, но не очень хорошо. Две проблемы, которые я не могу решить, следующие:

1. Открывается PDF со скриншотом небольшого участка страницы, как будто он слишком увеличен.
2. Он также помещает скриншот страницы на саму страницу, этот скриншот хранится в сессии браузера и исчезает при новой перезагрузке. Я не знаю, какая часть кода отвечает за это, поэтому не знаю, как запретить ему это делать. Если бы существовал способ скопировать снимок экрана на другую страницу .html, и пользователь мог бы просмотреть его оттуда, это могло бы стать обходным решением. Однако я не знаю, как манипулировать кодом, чтобы заставить его сделать это, и я только начинающий в javascript/html2pdf; Python - единственный язык, который я знаю сейчас.

Я использую DJANGO в качестве фреймворка, если это имеет значение.

Спасибо!

Я пробовал следующее: html2canvas: {width:element_width}; безрезультатно, и я попробовал добавить некоторый базовый код изменения размера. Оба варианта привели к поломке всего кода, и после этого ничего не работало.

Вернуться на верх