Rendering Charts and Graphs in PDFs
IronPDF can render web pages containing charts, graphs, and other elements built with modern JavaScript technologies.
IronPDF supports WebGL, allowing it to process web canvas-built elements using the machine's hardware graphics capabilities.
IronPDF supports all third-party chart libraries, including:
- C3.js
- D3.js
- Highcharts
The setEnableJavaScript method on the ChromePdfRenderOptions object enables the developer to enable the processing of JavaScript referenced internally or externally within a web page. This property must be set to true to allow IronPDF to process the JavaScript needed to render the charts and graphics on a webpage.
The setRenderDelay configures IronPDF to postpone its interpreting of a web page's JavaScript for a specified amount of time (in milliseconds) after it has loaded its DOM. This method is useful in ensuring that IronPDF's HTML-to-PDF converter captures content that appears on a web page seconds after a browser finishes loading it initially. This is particularly relevant for asynchronous JavaScript code that takes a long time to complete.
Refer to the JavaScript Charts to PDF Code Example for more details about additional methods available on the ChromePdfRenderOptions class.
Render JavaScript Charts into PDF
Add IronPDF to your Maven project:
<dependency> <groupId>com.ironsoftware</groupId> <artifactId>ironpdf</artifactId> <version>XXX.X.X</version> </dependency><dependency> <groupId>com.ironsoftware</groupId> <artifactId>ironpdf</artifactId> <version>XXX.X.X</version> </dependency>XML- Use
ChromePdfRenderOptionsto enable JavaScript and configure delay/media type. - Render HTML (inline string, file, or URL) using
PdfDocument.renderHtmlAsPdf(...). - Save the output with
saveAs(...).
import com.ironsoftware.ironpdf.PdfDocument;
import com.ironsoftware.ironpdf.render.ChromePdfRenderOptions;
import com.ironsoftware.ironpdf.render.CssMediaType;
import com.ironsoftware.ironpdf.render.WaitFor;
import java.io.IOException;
import java.nio.file.Paths;
public class JsChartsToPdf {
public static void main(String[] args) throws IOException {
String htmlWithCharts = """
<html><body>
<div id="chart"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.7.20/c3.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.7.20/c3.min.css" rel="stylesheet"/>
<script>
var chart = c3.generate({
bindto: '#chart',
data: {
columns: [
['data1', 30,200,100,400,150,250],
['data2', 50,20,10,40,15,25]
]
}
});
</script>
</body></html>
""";
// Configure PDF rendering options
ChromePdfRenderOptions options = new ChromePdfRenderOptions()
.setEnableJavaScript(true) // run JS
.setWaitFor(new WaitFor(3000)) // wait 3 seconds
.setCssMediaType(CssMediaType.PRINT); // use print styles
// Render HTML to PDF using IronPDF
PdfDocument pdf = PdfDocument.renderHtmlAsPdf(htmlWithCharts, options);
// Save the PDF
pdf.saveAs(Paths.get("charts_output.pdf"));
System.out.println("PDF with charts saved as 'charts_output.pdf'");
}
}import com.ironsoftware.ironpdf.PdfDocument;
import com.ironsoftware.ironpdf.render.ChromePdfRenderOptions;
import com.ironsoftware.ironpdf.render.CssMediaType;
import com.ironsoftware.ironpdf.render.WaitFor;
import java.io.IOException;
import java.nio.file.Paths;
public class JsChartsToPdf {
public static void main(String[] args) throws IOException {
String htmlWithCharts = """
<html><body>
<div id="chart"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.7.20/c3.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.7.20/c3.min.css" rel="stylesheet"/>
<script>
var chart = c3.generate({
bindto: '#chart',
data: {
columns: [
['data1', 30,200,100,400,150,250],
['data2', 50,20,10,40,15,25]
]
}
});
</script>
</body></html>
""";
// Configure PDF rendering options
ChromePdfRenderOptions options = new ChromePdfRenderOptions()
.setEnableJavaScript(true) // run JS
.setWaitFor(new WaitFor(3000)) // wait 3 seconds
.setCssMediaType(CssMediaType.PRINT); // use print styles
// Render HTML to PDF using IronPDF
PdfDocument pdf = PdfDocument.renderHtmlAsPdf(htmlWithCharts, options);
// Save the PDF
pdf.saveAs(Paths.get("charts_output.pdf"));
System.out.println("PDF with charts saved as 'charts_output.pdf'");
}
}
