动态div数据与jsPDF中pdf的页脚重叠

时间:2019-02-03 15:41:37

标签: angularjs jspdf

我有一个div重复13次,并且动态数据与页脚重叠,并且数据对齐不正确。如何使用jsPDF使其正确?

function exportTable($timeout, datacontext, $rootScope) {
    return {
        restrict: 'E',
        scope: {`enter code here
            elemId: '@'
        },
        template: '<button type="button" class="SubmitButton" id="SubmitButton" data-ng-click="exportToPdf()" style="margin-bottom: 50px;">Save as PDF</button>',
        link: function (scope, elem, attr) {
        scope.exportToPdf = function () {
            var logoImg = new Image();
            logoImg.src = "../Images/Logo.png";

            logoImg.onload = function () {
                var pdf = new jsPDF('p', 'pt', "a4"),
                    source = $('#CompanyName')[0],
                    source1 = $('#CompanyAddress')[0],
                    source2 = $('#PageHead')[0],
                    source3 = $('#note')[0],
                    source4 = $('#InfoReport')[0],
                    source5 = $('#Quesreport')[0],
                    source6 = $('#InfoReportbottom')[0];

                var totalPagesExp = "{total_pages_count_string}";
                var margin = {
                    top: 40,
                    bottom: 0,
                    left: 40,
                    right: 0
                };
                pdf.page = 1;

                function footer() {
                    pdf.setFontSize(8);
                    pdf.setTextColor(169, 169, 169);

                    pdf.addImage(logoImg, 'png', 460, 10);

                    pdf.text('Confidential - For internal use only', 35, pdf.internal.pageSize.height - 15);
                    pdf.text('______________________________________________________________________________________________________________________________', 45, pdf.internal.pageSize.height - 25);
                    var str = 'Page ' + pdf.page;
                    if (typeof pdf.putTotalPages === 'function') {
                        str = str + " of " + totalPagesExp;
                    }
                    pdf.page++;
                    pdf.text(str, 265, pdf.internal.pageSize.height - 15);
                }

                footer();

                pdf.fromHTML(source, margin.left, margin.top, { 'width': 500 });
                pdf.setFontSize(12);
                pdf.setTextColor(0, 0, 0);
                pdf.setFont('Times New Roman');
                pdf.text('Address,', 110, 120);
                pdf.text('Address', 145, 135);
                pdf.fromHTML()
                pdf.fromHTML(source2, margin.left, margin.top + 100, { 'width': 500, });
                pdf.fromHTML(source3, margin.left, margin.top + 125, { 'width': 500, });
                pdf.fromHTML(source4, margin.left, margin.top + 185, { 'width': 500, });

                var pageheight = pdf.internal.pageSize.height;

                pdf.fromHTML(source5, margin.left, margin.top + 350, { 'width': 500, 'height': 400, 'elementHandlers': specialElementHandlers(source5) });
                footer();

                function specialElementHandlers(element) {
                    return true;
                }

                pdf.fromHTML(source6, margin.left, margin.top + 900, { 'width': 500, 'elementHandlers': specialElementHandlers });

                if (typeof pdf.putTotalPages === 'function') {
                    pdf.putTotalPages(totalPagesExp);
                }

                pdf.save('Test' + '.PDF');
            }
        };
    }
}

}

我正在使用id从HTML获取数据,并且能够将数据完全获取到我的PDF,但是'source5'具有从动态div获得的数据。 div数据长度超过一页,无法正确对齐而不与页脚重叠。

任何帮助将不胜感激。

0 个答案:

没有答案