PhantomJS正文文本溢出到页眉

时间:2017-08-18 17:13:30

标签: c# html pdf phantomjs

我遇到了PhantomJS的问题,将C#MVC视图的快照制作成pdf。

目前,当代码运行时,我调用PhantomJS C#包装器并将其指向一个视图,该视图会生成并且PhantomJS会执行任何操作并将其转换为PDF文件。那很好,花花公子。

但是,当我查看PDF文件时,我看到了这一点:

enter image description here

如您所见,“反馈报告目录”位于页眉中。理想情况下,最好是标头在DOM中拥有自己的空间,其他所有内容都会被推下来。

这是我必须修改的rasterize.js文件:

"use strict";
var page = require('webpage').create(),
system = require('system'),
address, output, size, pageWidth, pageHeight, fullName;

if (system.args.length < 3 || system.args.length > 5) {
    phantom.exit(1);
} else {
    address = system.args[1];
    output = system.args[2];
    fullName = system.args[3];    
    page.viewportSize = { width: 1140, height: 1000 };
    page.paperSize =
    {
        height: '11in',
        width: '8.5in',
        margin: {
            top: '20px',
            bottom: '20px',
            left: '10px',
            right: '10px'
        },
        header: {
            height: '20px',
            contents: phantom.callback(function () {
                return "<div style='border-bottom: 1px solid #808080; margin-top: -10px;'>" +
                        "<span style='color: #808080; font-size: 12px;'>Virtual Competency Assessment - Feedback Report</span><br />" +
                        "<span style='color: #808080; font-size: 12px;'>" + "John Doe" + " - " + GetDate() + "</span>" +
                   "</div>";
            })
        },
        footer: {
            height: '20px',
            contents: phantom.callback(function (pageNum, numPages) {
                return "<div style='text-align: center;'>" +
                        "<span style='color: #808080; font-size: 15px; font-family: Arial;'>" +
                            "Page <strong>" + pageNum + "</strong> of <strong>" + numPages + "</strong>" + 
                        "</span>" +
                    "</div>";
            })
        }
    };
    page.open(address, function (status) {
        if (status !== 'success') {
            console.log('Unable to load the address!');
            phantom.exit(1);
        } else {
            window.setTimeout(function () {
                page.render(output);
                phantom.exit();
            }, 200);
        }
    });
}

var GetDate = function () {
    var today = new Date();

    return (today.getMonth() + 1) + "/" + today.getDate() + "/" + today.getFullYear();
}

任何帮助将不胜感激。 非常感谢你的时间。

杰森

0 个答案:

没有答案