问题就在标题里。由于图形是用Javascript创建的,而PDF是在服务器端生成的,所以我想知道是否有任何方法(如果有必要的话,可能是一种不太漂亮的方法)将这些图形包含到使用FPDF生成的PDF中。
我想包含的图表示例:https://jsfiddle.net/srm8gzqg/3/chart.draw(data, options);
我几乎绝望了,因为我还没有找到一个php替代方案,我可以在小提琴中创建一个图形。要求如下:
- 从上到下的行
- 输入数据可以有浮点值
- 轴在左边和底部,具有正确的标签方向等
我真的发现没有用php编写的好库,可以输出具有给定要求的图像文件(jpg, png等)。任何提示都非常感谢
这是一个以图像形式呈现的google图表的jsfiddle示例。您可以轻松地将"可打印版本"放入pdf文件中。
Google图表有getImageURI方法,为您提供您创建的图表的png。
// Wait for the chart to finish drawing before calling the getImageURI() method.
google.visualization.events.addListener(chart, 'ready', function () {
chart_div.innerHTML = '<img src="' + chart.getImageURI() + '">';
});
如果我错了,请纠正我,但据我所知,FPDF只能使用(包括)图像文件。所以你可以做的是生成带有图像头的图形,然后在FPDF中包含指向该图形的链接(在包含php生成的东西并添加图像头时工作良好,但转换JS生成的图形可能会很棘手,可能需要一些技巧)。另一个解决方案(如果可能的话)尝试使用wkhtmltopdf。它从html页面生成PDF(同样不确定它是否会与JS生成的图形一起工作)。
我用这个方法来保存谷歌图表作为一个图像使用base64 url保存在一些文件夹从服务器端最后使用在fpdf作为文件夹的图像。
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawVisualization);
function drawVisualization() {
// Some raw data (not necessarily accurate)
var data = google.visualization.arrayToDataTable([
['', ''],
['Numerical', 4],
['Verbal', 6],
['Mechanical', 4],
['Reasoning', 5],
['Spatial', 9]
]);
var options = {
title : '',
vAxis: {title: "", viewWindowMode:'explicit',
viewWindow:{
max:12,
min:0
}},
hAxis: {title: ""},
seriesType: "bars",
series: {5: {type: "line"}}
};
var chart = new google.visualization.ComboChart(document.getElementById('chart_div'));
chart.draw(data, options);
var app1=(chart.getImageURI());
$.post("appt1.php",{postapp: app1},
function(){});
}
</script>
<div id="chart_div" style="display: none;"></div>
<!-- On the Server side do this to store image appt1.php -->
$data =$_POST['postapp'];
list($type, $data) = explode(';', $data);
list(, $data) = explode(',', $data);
$data = base64_decode($data);
file_put_contents('exam_images/'."1".'.png', $data);