Renderizando gráficos em PDFs

from ironpdf import *

htmlWithJs = """
<!DOCTYPE html>
<html>
    <head>
        <meta charset='utf-8' />
        <title>C3 Bar Chart</title>
    </head>
    <body>
        <div id='chart' style='width: 950px;'></div>
        <script src='https://d3js.org/d3.v4.js'></script>
        <!-- Load c3.css -->
        <link href='https://cdnjs.cloudflare.com/ajax/libs/c3/0.5.4/c3.css' rel='stylesheet'>
        <!-- Load d3.js and c3.js -->
        <script src='https://cdnjs.cloudflare.com/ajax/libs/c3/0.5.4/c3.js'></script>
        <script>
            Function.prototype.bind = Function.prototype.bind || function (thisp) {
                var fn = this;
                return function() {
                    return fn.apply(thisp, arguments);
                };
            };
            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>
"""

# Instantiate Renderer
renderer = ChromePdfRenderer()

# Enable JavaScript in our RenderingOptions
renderer.RenderingOptions.EnableJavaScript = True
renderer.RenderingOptions.WaitFor.RenderDelay(1000)
renderer.RenderingOptions.CssMediaType = PdfCssMediaType.Print

pdf = renderer.RenderHtmlAsPdf(htmlWithJs)

# Export to a file or Stream
pdf.SaveAs("js-chart.pdf")

Renderizando gráficos em PDFs

IronPDF for Python pode renderizar bibliotecas de gráficos interativos em JavaScript — como D3.js e C3.js — diretamente para PDF, produzindo imagens de gráficos de alta qualidade sem qualquer etapa adicional de conversão de imagem.

Começando

Construa seu gráfico em uma string HTML autônoma que inclua as tags de script CDN necessárias. Defina EnableJavaScript = True e adicione um WaitFor.RenderDelay generoso para garantir que a biblioteca de gráficos tenha terminado de desenhar antes que o PDF seja capturado. Opcionalmente, defina CssMediaType para Print para aplicar estilos específicos de impressão.

Entendendo o código

EnableJavaScript: Necessário para executar os scripts D3 e C3 que geram o gráfico.
WaitFor.RenderDelay(1000): Aguarda 1000 milissegundos após o carregamento da página. As bibliotecas de gráficos realizam renderização assíncrona, então um atraso maior é necessário em comparação com a manipulação simples do DOM.
CssMediaType = PdfCssMediaType.Print: Ativa regras CSS @media print, que geralmente removem controles interativos e produzem um layout de gráfico mais limpo no PDF.
RenderHtmlAsPdf(htmlWithJs): Renderiza o HTML completo — incluindo o gráfico renderizado — como um documento PDF.

Bibliotecas de Gráficos Suportadas

Como o IronPDF usa o mecanismo de renderização Chrome, qualquer biblioteca de gráficos JavaScript que seja executada em um navegador também será renderizada corretamente para PDF. This includes Chart.js, Highcharts, ApexCharts, ECharts, and others.

Aprenda a converter HTML para PDF com IronPDF for Python!