|
| 1 | +--- |
| 2 | +layout: post |
| 3 | +title: Annotations Permission in Angular PDF Viewer | Syncfusion |
| 4 | +description: Learn here all about how to use annotation permissions in Syncfusion Angular PDF Viewer using programmatic APIs. |
| 5 | +platform: document-processing |
| 6 | +control: PDF Viewer |
| 7 | +documentation: ug |
| 8 | +domainurl: ##DomainURL## |
| 9 | +--- |
| 10 | + |
| 11 | +# Annotation permissions in Angular |
| 12 | + |
| 13 | +Use [annotationSettings](https://ej2.syncfusion.com/angular/documentation/api/pdfviewer/index-default#annotationsettings) to control creation-time permissions and default behavior for annotations in the PDF Viewer. These settings establish defaults for annotations created through the UI and programmatic flows. |
| 14 | + |
| 15 | +## Common permissions |
| 16 | + |
| 17 | +- `isLock`: Lock an annotation so it cannot be moved, resized, edited, or deleted. |
| 18 | +- `skipPrint`: Exclude annotations from the print output when printing from the viewer. |
| 19 | +- `skipDownload`: Exclude annotations from the exported/downloaded PDF. |
| 20 | + |
| 21 | +Example: set default `annotationSettings` on the Angular `ejs-pdfviewer` component. |
| 22 | + |
| 23 | +{% tabs %} |
| 24 | +{% highlight ts tabtitle="Standalone" %} |
| 25 | +import { Component } from '@angular/core'; |
| 26 | +import { PdfViewerModule, ToolbarService, AnnotationService } from '@syncfusion/ej2-angular-pdfviewer'; |
| 27 | + |
| 28 | +@Component({ |
| 29 | + selector: 'app-root', |
| 30 | + template: ` |
| 31 | + <ejs-pdfviewer |
| 32 | + id="pdfViewer" |
| 33 | + [documentPath]="documentPath" |
| 34 | + [resourceUrl]="resourceUrl" |
| 35 | + [annotationSettings]="annotationSettings" |
| 36 | + style="height:650px;display:block"> |
| 37 | + </ejs-pdfviewer> |
| 38 | + `, |
| 39 | + imports: [PdfViewerModule], |
| 40 | + providers: [ToolbarService, AnnotationService] |
| 41 | +}) |
| 42 | +export class AppComponent { |
| 43 | + public documentPath: string = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'; |
| 44 | + public resourceUrl: string = 'https://cdn.syncfusion.com/ej2/31.2.2/dist/ej2-pdfviewer-lib'; |
| 45 | + |
| 46 | + public annotationSettings: any = { |
| 47 | + author: 'XYZ', |
| 48 | + minHeight: 10, |
| 49 | + minWidth: 10, |
| 50 | + maxWidth: 100, |
| 51 | + maxHeight: 100, |
| 52 | + isLock: false, |
| 53 | + skipPrint: false, |
| 54 | + skipDownload: false, |
| 55 | + allowedInteractions: ['Resize'] |
| 56 | + }; |
| 57 | +} |
| 58 | +{% endhighlight %} |
| 59 | +{% endtabs %} |
| 60 | + |
| 61 | +## Individual permissions |
| 62 | + |
| 63 | +- `isPrint`: Controls whether a specific annotation participates in printing. Set to `false` to exclude only that annotation from print output. |
| 64 | +- `isLock`: Lock or unlock a specific annotation instance programmatically. |
| 65 | + |
| 66 | +Example: set per-annotation defaults for text markup, shapes, and measurements as component bindings in Angular. |
| 67 | + |
| 68 | +{% tabs %} |
| 69 | +{% highlight ts tabtitle="Standalone" %} |
| 70 | +import { Component } from '@angular/core'; |
| 71 | +import { PdfViewerModule, ToolbarService, AnnotationService } from '@syncfusion/ej2-angular-pdfviewer'; |
| 72 | + |
| 73 | +@Component({ |
| 74 | + selector: 'app-root', |
| 75 | + template: ` |
| 76 | + <ejs-pdfviewer |
| 77 | + id="pdfViewer" |
| 78 | + [documentPath]="documentPath" |
| 79 | + [resourceUrl]="resourceUrl" |
| 80 | + [highlightSettings]="highlightSettings" |
| 81 | + [strikethroughSettings]="strikethroughSettings" |
| 82 | + [underlineSettings]="underlineSettings" |
| 83 | + [squigglySettings]="squigglySettings" |
| 84 | + |
| 85 | + [lineSettings]="lineSettings" |
| 86 | + [arrowSettings]="arrowSettings" |
| 87 | + [rectangleSettings]="rectangleSettings" |
| 88 | + [circleSettings]="circleSettings" |
| 89 | + [polygonSettings]="polygonSettings" |
| 90 | + |
| 91 | + [distanceSettings]="distanceSettings" |
| 92 | + [perimeterSettings]="perimeterSettings" |
| 93 | + [areaSettings]="areaSettings" |
| 94 | + [radiusSettings]="radiusSettings" |
| 95 | + [volumeSettings]="volumeSettings" |
| 96 | + |
| 97 | + [freeTextSettings]="freeTextSettings" |
| 98 | + [inkAnnotationSettings]="inkAnnotationSettings" |
| 99 | + [stampSettings]="stampSettings" |
| 100 | + [stickyNotesSettings]="stickyNotesSettings" |
| 101 | + style="height:650px;display:block"> |
| 102 | + </ejs-pdfviewer> |
| 103 | + `, |
| 104 | + imports: [PdfViewerModule], |
| 105 | + providers: [ToolbarService, AnnotationService] |
| 106 | +}) |
| 107 | +export class AppComponent { |
| 108 | + public documentPath: string = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'; |
| 109 | + public resourceUrl: string = 'https://cdn.syncfusion.com/ej2/31.2.2/dist/ej2-pdfviewer-lib'; |
| 110 | + |
| 111 | + public highlightSettings = { author: 'QA', subject: 'Review', color: '#ffff00', opacity: 0.6 }; |
| 112 | + public strikethroughSettings = { author: 'QA', subject: 'Remove', color: '#ff0000', opacity: 0.6 }; |
| 113 | + public underlineSettings = { author: 'Guest User', subject: 'Points to be remembered', color: '#00ffff', opacity: 0.9 }; |
| 114 | + public squigglySettings = { author: 'Guest User', subject: 'Corrections', color: '#00ff00', opacity: 0.9 }; |
| 115 | + |
| 116 | + public lineSettings = { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, isLock: false, isPrint: true }; |
| 117 | + public arrowSettings = { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, isLock: false, isPrint: true }; |
| 118 | + public rectangleSettings = { fillColor: '#ffffff00', strokeColor: '#222222', thickness: 1, opacity: 1, isLock: false, isPrint: true }; |
| 119 | + public circleSettings = { fillColor: '#ffffff00', strokeColor: '#222222', thickness: 1, opacity: 1, isLock: false, isPrint: true }; |
| 120 | + public polygonSettings = { fillColor: '#ffffff00', strokeColor: '#222222', thickness: 1, opacity: 1, isLock: false, isPrint: true }; |
| 121 | + |
| 122 | + public distanceSettings = { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, isLock: false, isPrint: true }; |
| 123 | + public perimeterSettings = { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, isLock: false, isPrint: true }; |
| 124 | + public areaSettings = { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, fillColor: '#ffffff00', isLock: false, isPrint: true }; |
| 125 | + public radiusSettings = { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, fillColor: '#ffffff00', isLock: false, isPrint: true }; |
| 126 | + public volumeSettings = { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, fillColor: '#ffffff00', isLock: false, isPrint: true }; |
| 127 | + |
| 128 | + public freeTextSettings = { borderColor: '#222222', opacity: 1, isLock: false, isPrint: true }; |
| 129 | + public inkAnnotationSettings = { strokeColor: '#0000ff', thickness: 3, opacity: 0.8, isLock: false, isPrint: true }; |
| 130 | + public stampSettings = { opacity: 0.9, isLock: false, isPrint: true }; |
| 131 | + public stickyNotesSettings = { author: 'QA', subject: 'Review', opacity: 1, isLock: false, isPrint: true }; |
| 132 | +} |
| 133 | +{% endhighlight %} |
| 134 | +{% endtabs %} |
| 135 | + |
| 136 | +Behavior notes |
| 137 | +- isLock true: The annotation is locked; users cannot move, resize, or edit it through the UI until it is unlocked. |
| 138 | +- skipPrint true: All annotations are omitted from the print output initiated from the viewer. |
| 139 | +- skipDownload true: All annotations are omitted from the exported/downloaded PDF from the viewer. |
| 140 | +- isPrint on an individual annotation: Use this when you only want to exclude a particular annotation from printing while leaving others printable. |
| 141 | + |
| 142 | +[View Sample on GitHub](https://github.com/SyncfusionExamples/react-pdf-viewer-examples) |
| 143 | + |
| 144 | +## See also |
| 145 | + |
| 146 | +- [Annotation Overview](../overview) |
| 147 | +- [Annotation Types](../annotation/annotation-types/area-annotation) |
| 148 | +- [Annotation Toolbar](../toolbar-customization/annotation-toolbar) |
| 149 | +- [Create and Modify Annotation](../annotation/create-modify-annotation) |
| 150 | +- [Customize Annotation](../annotation/customize-annotation) |
| 151 | +- [Remove Annotation](../annotation/delete-annotation) |
| 152 | +- [Handwritten Signature](../annotation/signature-annotation) |
| 153 | +- [Export and Import Annotation](../annotation/export-import/export-annotation) |
| 154 | +- [Annotation in Mobile View](../annotation/annotations-in-mobile-view) |
| 155 | +- [Annotation Events](../annotation/annotation-event) |
| 156 | +- [Annotation API](../annotation/annotations-api) |
0 commit comments