使用phantomJS渲染PDF时如何消除边距

Question

我正在使用PhantomJS将带有D3图表的html网页渲染为PDF报告。在对rasterize.js进行一些更改后，报告看起来非常完美。但是，无论我做出什么更改，都无法完全消除左右边距。是否有人能建议修改raterize.js以完全删除这些边距？我对文件所做的更改如下：

page.viewportSize = { width: 595, height: 842 };   //**A4**
    if (system.args.length > 3 && system.args[2].substr(-4) === ".pdf") {
    size = system.args[3].split('*');
    page.paperSize = size.length === 2 ? { width: size[0], height: size[1], margin: '-150px' }
                                       : { format: system.args[3], orientation: 'portrait', margin: '-4cm' }; //**Swapnil:- added a negative margin to utilize the entire width of the canvas. (Reduces the margins but does not eliminate them completely)**
} else if (system.args.length > 3 && system.args[3].substr(-2) === "px") {
    size = system.args[3].split('*');
    if (size.length === 2) {
        pageWidth = parseInt(size[0], 10);
        pageHeight = parseInt(size[1], 10);
        page.viewportSize = { width: pageWidth, height: pageHeight };
        page.clipRect = { top: 0, left: 0, width: pageWidth, height: pageHeight };
    } else {
        console.log("size:", system.args[3]);
        pageWidth = parseInt(system.args[3], 10);
        pageHeight = parseInt(pageWidth * 3/4, 10); // it's as good an assumption as any
        console.log ("pageHeight:",pageHeight);
        page.viewportSize = { width: pageWidth, height: pageHeight };
    }
}
if (system.args.length > 4) {
    page.zoomFactor = system.args[4];
}
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();
        }, 20000);  // **Swapnil:- increased time out to ensure all the charts load perfectly**
    }
});

谢谢！

- noobnoob

Answer 1

首先将页边距设置为0：

page.paperSize = {
    // ...
    margin: { top: 0, right: 0, bottom: 0, left: 0 }
};

接下来，您需要确保 PDF 页面大小与内容完全一致。您可以通过以下两种方式实现：

1. 根据您呈现页面的宽度（以像素为单位）设置宽度（手动计算您使用的任何格式的高度），并调整可能存在的 dpi 差异。 2. 通过不断尝试缩放比例，直到页面完美适配。

无论哪种方法，都需要大量的尝试和摸索。PhantomJS 可以完美地呈现页面，但并不容易。

- Benjamin E.

---

请问您能否解释一下如何设置宽度或调整缩放比例吗？因为我正在努力动态查找页面的宽度，由于内容宽度每次都会变化。 - some IT dood