Web專案中預覽PDF

u014249394發表於2017-01-09
Web
  • 

    介紹
    

    • 


本文介紹在Web專案中如何預覽PDF文件。


  • 

    Js版本
    

    • 


示例程式碼：
[codesyntax lang="html4strict"]

<html>
<head>
<script type="text/javascript" src="http://mozilla.github.io/pdf.js/build/pdf.js"></script>
</head>
<body>
<canvas id="the-canvas" style="border:1px  solid black" height="300" width="300"></canvas>
<script type="text/javascript">
PDFJS.getDocument("http://mozilla.github.io/pdf.js/web/compressed.tracemonkey-pldi-09.pdf")
.then(function getPdfHelloWorld(pdf) {
	/*
	 * 獲取第一頁
	 */
	pdf.getPage(1).then(function getPageHelloWorld(page) {
		var scale = 1.5;
		var viewport = page.getViewport(scale);

		//準備畫布
		var canvas = document.getElementById('the-canvas');
		var context = canvas.getContext('2d');
		canvas.height = viewport.height;
		canvas.width = viewport.width;

		//pdf文件渲染
		var renderContext = {
			canvasContext : context,
			viewport : viewport
		};
		page.render(renderContext);
	});
});
</script>
</body>
</html>

[/codesyntax]

  • 

    Java
    

    • 


可以先把PDF文件轉換為圖片，然後分頁顯示圖片。

檢視原文：http://surenpi.com/2017/01/09/web_view_pdf/ 




相關文章