福昕开发者文档中心

页面导航与缩放 ​

福昕 PDF SDK（Web）支持通过 Viewer 和渲染对象控制页面跳转、缩放和视图旋转。相关接口包括：

  • PDFViewer.zoomTo()
  • PDFViewer.rotateTo()
  • PDFViewer.redraw()
  • PDFDocRender.getCurrentPageIndex()
  • PDFDocRender.goToPage()

如果使用完整 UI（UIExtension），页面输入框、上一页/下一页、缩放按钮和旋转视图等交互通常已内置。本文介绍通过 API 控制这些查看状态的方式。

跳转到指定页面 ​

PDFDocRender.goToPage(index, offset, isPDFPoint) 用于跳转到指定页面。页面索引从 0 开始。

javascript
const pdfViewer = await pdfui.getPDFViewer();
const docRender = pdfViewer.getPDFDocRender();

// 跳转到第 3 页。
await docRender.goToPage(2);

如果需要跳转到页面上的指定位置，可以传入 offset。isPDFPoint 为 true 时，offset 按 PDF 坐标处理；否则按 device 坐标处理。

javascript
await docRender.goToPage(0, { x: 0, y: 500 }, true);

获取当前页 ​

当前页索引可从 PDFDocRender 获取：

javascript
const docRender = pdfViewer.getPDFDocRender();
const currentPageIndex = docRender.getCurrentPageIndex();

缩放文档 ​

PDFViewer.zoomTo(scale, position) 用于设置缩放比例。scale 可以是数值，也可以是 'fitWidth'、'fitHeight' 等 Viewer 支持的适配模式。

javascript
await pdfViewer.zoomTo(1.25);
await pdfViewer.zoomTo('fitWidth');
await pdfViewer.zoomTo('fitHeight');

如果传入数值，缩放比例需要在 Viewer 初始化参数允许的最小值和最大值范围内。

旋转视图 ​

PDFViewer.rotateTo(degree, options) 用于旋转 Viewer 中的页面显示。该接口只改变查看器显示效果，不会修改 PDF 页面数据。

javascript
await pdfViewer.rotateTo(90);

可用角度通常为 0、90、180、270，或 90 的倍数。

刷新显示 ​

通过 API 修改了会影响页面显示的内容后，可以调用 PDFViewer.redraw(force) 更新当前视图。

javascript
await pdfViewer.redraw();
await pdfViewer.redraw(true);

注意事项 ​

  • 页面索引从 0 开始。
  • 页面导航、缩放和旋转视图属于 Viewer 状态，不会写入 PDF 文件。
  • 涉及坐标跳转时，应区分 PDF 坐标和 Viewer/device pixels。
  • 如果需要修改 PDF 页面本身的旋转角度，请使用 页面组织 中的页面旋转接口。