本文介绍了HTML5 画布转 PDF的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着跟版网的小编来一起学习吧！
问题描述
我正在使用 HTML5 并使用画布作为设计工具.但是，我想将我的画布保存在一个默认为 image/png 的 jpeg 文件中，并且我想在 PDF 中显示我的画布的预览.
I am working in HTML5 and using canvas as a designing tool. However, I want to save my canvas in a jpeg file with a default of image/png and I want to show the preview of my canvas in a PDF.
推荐答案
一个好的方法是结合使用 jspdf.js 和 html2canvas.
A good approach is to use a combination of jspdf.js and html2canvas.
<canvas id="canvas" width="480" height="320"></canvas>
<button id="download">Download Pdf</button>
html2canvas($("#canvas"), { onrendered: function(canvas) {
var imgData = canvas.toDataURL('image/png');
var doc = new jsPDF('p', 'mm');
doc.addImage(imgData, 'PNG', 10, 10);
doc.save('sample-file.pdf');
}
});
jsfiddle:http://jsfiddle.net/p4s5k59s/1222/
在 Google Chrome 38、IE11 和 Firefox 34 中测试.
对于 Safari，您可能需要将图像格式从 PNG 更改为 JPEG.
Tested in Google Chrome 38, IE11 and Firefox 34.
For Safari you might need to change the image format from PNG to JPEG.
这篇关于HTML5 画布转 PDF的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持跟版网！
本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益，请联系我们，我们会在确认后第一时间进行删除！