Syncfusion AI Assistant

How can I help you?

Customize Print Quality in React PDF Viewer

9 Mar 20263 minutes to read

This article shows a concise, task-oriented workflow to set and verify print quality for documents rendered by the React PDF Viewer by using the printScaleFactor property.

Goal: Set a suitable printScaleFactor to improve printed output sharpness while balancing performance and memory use.

Steps

1. Choose a target print quality.

  • Valid printScaleFactor values: 0.5 – 5. Higher values increase image sharpness and resource use.
  • Default value: 1.

2. Set printScaleFactor during initialization

It is recommended that you set the printScaleFactor in the viewer options during initialization.

import {
    PdfViewerComponent, Toolbar, Magnification, Navigation, Annotation, FormDesigner,
    FormFields, TextSelection, TextSearch, Print, Inject
} from '@syncfusion/ej2-react-pdfviewer';

export default function App() {
    return (
        <div style={{ height: '100vh' }}>
            <PdfViewerComponent
                id="PdfViewer"
                documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf"
                resourceUrl="https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib"
                printScaleFactor={0.5}
                style={{ height: '100%' }}
            >
                <Inject
                    services={[
                        TextSelection, TextSearch, Print, Navigation, Toolbar, Magnification,
                        Annotation, FormDesigner, FormFields
                    ]}
                />
            </PdfViewerComponent>
        </div>
    );
}

3. Set printScaleFactor after instantiation

As an alternative option, the printScaleFactor can be dynamically changed during runtime

  • TS
    • // Update printScaleFactor at runtime
pdfviewer.printScaleFactor = 2; // increase print resolution for upcoming prints

    4. Verify output

    Use browser Print Preview or produce a printed/PDF copy to confirm sharpness and acceptable render time.

    Notes

    • Values outside the supported range 0.5 – 5 will be ignored and fall back to the default (1).
    • Increasing printScaleFactor raises CPU, memory, and rendering time requirements. Test on target machines and documents before setting a higher factor.

    View sample in GitHub

    See Also