Перекрывающий текст в JSPDF

Question

У меня есть страница панели инструментов, сгенерированная с использованием d3, она показывает разные таблицы html со стилями и датой. Я использую JSPdf для экспорта таблиц в pdf для конечного пользователя, теперь проблема заключается в том, когда я пробовал это на производственной машине (другой ноутбук со слегка меньшим экраном), в формате pdf отображаются таблицы, но какой-то текст перекрывается за пределами их ячейки и я в конечном итоге с текстом scrabbeled. Теперь даже на моем экране все, что требуется, - это увеличить масштаб в моем навигаторе, чтобы в итоге получить pdf-файл, который показывает некоторые данные на неправильной основе, кто-то прошел через это и получил Есть идеи ? мне нужно получить экспорт pdf с организованными данными, возможно, что-то похожее на то, что отображается в моем браузере, потому что по какой-то причине результат в pdf отличается от вывода веб-страницы html.

Вот вопрос на GitHub с экраном, показывая проблему: https://github.com/MrRio/jsPDF/issues/879

Answer 1

Вы можете использовать такой инструмент, как SVG Crowbar или Hanpuku сохранить SVG холст в файл SVG со всем необходимым стайлингом. Затем вы можете преобразовать в PDF с помощью Inkscape или Illustrator.

Answer 2

Вы взглянули на таблицы стилей? Может быть print.css, который может влиять на результат и может отличаться от того, что вы на самом деле выполняете.

Вы также можете посмотреть на их образец «Строка Расщепление», они работают в подобной проблеме:

Проблема с их примером является вертикальное смещение

Оригинал:

verticalOffset += (lines.length + 0.5) * size/72 

Новое:

verticalOffset += (lines.length + 2.5) * size/72 

Answer 3

Поскольку ваша проблема связана с масштабирования (или не масштабирование), я уверен, что обсуждение произошло на этот вопрос поможет - Using jspdf to save html page as pdf, saved pdf contains incomplete page content if browser is zoomed, Why?

В принципе, хитрость заключается в том, чтобы установить размер страницы печатается, так что, если вы увеличиваете масштаб страницы или нет, сохраненный pdf всегда будет иметь тот же размер. Что для меня работало - source.style.width = '1700px'; В вашем случае просто проверьте, что такое ширина при масштабировании на 90% или 110% (так как это дает правильный pdf-файл для вас), а затем установите эту ширину перед командой сохранения jspdf. Надеюсь, это сработает для вас.