Как экспортировать HTML-страницу в файл PDF в Banana Dashboard

Я пытаюсь создать файл PDF из панели управления бананами.

Я внес следующие изменения в файлы:

  1. Добавлен идентификатор div в основной div в файле index.html.

<div ng-view id="myDiv"></div>

  1. Добавлены два файла js, необходимые для генерации PDF, в папку vendor приложения банана.

html2canvas.js pdfmake.js

  1. Обновлен файл require.config.js, чтобы он указывал на эти два новых файла js, как показано ниже:

    html2canvas: ../vendor/html2canvas,

    pdfmake: ../vendor/pdfmake

  2. Обновлен файл dashLoader.html, чтобы включить еще один элемент в список вскрытия как «Export to PDF».

<li ng-show="dashboard.current.loader.save_local"> <a href="" alt="Export to File" title="Export to PDF" class="link" ng-click="dashboard.to_pdf()"> <i class="icon-download"></i> Export to PDF</a> <tip>Export layout and data to PDF file</tip> </li>

  1. Наконец, обновил файл dashboard.js, как показано ниже:

    this.to_pdf = function () { var inclusions = document.getElementById('myDiv'); console.log(inclusions); html2canvas(inclusions).then(function(canvas) {//this line is throwing error as html2canvas is not defined inclusions.appendChild(canvas); data_1 = canvas.toDataURL(); resolve(data_1); console.log(inclusions); }); return true; };

Но когда я нажимаю на опцию Export to PDF, я получаю сообщение об ошибке “Error: html2canvas is not defined”. Пожалуйста, обратитесь к приложенному скриншоту.

Ошибка экспорта бананов в PDF

Любая помощь в том, где я ошибаюсь, была бы очень благодарна!


html2canvas solr pdfmake lucidworks banana
person raikumardipak    schedule 09.01.2019    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Исправить это помогла отдельная html-программа Hello World html2canvas. Правильный способ вызова html2canvas, а затем pdfmake (или любой другой библиотеки для создания PDF-файлов) выглядит следующим образом:

  html2canvas(document.getElementById('divId')).then(
    canvas =>{
    var data =canvas.toDataURL();
    var docDefiniton ={
     content:[{
      image:data,
      width:500
     }]
    };
    pdfMake.createPdf(docDefinition).open();
    }
);
person raikumardipak    schedule 10.01.2019