在 PDF 中渲染圖表

VB C#

using IronPdf;

const string 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]
                    ]
                }
                });
            // Set delay
            setTimeout(function() {
                window.ironpdf.notifyRender();
            }, 1000);
            </script>
        </body>
    </html>";

// Instantiate Renderer
var renderer = new ChromePdfRenderer();

// Enable JavaScript in our RenderingOptions
renderer.RenderingOptions.EnableJavaScript = true;
renderer.RenderingOptions.WaitFor.JavaScript();
renderer.RenderingOptions.CssMediaType = IronPdf.Rendering.PdfCssMediaType.Print;

var pdf = renderer.RenderHtmlAsPdf(htmlWithJs);

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

IRON VB CONVERTER ERROR developers@ironsoftware.com

Install-Package IronPdf

在 PDF 中渲染圖表

IronPDF具備強大的HTML轉換為PDF的功能，同時全面支持JavaScript渲染——包括對canvas和圖表渲染的支持。這種對 JavaScript 的全方位支援使開發人員能夠創建高品質的 PDF，其中包括渲染完成的圖表，如三維圖表和多邊形。

一些支持的圖表包括：

C3.js

D3.js

Highcharts

在 PDF 中渲染圖表的步驟


var renderer = new ChromePdfRenderer
```();
- renderer.RenderingOptions.EnableJavaScript = true;
- renderer.RenderingOptions.WaitFor.JavaScript();

 renderer.RenderingOptions.CssMediaType = IronPdf.Rendering.PdfCssMediaType.Print;

 - ```Chinese (zh_TW)
var pdf = renderer.RenderHtmlAsPdf
```(htmlWithJs);

 首先，我們需要建立將用於創建 PDF 文件的 HTML 內容。 此 HTML 包含內嵌 JavaScript 以使用 C3 庫生成條形圖。 setTimeout 函數確保在 1 秒後，`window.ironpdf.notifyRender()被調用，通知IronPDF在JavaScript執行完成後繼續進行頁面渲染。

 現在，我們可以看看這是如何呈現在一個易於閱讀的 PDF 文件中。 首先，我們創建一個新的 `ChromePdfRenderer` 實例，用於訪問 IronPDF 使用的強大渲染引擎，並允許在 HTML 頁面中渲染高級 JavaScript。

 接下來，我們有三個不同的選項，這些選項是使用 `RenderingOptions` 類別設置的。 首先，`EnableJavaScript = true` 確保範例 HTML 文件中的 JavaScript 在渲染 HTML 頁面時被執行。 `WaitFor.JavaScript()用來暫停渲染過程，直到所有 JavaScript 都運行完成，以確保圖表正確渲染。 第三個選項 `CssMediaType = IronPdf.Rendering.PdfCssMediaType.Print`，將CSS媒體類型設置為打印，優化樣式以進行PDF呈現。

 接下來的步驟是將我們先前創建的 HTML 文件最終渲染成 PDF 文件。這通過 `RenderHtmlAsPdf` 方法完成，該方法接收 `htmlWithJs` 變數，並將 HTML 和 JavaScript 轉換為新的 PDF 文件。

 最後，可以使用 `SaveAs` 方法保存 PDF 文檔。 現在，您將擁有一個新的 PDF 文件，其中包含使用 HTML 和 JavaScript 完全渲染的圖表。

 [點擊此處查看指南，包括範例、範例代碼和檔案 >](https://ironpdf.com/how-to/javascript-to-pdf/#charting-with-javascript-ironpdf)


var renderer = new ChromePdfRenderer
```();
- renderer.RenderingOptions.EnableJavaScript = true;
- renderer.RenderingOptions.WaitFor.JavaScript();

 renderer.RenderingOptions.CssMediaType = IronPdf.Rendering.PdfCssMediaType.Print;

 - ```Chinese (zh_TW)
var pdf = renderer.RenderHtmlAsPdf
```(htmlWithJs);

 首先，我們需要建立將用於創建 PDF 文件的 HTML 內容。 此 HTML 包含內嵌 JavaScript 以使用 C3 庫生成條形圖。 setTimeout 函數確保在 1 秒後，`window.ironpdf.notifyRender()被調用，通知IronPDF在JavaScript執行完成後繼續進行頁面渲染。

 現在，我們可以看看這是如何呈現在一個易於閱讀的 PDF 文件中。 首先，我們創建一個新的 `ChromePdfRenderer` 實例，用於訪問 IronPDF 使用的強大渲染引擎，並允許在 HTML 頁面中渲染高級 JavaScript。

 接下來，我們有三個不同的選項，這些選項是使用 `RenderingOptions` 類別設置的。 首先，`EnableJavaScript = true` 確保範例 HTML 文件中的 JavaScript 在渲染 HTML 頁面時被執行。 `WaitFor.JavaScript()用來暫停渲染過程，直到所有 JavaScript 都運行完成，以確保圖表正確渲染。 第三個選項 `CssMediaType = IronPdf.Rendering.PdfCssMediaType.Print`，將CSS媒體類型設置為打印，優化樣式以進行PDF呈現。

 接下來的步驟是將我們先前創建的 HTML 文件最終渲染成 PDF 文件。這通過 `RenderHtmlAsPdf` 方法完成，該方法接收 `htmlWithJs` 變數，並將 HTML 和 JavaScript 轉換為新的 PDF 文件。

 最後，可以使用 `SaveAs` 方法保存 PDF 文檔。 現在，您將擁有一個新的 PDF 文件，其中包含使用 HTML 和 JavaScript 完全渲染的圖表。

 [點擊此處查看指南，包括範例、範例代碼和檔案 >](https://ironpdf.com/how-to/javascript-to-pdf/#charting-with-javascript-ironpdf)

Dim renderer = New ChromePdfRenderer ```()
- renderer.RenderingOptions.EnableJavaScript = True
- renderer.RenderingOptions.WaitFor.JavaScript()

 renderer.RenderingOptions.CssMediaType = IronPdf.Rendering.PdfCssMediaType.Print

 - ```Chinese(zh_TW) var pdf = renderer.RenderHtmlAsPdf ```(htmlWithJs)

'INSTANT VB TODO TASK: The following line uses invalid syntax:
' 首先，我們需要建立將用於創建 PDF 文件的 HTML 內容。 此 HTML 包含內嵌 JavaScript 以使用 C3 庫生成條形圖。 setTimeout 函數確保在 1 秒後，`window.ironpdf.notifyRender()被調用，通知IronPDF在JavaScript執行完成後繼續進行頁面渲染。 現在，我們可以看看這是如何呈現在一個易於閱讀的 PDF 文件中。 首先，我們創建一個新的 `ChromePdfRenderer` 實例，用於訪問 IronPDF 使用的強大渲染引擎，並允許在 HTML 頁面中渲染高級 JavaScript。 接下來，我們有三個不同的選項，這些選項是使用 `RenderingOptions` 類別設置的。 首先，`EnableJavaScript = true` 確保範例 HTML 文件中的 JavaScript 在渲染 HTML 頁面時被執行。 `WaitFor.JavaScript()用來暫停渲染過程，直到所有 JavaScript 都運行完成，以確保圖表正確渲染。 第三個選項 `CssMediaType = IronPdf.Rendering.PdfCssMediaType.Print`，將CSS媒體類型設置為打印，優化樣式以進行PDF呈現。 接下來的步驟是將我們先前創建的 HTML 文件最終渲染成 PDF 文件。這通過 `RenderHtmlAsPdf` 方法完成，該方法接收 `htmlWithJs` 變數，並將 HTML 和 JavaScript 轉換為新的 PDF 文件。 最後，可以使用 `SaveAs` 方法保存 PDF 文檔。 現在，您將擁有一個新的 PDF 文件，其中包含使用 HTML 和 JavaScript 完全渲染的圖表。 [點擊此處查看指南，包括範例、範例代碼和檔案 >](https: 'ironpdf.com/how-to/javascript-to-pdf/#charting-with-javascript-ironpdf)