如何使用pdfjs旋转整个pdf中的单页?

Zya*_*boy 5 javascript rotation pdf.js

我从 mozilla 下载了 pdf.js 库。它非常适合打开我的 pdf 文件并查看它们。问题是,当我单击旋转页面时,它会旋转所有页面,而不仅仅是所选页面。我尝试用谷歌搜索并阅读 pdf.js 的手册,但找不到有关在 pdf.js 中旋转单个 pdf 页面的相关资源,请帮助

小智 1

取决于您可能想要花费多少工作以及您想要实现的目的:

手动旋转单页:

应用transform: rotate(90deg)或transform: rotate(-90deg)到指定页面的容器元素 - 这可以在当前主要浏览器中使用内置开发人员工具来完成。

我使用了 Mozilla Firefox 附带的内置查看器 - 页面放置在div由属性标识的容器内data-page-number内。

以编程方式旋转单个页面:

function rotateSinglePage(pageNum, degree)
{
  var viewerMain = document.getElementById("viewer");
  var pageContainer = viewerMain.querySelector("div[data-page-number='" + pageNum + "']");
  pageContainer.style.transform = "rotate(" + degree + "deg)";
}
Run Code Online (Sandbox Code Playgroud)

您可以从浏览器的开发人员工具调用此函数,也可以构建您自己的界面(按钮/热键)。

如果您希望能够多次轮换,您可以使用以下方法访问当前轮换:

function getCurrentRotation(pageNum)
{
  var viewerMain = document.getElementById("viewer");
  var pageContainer = viewerMain.querySelector("div[data-page-number='" + pageNum + "']");
  var rotationStyle = pageContainer.style.transform;

  //try to strip everything but the number
  //we assume number to be integer (without fraction)
  var rotation = rotationStyle.replace(/rotate\(([-]?[0-9]{0,3})deg\)/,"$1");
  var rotationDegree = Number.parseInt(rotation);

  //if parseInt fails, it returns NaN - this happens on empty string as well
  //by default an unrotated page (0 degree) has no transform style, so
  //we return 0 degree in this case
  if (Number.isNaN(rotationDegree)) { rotationDegree = 0; }
  return rotationDegree;
}
Run Code Online (Sandbox Code Playgroud)

由于当前页面存储在 中document.getElementById("pageNumber").value,因此您可以构建界面来旋转当前页面。