Diagramme und Grafiken in PDFs rendern

string(20) "Zum Kopieren klicken"

import com.ironsoftware.ironpdf.PdfDocument;
import com.ironsoftware.ironpdf.render.ChromePdfRenderOptions;
import com.ironsoftware.ironpdf.render.CssMediaType;
import java.io.IOException;
import java.nio.file.Paths;

String htmlWithJs = "var htmlWithJs = @\"<!DOCTYPE html>\n" +
        " <html>\n" +
        " <head>\n" +
        " <meta charset='utf-8' />\n" +
        " <title>C3 Bar Chart</title>\n" +
        " </head>\n" +
        " <body>\n" +
        " <div id='chart' style='width: 950px;'></div>\n" +
        " <script src='https://d3js.org/d3.v4.js'></script>\n" +
        " <!-- Load c3.css -->\n" +
        " <link href='https://cdnjs.cloudflare.com/ajax/libs/c3/0.5.4/c3.css' rel='stylesheet'>\n" +
        " <!-- Load d3.js and c3.js -->\n" +
        " <script src='https://cdnjs.cloudflare.com/ajax/libs/c3/0.5.4/c3.js'></script>\n" +
        " <script>\n" +
        " Function.prototype.bind = Function.prototype.bind || function (thisp) {\n" +
        " var fn = this;\n" +
        " return function() {\n" +
        " return fn.apply(thisp, arguments);\n" +
        " };\n" +
        " };\n" +
        " var chart = c3.generate({\n" +
        " bindto: '#chart',\n" +
        " data: {\n" +
        " columns: [\n" +
        " ['data1', 30, 200, 100, 400, 150, 250],\n" +
        " ['data2', 50, 20, 10, 40, 15, 25]\n" +
        " ]\n" +
        " }\n" +
        " });\n" +
        " </script>\n" +
        " </body>\n" +
        " </html>\"";

ChromePdfRenderOptions renderingOptions = new ChromePdfRenderOptions();
renderingOptions.setEnableJavaScript(true);
renderingOptions.setWaitFor(new WaitFor(1000));
renderingOptions.setCssMediaType(CssMediaType.PRINT);

PdfDocument pdf = PdfDocument.renderHtmlAsPdf(htmlWithJs, renderingOptions);

// Save the PDF
try {
    pdf.saveAs(Paths.get("assets/js_chart.pdf"));
} catch(IOException exception) {
    exception.printStackTrace();
}

Diagramme und Grafiken in PDFs rendern

IronPDF kann Webseiten mit Diagrammen, Grafiken und anderen Elementen rendern, die mit modernen JavaScript-Technologien erstellt wurden.

IronPDF unterstützt WebGL, sodass es den Web-Canvas-Aufbau von Elementen unter Verwendung der Hardware-Grafikfähigkeiten des Computers verarbeiten kann.

IronPDF unterstützt alle Drittanbieter-Diagrammbibliotheken, einschließlich:

C3.js
D3.js
Highcharts

Die Methode setEnableJavaScript des Objekts ChromePdfRenderOptions ermöglicht es dem Entwickler, die Verarbeitung von JavaScript zu aktivieren, auf das intern oder extern innerhalb einer Webseite verwiesen wird. Diese Eigenschaft muss auf true gesetzt werden, um IronPDF die Verarbeitung des JavaScripts zu ermöglichen, das benötigt wird, um die Diagramme und Grafiken auf einer Webseite zu rendern.

Der Parameter setRenderDelay konfiguriert IronPDF so, dass die Interpretation des JavaScript einer Webseite um eine bestimmte Zeitspanne (in Millisekunden) verzögert wird, nachdem das DOM geladen wurde. Diese Methode ist nützlich, um sicherzustellen, dass der HTML-zu-PDF-Konverter von IronPDF Inhalte erfasst, die auf einer Webseite Sekunden nach dem ersten Laden durch den Browser erscheinen. Dies ist besonders relevant für asynchronen JavaScript-Code, der lange Zeit zum Ausführen benötigt.

Weitere Einzelheiten zu zusätzlichen Methoden, die in der Klasse ChromePdfRenderOptions verfügbar sind, finden Sie im Codebeispiel "JavaScript Charts to PDF" .

Rendern Sie JavaScript-Diagramme in PDF

Fügen Sie IronPDF Ihrem Maven-Projekt hinzu:
Verwenden Sie ChromePdfRenderOptions, um JavaScript zu aktivieren und Verzögerung/Medientyp zu konfigurieren.
HTML (Inline-String, Datei oder URL) mit PdfDocument.renderHtmlAsPdf(...) rendern.
Speichern Sie die Ausgabe mit saveAs(...).

Lernen Sie, JavaScript für das PDF-Rendering zu aktivieren