[英]Convert an HTML page to PDF from JavaScript
我正在用HTML / JS开发Windows 8笔记应用程序。
我可以使用画布覆盖获取可导出到的图像,但是存在对齐问题。 我希望有一种可靠的方法可以导出到PDF。 需要导出的内容是在div中嵌入的一些HTML。
请注意,我可以保存字节流,但是我不知道如何将HTML转换为PDF字节流。 必须使用JavaScript来完成,但是可以使用Windows 8 JS API。
该文档将包含MathJax和图像,因此应该不会有太多的对齐问题。
对于HTML-> PDF,这并不容易,我的意思是,您可以在打印对话框中手动将其另存为.pdf,从而得到@media print .css文件的支持。
但是我假设您希望它自动执行更改,筛选价格昂贵的商业软件,我设法找到了以下内容...
https://github.com/MrRio/jsPDF
从外观上看,它应该可以满足您的需求。
不确定PDF,但在Windows 8上,您可以使用Webview.capturePreviewToBlobAsync()函数创建图像。
它捕获了Webview中显示的所有内容,并且由于它是直接捕获,因此可以捕获IE11中可以显示的任何内容,包括MathJax。
我刚才写了一个简单的示例应用程序,能够捕获网站:图像。 显然,您可以使用URL或插入自己的自定义HTML。
function printeWebViewToDiskThenDisplay() {
var wc = document.getElementById("webview");
Windows.Storage.ApplicationData.current.localFolder.createFileAsync("webview.png", Windows.Storage.CreationCollisionOption.replaceExisting).then(function (file) {
file.openAsync(Windows.Storage.FileAccessMode.readWrite).then(function (stream) {
var capturePreview = wc.capturePreviewToBlobAsync();
capturePreview.oncomplete = function (completeEvent) {
var inputStream = completeEvent.target.result.msDetachStream();
Windows.Storage.Streams.RandomAccessStream.copyAsync(inputStream, stream).then(function () {
stream.flushAsync().done(function () {
inputStream.close();
stream.close();
var image = new Image();
image.src = URL.createObjectURL(file);
result.innerHTML = "";
result.appendChild(image);
});
});
};
capturePreview.start();
});
});
}
HTML看起来像这样:
<button id="btnPrint">Print</button>
<div style="transform:scale(1); transform-origin:0% 0%">
<x-ms-webview id="webview" src="http://cdn.mathjax.org/mathjax/latest/test/sample.html"
style="width: 400px; height: 400px;">
</x-ms-webview>
</div>
<div id="result"></div>
结果如下:
您可以下载我在这里构建的粗略示例:
我已经使用jsPDF JS库在JS中生成PDF文件,但是根据您的描述,我不确定这是否是您要查找的内容
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.