Как правильно экспортировать содержимое HTML в PDF и WORD, как оно отображается в браузере? - PullRequest
Новая
       17

Как правильно экспортировать содержимое HTML в PDF и WORD, как оно отображается в браузере?

0 голосов
/ 04 апреля 2020

Я пытаюсь экспортировать содержимое div в формате PDF, используя jsPDF и html2canvas.

Я следовал этому Как конвертировать HTML Страница в PDF В Angular Приложение Документация.

Здесь html2canvas преобразует мой div в изображение холста, и я пытаюсь экспортировать его с помощью jspdf. Он работает нормально, но мой div - это высота больше, и страница обрезается и не отображает весь контент. Когда я проверяю, изображение, сгенерированное htm2canvas, идеально, как и ожидалось, но оно не полностью перерисовано.

Ниже приведен код, который я использую. Я пытался с несколькими вариантами функциональности addImage, но результат все время отличается, не получая полное изображение. Пожалуйста, предложите любые настройки, которые я могу использовать, чтобы получить полное изображение в формате PDF. 

public convertToPDF() {
  var data = document.getElementById('dashboard');
  html2canvas(data).then(canvas => {
    // Few necessary setting options
    let imgWidth = 208;
    let pageHeight = 295;
    let imgHeight = (canvas.height * imgWidth) / canvas.width;
    let heightLeft = imgHeight;

    const contentDataURL = canvas.toDataURL('image/png');
    let pdf = new jspdf('p', 'mm', 'a4'); // A4 size page of PDF
    var position = 0;
    // pdf.addImage(contentDataURL, 'JPEG', 10, 10);
    pdf.addImage(
      contentDataURL,
      // 'PNG',
      'jpg',
      0,
      position,
      imgWidth,
      // data.clientHeight
      imgHeight,
      '',
      'MEDIUM'
    );
    pdf.save('new-file.pdf'); // Generated PDF
  });

}

PS: Пожалуйста, дайте мне знать, если есть какой-нибудь простой способ сделать это для MS Word .

...