pdf.js实现旋转放⼤缩⼩
通过设置 getViewport 函数的scale 参数，可以设置控制放⼤和缩⼩⽐例
1：函数定义
通过查看源码，这个函数有两个参数
1.1 :scale ⼩数型，1.0 表⽰100%，0.5 ，表⽰缩放50%
1.2 roate ，旋转
1.2 代码测试，Viewport(0.8)，显⽰如下图所⽰
1.3 代码测试，Viewport(1.3)显⽰如下图所⽰，130% 显⽰
1.4 旋转90度，放⼤1.5倍 Viewport(1.5,90)
1.5 应为代码⽐较简单，其他不再做解释了，放出完整的测试代码
<html>
<head>
<title>pdf.js缩放</title>
<meta http-equiv="content-type"content="text/html;charset=utf-8">
</head>
<h1>pdf展⽰</h1>
<div>
<button id="prev">Previous</button>
<button id="next">Next</button>
<button id="enlarge">放⼤</button>
<button id="letting">缩⼩</button>
   
<span>Page: <span id="page_num"></span> / <span id="page_count"></span></span>
<span>Page: <span id="page_num"></span> / <span id="page_count"></span></span> </div>
<canvas id="the-canvas"></canvas>
<script src="js/pdf.js"></script>
<script src="js/pdf.worker.js"></script>
<script>
var url = 'doc/demo1.pdf';
var pdfDoc = null,
pageNum = 1,
pageRendering = false,
pageNumPending = null,
scale = 0.8,//放⼤系数
canvas = ElementById('the-canvas'),
ctx = Context('2d');
/**
* Get page info from document, resize canvas accordingly, and render page.
* @param num Page number.
*/
function renderPage(num) {
pageRendering = true;
// Using promise to fetch the page
var viewport = Viewport(scale);
canvas.height = viewport.height;
canvas.width = viewport.width;
// Render PDF page into canvas context
var renderContext = {
canvasContext: ctx,
viewport: viewport
};
var renderTask = der(renderContext);
// Wait for rendering to finish
renderTask.promise.then(function() {
pageRendering = false;
if (pageNumPending !== null) {
// New page rendering is pending
renderPage(pageNumPending);
pageNumPending = null;
}
});
});
// Update page counters
}
/**
* If another page rendering in progress, waits until the rendering is
* finised. Otherwise, executes rendering immediately.
*/
function queueRenderPage(num) {
if (pageRendering) {
pageNumPending = num;
} else {
renderPage(num);
}
}
/**
* Displays previous page.
pending*/
function onPrevPage() {
function onPrevPage() {
if (pageNum <= 1) {
return;
}
pageNum--;
queueRenderPage(pageNum);
}
//放⼤
scale += 0.1;
queueRenderPage(pageNum);
});
//缩⼩
scale -= 0.1;
queueRenderPage(pageNum);
});
/**
* Displays next page.
*/
function onNextPage() {
if (pageNum >= pdfDoc.numPages) {
return;
}
pageNum++;
queueRenderPage(pageNum);
}
/**
* Asynchronously downloads PDF.
*/
pdfDoc = pdfDoc_;
// Initial/first page rendering
renderPage(pageNum);
});
</script>
</html>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。