2016-07-25 10 views
3

Ich verwende PhantomJS, um eine HTML-Webseite mit D3-Diagrammen zu einem PDF-Bericht zu rendern. Der Bericht sieht fast perfekt aus, nachdem ich einige Änderungen an rasterize.js vorgenommen habe. Aber egal, was ich ändere, ich konnte den linken und rechten Rand nicht vollständig eliminieren. Es könnte jemand vorschlagen, Änderungen an raterize.js vorzunehmen, um diese Ränder komplett zu entfernen. Meine Änderungen an der Datei sind wie folgt: -Eliminiere Ränder beim Rendern einer PDF mit phantomJS

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** 
    } 
}); 

Vielen Dank!

Antwort

0

Vor allem die Ränder auf 0:

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

Als nächstes müssen Sie die PDF-Seitengröße stellen Sie sicher, genau die Größe Ihrer Inhalte. Sie können dies entweder ...

... indem Sie die Breite entsprechend der Breite Ihrer gerenderten Seite in Pixeln einstellen (manuell die Höhe für das von Ihnen verwendete Format berechnen) und für einen möglichen Unterschied in dpi anpassen

oder

... indem Sie mit dem Zoom herumspielen, bis die Seite perfekt passt.

Es ist eine Menge in jeder Hinsicht fummeln. Phantomjs kann eine Seite perfekt rendern, aber es ist nicht einfach.