我正在尝试生成一个PDF文件，其中包含Highcharts作为PDF的一部分。即html表后跟Graphs，更多表等。我使用的是PhantomJS（并有Highcharts-Convert.js）。当我使用PhantomJS rasterize.js文件创建PDF时，我得到PDF但是Highcharts出错了（例如，列栏不会爬到正确的数字 - 如果值为200，则栏会升至50） 。
我认为带有highcharts-convert.js的Phantomjs只是每个图形（就像从图表中保存为PDF一样）。如何对包含HTML和Highcharts图的整个页面进行排序？
换句话说，期待＆＃34;导出整个页面＆＃34;作为PDF（最好通过命令行）。
疯狂地试图解决，欣赏这里的帮助。
我已插入以下代码。这是在服务器端生成的已完成的HTML页面的示例，我想自动将其转换为PDF。 对不起发布新闻，希望我做得对。
<HTML>
<HEAD>
<TITLE>My Title</TITLE>
<SCRIPT src="include/jquery-1.9.1.js"></SCRIPT>
<SCRIPT src="include/jquery-ui.js"></SCRIPT>
<SCRIPT src="include/highcharts.js"></SCRIPT>
<SCRIPT src="include/exporting.js"></SCRIPT>
<SCRIPT src="include/highcharts-more.js"></SCRIPT>
<SCRIPT>
$(function () {
$('#DailyAllDoors').highcharts({
chart: {
type: 'column',
width:width,
borderColor: '#000000',
borderWidth: 2
},
credits: {
enabled: false
},
exporting: { enabled: true },
title: {
text: 'Daily Report '
},
subtitle: {
text: '01 July 2015 to : 31 July 2015 (31 Days)'
},
xAxis: {
categories: [
'Wed 1 July 2015','Thu 2 July 2015','Fri 3 July 2015','Sat 4 July 2015','Sun 5 July 2015','Mon 6 July 2015','Tue 7 July 2015','Wed 8 July 2015','Thu 9 July 2015','Fri 10 July 2015','Sat 11 July 2015','Sun 12 July 2015','Mon 13 July 2015','Tue 14 July 2015','Wed 15 July 2015','Thu 16 July 2015','Fri 17 July 2015','Sat 18 July 2015','Sun 19 July 2015','Mon 20 July 2015','Tue 21 July 2015','Wed 22 July 2015','Thu 23 July 2015','Fri 24 July 2015','Sat 25 July 2015','Sun 26 July 2015','Mon 27 July 2015','Tue 28 July 2015','Wed 29 July 2015','Thu 30 July 2015','Fri 31 July 2015',
],
labels: {
rotation: -45,
align: 'right',
step:1,
}
},
yAxis: [{
min: 0,
labels: {
formatter: function () {
return Highcharts.numberFormat(this.value,0);
},
style: {
color: 'black'
}
},
title: {
text: ' Visitors',
style: {
color: 'black'
}
},
stackLabels: {
enabled: false,
style: {
fontWeight: 'bold',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
},
formatter: function () {
return Highcharts.numberFormat(this.total,0);
}
}
}
],
tooltip: {
headerFormat: '<strong><span style="font-size:12px">{point.key}</span></strong><table width="250">',
pointFormat: '<tr><td style="color:{series.color};padding:0"><font size="2px">{series.name}: </font></td>' +
'<td style="padding:0"><font style="color:{series.color}" size="2px"><b>{point.y}</b></font></td></tr>',
footerFormat: '<tr><td padding:0"><font size="1px"><em>(Disclaimer: Averages indicated for the period selected)</em></font></td></tr></table>',
shared: true,
useHTML: true
},
plotOptions: {
line: {
marker: {
enabled: false
}
},
column: {
stacking: 'normal',
dataLabels: {
enabled: false,
style: {
fontWeight: 'bold',
color: 'white',
},
formatter: function () {
return Highcharts.numberFormat(this.y,0);
}
}
}
},
series: [
{
id: 'Total ',
name: 'Total',
data: [
4593,4667,6852,{y:9792, color: 'grey'},{y:7603, color: 'grey'},3455,3312,3380,3526,5333,{y:7891, color: 'grey'},{y:6293, color: 'grey'},2685,3144,3319,3696,5603,{y:7328, color: 'grey'},{y:5352, color: 'grey'},2299,2224,2563,2576,5226,{y:9534, color: 'grey'},{y:7373, color: 'grey'},2763,2899,3123,3468,6481
]
},
{
id: ' Average',
name: ' Average',
yAxis: 0,
type: 'line',
color: '#00806b',
data: [
4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,4785,
],
dataLabels: {
enabled: false,
color: 'red',
formatter: function () {
return Highcharts.numberFormat(this.y,0);
}
}
}
,{
name: 'Event Days',
yAxis: 0,
type: 'line',
color: '#ed0181',
data: [],
}
,{
type: 'scatter',
name: ' ',
tooltip: {
enabled: false
},
dataLabels: {
format: '{key} Average',
enabled: true,
color: '#00806b',
fontWeight: 'bold',
y: 0,
},
data: [
{ x: 1, y: 4785, name: '4 785'}
],
marker: {
enabled: false,
}
}
]
});
});
</SCRIPT>
</HEAD>
<BODY>
<TABLE bgcolor="#00b9f1" border="0" width="100%" align="center">
<TR>
<TD height="30" align="left"><STRONG><FONT color="white">TOTALS</FONT></STRONG>
</TD>
</TR>
</TABLE>
<DIV id="DailyAllDoors" width="300"></DIV>
<BR><BR>
<TABLE border="1" width="70%">
<TR>
<TD bgcolor="#000080"><FONT color="#FFFFFF">Date</FONT>
</TD>
<TD bgcolor="#000080"><FONT color="#FFFFFF">Days</FONT>
</TD>
<TD bgcolor="#000080"><FONT color="#FFFFFF"> Visitors</FONT>
</TD>
<TD bgcolor="#000080"><FONT color="#FFFFFF">Event Day</FONT>
</TD>
<TD bgcolor="#000080"><FONT color="#FFFFFF">Event Day Description</FONT>
</TD>
</TR>
<TR>
<TD> 01 July 2015
</TD>
<TD> Wed
</TD>
<TD> 4593
</TD>
<TD>
</TD>
<TD>
</TD>
</TR>
<TR>
<TD> 01 July 2015
</TD>
<TD> Wed
</TD>
<TD> 4593
</TD>
<TD>
</TD>
<TD>
</TD>
</TR>
<TR>
<TD> 01 July 2015
</TD>
<TD> Wed
</TD>
<TD> 4593
</TD>
<TD>
</TD>
<TD>
</TD>
</TR>
</TABLE>
</BODY>
</HTML>
最后我运行PhantomJS：
phantomjs --web-security = false rasterize.js＆＃34; http://localhost:151/Reports.asp＆＃34; reports.pdf
上述工作但创建了一个带有Highcharts的PDF，其中列栏没有上升到正确的点（如果值为1000，则例如爬升到50）。
答案 0 :(得分：2)
HighCharts turn animation false for line chart
这就是问题的答案。花了好几个小时找到而不是删除我的问题，我把答案联系起来。 谢谢