Как сгенерировать HTML в PDF с помощью js, добавляя верхний и нижний колонтитулы на каждой странице на случай, если конт

Как сгенерировать HTML в PDF с помощью js, добавляя верхний и нижний колонтитулы на каждой странице на случай, если конт ⇐ Html

1 сообщение • Страница 1 из 1

Anonymous

Как сгенерировать HTML в PDF с помощью js, добавляя верхний и нижний колонтитулы на каждой странице на случай, если конт

Цитата

Сообщение Anonymous » 15 янв 2025, 15:18

Я попробовал библиотеку html2pdf, которая предоставляет эту возможность, но в начале контента я получаю много пустого пространства.
Наш вариант использования требует создания PDF-файлов на стороне клиента, чтобы это работает, даже если Интернет недоступен
Поскольку данные большие, а отображаемые атрибуты настраиваются на стороне клиента.
Попробовал библиотеку jsPDF а также, никаких хороших результатов из этого, как ну
Вот работающий пример html2pdf, который я пробовал

Код: Выделить всё



HTML to PDF Example




Welcome to html2pdf Tutorial

This is an example of converting HTML content to a PDF file using the
html2pdf JavaScript library.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit.  Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Generate PDF


function generatePDF() {
const element = document.getElementById("content");
const options = {
margin: 1,
filename: "example.pdf",
image: { type: "jpeg", quality: 0.98 },
html2canvas: { scale: 2 },
jsPDF: { unit: "in", format: "letter", orientation: "portrait" },
};

html2pdf().set(options).from(element).save();
}

Подробнее здесь: https://stackoverflow.com/questions/793 ... ry-page-in

1736943520

Anonymous

[code]

HTML to PDF Example

Welcome to html2pdf Tutorial

This is an example of converting HTML content to a PDF file using the
html2pdf JavaScript library.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus
lacinia odio vitae vestibulum vestibulum.

Generate PDF

function generatePDF() {
const element = document.getElementById("content");
const options = {
margin: 1,
filename: "example.pdf",
image: { type: "jpeg", quality: 0.98 },
html2canvas: { scale: 2 },
jsPDF: { unit: "in", format: "letter", orientation: "portrait" },
};

html2pdf().set(options).from(element).save();
}

[/code]

Подробнее здесь: [url]https://stackoverflow.com/questions/79357643/how-to-generate-html-to-pdf-using-js-adding-a-header-and-footer-on-every-page-in[/url]

Ответить Пред. тема След. тема

1 сообщение • Страница 1 из 1

Быстрый ответ

Заголовок:

Имя пользователя:

Изменение регистра текста:

Смайлики

Ещё смайлики…

К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми. Можно прикреплять файлы, перетаскивая их в окно сообщения.

Максимально разрешённый размер вложения: 15 МБ.

Имя файла:

Комментарий к файлу:

Имя файла	Комментарий к файлу	Размер	Статус

Похожие темы

Ответы

Просмотры

Последнее сообщение

Как сгенерировать HTML в PDF с помощью js, добавляя верхний и нижний колонтитулы на каждой странице на случай, если конт

Последнее сообщение Anonymous « 15 янв 2025, 12:20
Добавлено в форуме Html

Anonymous » 15 янв 2025, 12:20 » в форуме Html

Я попробовал библиотеку html2pdf, которая предоставляет эту возможность, но в начале контента я получаю много пустого пространства.
Наш вариант использования требует создания PDF-файлов на стороне клиента, чтобы это работает, даже если Интернет...

0 Ответы

13 Просмотры

Последнее сообщение Anonymous
15 янв 2025, 12:20
Фиксированный верхний и нижний колонтитулы на HTML-странице, оформленной в виде листа бумаги формата А4 для печати

Последнее сообщение Anonymous « 11 апр 2024, 05:34
Добавлено в форуме CSS

Anonymous » 11 апр 2024, 05:34 » в форуме CSS

У меня есть лист формата, который содержит фиксированный верхний и нижний колонтитулы, а также изменяемый основной (между верхним и нижним колонтитулом), как сделать так, чтобы верхний и нижний колонтитулы не находились над основным или основной не...

0 Ответы

42 Просмотры

Последнее сообщение Anonymous
11 апр 2024, 05:34
Как настроить верхний и нижний колонтитулы с помощью Elementor в теме без поддержки редактора сайта

Последнее сообщение Anonymous « 15 окт 2024, 12:35
Добавлено в форуме Php

Anonymous » 15 окт 2024, 12:35 » в форуме Php

Проблема:
Я использую собственную тему, которая не поддерживает редактор сайтов Wordpress. Я хочу создать новую заставку с измененным верхним и нижним колонтитулом, которая скрывает навигационное меню. Elementor включен.
Вопрос:
Как я могу...

0 Ответы

12 Просмотры

Последнее сообщение Anonymous
15 окт 2024, 12:35
Как настроить верхний и нижний колонтитулы с помощью Elementor в теме без поддержки редактора сайта

Последнее сообщение Anonymous « 15 окт 2024, 13:35
Добавлено в форуме Php

Anonymous » 15 окт 2024, 13:35 » в форуме Php

Проблема:
Я использую собственную тему, которая не поддерживает редактор сайтов Wordpress. Я хочу создать новую заставку с измененным верхним и нижним колонтитулом, которая скрывает навигационное меню. Elementor включен.
Вопрос:
Как я могу...

0 Ответы

20 Просмотры

Последнее сообщение Anonymous
15 окт 2024, 13:35
Верхний и нижний колонтитулы не занимают всю ширину

Последнее сообщение Anonymous « 20 май 2024, 12:47
Добавлено в форуме CSS

Anonymous » 20 май 2024, 12:47 » в форуме CSS

Верхний и нижний колонтитулы отлично работают на экране ноутбука. Но когда я включаю адаптивный экран и тестирую его разную ширину, ширина верхнего и нижнего колонтитулов уменьшается. Я хочу, чтобы при уменьшении ширины экрана верхний и нижний...

0 Ответы

28 Просмотры

Последнее сообщение Anonymous
20 май 2024, 12:47

Вернуться в «Html»