Search results

Customize the selection border in Angular PDF Viewer component

22 Nov 2022 / 1 minute to read

The PDF Viewer library allows you to customize the annotations selection borders using the annotationSelectorSettings Property.

The following steps are used to customize the selection border.

Step 1: Follow the steps provided in the link to create simple PDF Viewer sample in Angular.

Step 2: Add the following code snippet in app.component.html and app.component.ts files to customize selection borders.

Copied to clipboard
<ejs-pdfviewer id="pdfViewer" [serviceUrl]='service' [documentPath]='document'
    [freeTextSettings]="annotationsettings" [rectangleSettings]="annotationsettings"
    [stampSettings]="annotationsettings" style="height:640px;display:block">
Copied to clipboard
public annotationsettings: any = {
annotationSelectorSettings: {
    selectionBorderColor: 'yellow',
    resizerShape: 'Circle',
    selectorLineDashArray: 9

Find the Sample how to customize the selection border