渲染流动图 IronPDF答案

【问题标题】：Rendering flot chart IronPDF渲染流动图 IronPDF
【发布时间】：2020-06-16 13:26:05
【问题描述】：

尝试使用 IronPDF 和 razor pages 渲染 Flot 图表，但没有运气。我的剃须刀页面中有以下 jQuery：

这是我的 div：

<div id="flotChart" style="width:100%;height:300px"></div>

为 IronPDF 启用了 javascript：

Renderer.PrintOptions.EnableJavaScript = true;
Renderer.PrintOptions.RenderDelay = 500; //milliseconds

然而，PDF 中没有生成任何内容。

【问题讨论】：

标签： jquery flot razor-pages asp.net-core-3.0 ironpdf

【解决方案1】：

尝试使用他们新的 2021 Chrome 相同渲染引擎在 IronPdf 上运行完全相同的代码。

它具有更现代的 JS 解析，并允许更多内存用于 JS 执行。

它适用于我的图表、jQuery 和 Angular。

只需将 IronPdf Nuget 包替换为 IronPdf Chrome HTML to PDF Renderer
https://www.nuget.org/packages/IronPdf/

【讨论】：

ironpdf.com/docs/questions/javascript-to-pdf/… 示例代码

【解决方案2】：

我是 Iron Software 的技术人员。我们目前正在对渲染引擎进行重大升级，以使 Flot 图表更加兼容。

与此同时，我们推荐 D3/C3 作为一个很好的通用方案，尽管较新版本的 D3/C3 会导致问题，因此请参阅下面的代码以获取建议。

其他客户也报告使用 Highcharts 和 Google Charts 取得了成功。

<!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 >

我希望这有助于为您指明正确的方向。

【讨论】：