我需要生成包括chartjs图表的pdf报告。我用https://v6.charts.erik.cat/实现创建图表和https://github.com/mikehaertl/phpwkhtmltopdf对PDF生成。
$pdf = new Pdf($fileHtml);
$pdf->setOptions([
'javascript-delay' => 10000,
]);
$pdf->saveAs(public_path($filePdf));
但是图表看起来像预加载器到pdf文件中
最好的选择可能是使用支持Javascript的渲染器将图表渲染为图像,然后将该图像添加到PDF中。
选项1:如果您希望坚持使用无头渲染,则--no-stop-slow-scripts
除了Javascript延迟之外,您可能还需要添加一个选项(也可以签出替代渲染器Puppeteer)。
选项2:使用将图表呈现为图像或PDF的服务。QuickChart是执行此操作的开源Web服务(我是其维护者之一)。
例如,使用您的Chart.js配置:
$chartConfig = '{
"type": "bar",
"data": {
"labels": [2012, 2013, 2014, 2015, 2016],
"datasets": [{
"label": "Users",
"data": [120, 60, 50, 180, 120]
}]
}
}';
将其打包到带有/chart
端点的URL中:
$chartUrl = 'https://quickchart.io/chart?w=500&h=300&c=' . urlencode($chartConfig);
然后将生成的URL作为图像包含在wkhtmltopdf页面中:
<img src="https://quickchart.io/chart?w=500&h=300&c=%7B%0A++%22type%22%3A+%22bar%22%2C%0A++%22data%22%3A+%7B%0A++++%22labels%22%3A+%5B2012%2C+2013%2C+2014%2C+2015%2C+2016%5D%2C%0A++++%22datasets%22%3A+%5B%7B%0A++++++%22label%22%3A+%22Users%22%2C%0A++++++%22data%22%3A+%5B120%2C+60%2C+50%2C+180%2C+120%5D%0A++++%7D%5D%0A++%7D%0A%7D" />
这将在没有任何Javascript的情况下呈现您的图表。
如果您想要一种更简单的方法,并且可以只显示图表,则可以添加&format=pdf
到URL,该服务将直接生成图表的PDF:
请注意,如有必要,您可以自托管图表呈现Web服务。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句