JSPDF - Как экспортировать несколько изображений с разным размером страницы (высота и ширина) в один файл PDF - PullRequest
0 голосов
/ 12 сентября 2018

У меня есть несколько изображений разного размера (высота и ширина), которые необходимо преобразовать в PDF с помощью jspdf, но у меня возникли проблемы с использованием функции addPage() для этого.Можно ли экспортировать изображения с разными размерами страниц в один PDF-файл?

1 Ответ

0 голосов
/ 03 февраля 2019

Мне действительно удалось добавить несколько страниц с разным размером изображения, используя addPage([imgWidth, imgHeight]), за исключением первой страницы, которая определяется как new jsPDF('l', 'pt', 'a4').

Пустую первую страницу можно удалить с помощью .deletePage(1). Вы также можете добавить текст на первую страницу, если хотите.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js" 
    integrity="sha384-NaWTHo/8YCBYJ59830LTz/P4aQZK1sS0SneOgAvhsIl3zBu8r9RevNg5lHCHAuQ/"
    crossorigin="anonymous"></script>
<script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script>
<script>
    function exportPdf(urls) {
        let pdf = new jsPDF('l', 'pt', 'a4');
        pdf.text(20, 20, 'Some text here');

        for (let i = 0; i < urls.length; i++) {
            let img = new Image();
            img.src = urls[i];
            img.onload = function () {
                const imgWidth = this.width;
                const imgHeight = this.height;
                const imgRatio = imgWidth / imgHeight;
                if (i >= 0) {
                    if (imgRatio > 0) {
                        pdf.addPage([imgWidth, imgHeight]);
                    }
                    else {
                        pdf.addPage([imgWidth, imgHeight], 'p');
                    }
                }                
                pdf.setPage(i + 2);
                pdf.addImage(img, 'JPEG', 0, 0, imgWidth, imgHeight, null, 'NONE');

                if (i == urls.length - 1) {
                    pdf.save('Photos.pdf');
                }
            }
        }
    }
</script>

Лучшим, но более сложным способом является использование фиксированного формата страницы и вычисление размера изображения и соотношения сторон, а затем соответственно установка параметров (и поворот изображения при необходимости), чтобы изображение могло соответствовать бумага, т. е. а4 в этом случае. Это может быть pdf.addImage(img, 'JPEG', adjustedX, adjustedY, adjustedWidth, adjustedHeight, null, 'NONE'); или pdf.addImage(img, 'JPEG', adjustedX, adjustedY, adjustedWidth, adjustedHeight, null, -90);

Пример кода см. В моем ответе на этот вопрос .

...