我已经使用php DOMDocument为我的项目创建了一个报告生成库来创建html文件并保存为临时文件。 Html包含javascript部分,它接受参数并使用canvas渲染形状并保存为数据URI,但在pdf中显示为空白。
<div style="width:100%;height:200px">
<img id="overview" style="width:170px;height:170px;float:left;padding:10px"
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAcxklEQVR4nO2deXhU5b3HXxattba4UVu
XinVp771Pe3uLXW5re6OXyg3n/Z0Qda56W1t722JrXUq1rbZUpwUVympgCEPCJCEJS0ggJAGEbMiWEJJAco0
57wkhIJhl9swSWXPuH5nEEZLZZ37nTN7P83yep545pnPe3/fnmbO9hxBOXGhPT7+pXRCmywCPMkp/L4GwmIGQIwEtY5QeZEAlBkKXDNQuA7UzoB4GVPHp+Xi50MWASozSgzKl2yWgJgmExYzS38sAj7YLw
vS2mTNvxN5eDmdUTojiLbIo/oiJwku+BmhiQF1+YU+Q4Bz6/xZyGK/l9OEGcfT0z+PPT6ccURtSsrkdkGYLoHwOxmgiAE9k/hGCNszMkCRDMLz7YIwvTYlZTL2OHKSiOOieI8k0hcloLsv+xmkVT0M6A4m0ueOi+I92OPL0Ri
K...+i6PWTsevHSSCSKN4qUzovVnuVZHpIylVTc86an7/bsmrVN7HrxEFGIWRCB6X/LlO6ggE9E2mDaP0hKU9d3UX75s1N5tWrfqYQMgG7LhwVouj1E2Vx1g8ZCMuYSFk4DaLFh6TctbVnrYWFDX0
GwzNKbS3/CcUJj+OieA8T6XMM6A4W4C2+WnlIynP48KBj+/ZuS37+ZktWVgr2+HKSCEWnmyTPmvWNobNhwgYG9IPhBlHrQ1LuffsuOMq2n7IWFpb0ZmY+oRiNV2GPI2ccwQBu
ZpT+56k/vrzQXlwsOXftcnnq6y4lfM/Q0DDo3LPHY9taIls3Fpb3ZWf/kV+n4KgWW8ai2y1r1/7YnJX1ljk3p9haWHDIVlIiOysqep2Vla7+6uqz7v37z3sOHx70NjcPXhH6lhbF09Aw6D5w4IKrtuass7LS1b9
rV5+jtLTDtmlTvTU/b6vFZFpsXrfu6b5c4/iatzaB/D/Az73HHWzt/AAAAABJRU5ErkJggg==">
</div>
javascript部分
var angle=360-((relate/(relate+download))*360);
can=document.createElement("canvas");
can.width=200;
can.height=200;
ctx=can.getContext("2d");
var centerx=can.width/2;
var centery=can.width/2;
ctx.fillStyle="#d94d4c";
ctx.strokeStyle="#d94d4c";
ctx.beginPath();
ctx.arc(centerx,centery,(can.width/2)-40,0,2*Math.PI,false);
ctx.arc(centerx,centery,can.width/2,2*Math.PI,0,true);
ctx.fill();
ctx.fillStyle="#f6d2d2";
ctx.strokeStyle="#f6d2d2";
if(angle>=60){
angle=angle-60
}else{
angle=angle+300
}
ctx.beginPath();
ctx.arc(centerx,centery,(can.width/2)-40,300*(Math.PI/180),angle*(Math.PI/180),false);
ctx.arc(centerx,centery,can.width/2,angle*(Math.PI/180),300*(Math.PI/180),true);
ctx.fill();
document.getElementById(relateid).src=can.toDataURL();
可能是什么问题?