Page Display Layout

DsPdfViewer enables a user to set the page layout of PDF documents to enhance the viewing experience using Page Display drop-down button () in the toolbar. Page Display drop-down button provides the following options to set the page layout:

Option	Client-side API	Description
Single-page view	SinglePage	Displays a single page at a time. Ideal for focused reading and detailed examination of content.
Two-page view	TwoPage	Displays two pages side by side, optimizing the layout for comparison and context understanding.
Single-page Scrolling	SinglePageScrolling	Displays a single page with the ability to scroll through the document vertically in a single-column layout for easy navigation.
Two-page Scrolling	TwoPageScrolling	Displays two pages simultaneously with the ability to scroll through the document, facilitating a broader view while maintaining readability.
Enable scrolling	None	Enables you to scroll through the document continuously in a vertical column.

Set Initial Page Display Layout

DsPdfViewer provides pageDisplay option to set the initial page display layout of the viewer. Refer to the following example code to set the initial page display layout:

// Set initial page display to TwoPageScrolling.
var viewer = new DsPdfViewer("#host", { supportApi: 'api/pdf-viewer', pageDisplay: "TwoPageScrolling" });

Change Page Display Layout

DsPdfViewer provides pageDisplay property to change the page display layout of the viewer. Refer to the following example code to change the page display layout:

// Change page display to SinglePageScrolling.
viewer.pageDisplay = "SinglePageScrolling";

Set Initial Page Display Layout
Change Page Display Layout