Skip to content

Commit 5b9765b

Browse files
SF4524LogeshKumarSF4524LogeshKumar
committed
1010724: With Review corrections in Staging and Annotation Types Complete.
1 parent ed4918d commit 5b9765b

24 files changed

Lines changed: 422 additions & 496 deletions

‎Document-Processing-toc.html‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -976,8 +976,10 @@
976976
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/rectangle-annotation">Rectangle</a></li>
977977
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/circle-annotation">Circle</a></li>
978978
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/polygon-annotation">Polygon</a></li>
979-
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/stamp-annotation">Stamp</a></li>
980979
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/ink-annotation">Ink</a></li>
980+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/stamp-annotation">Stamp</a></li>
981+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/sticky-notes">Sticky Notes</a></li>
982+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/redaction-annotation">Redaction</a></li>
981983
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/free-text-annotation">Free Text</a></li>
982984
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/distance-annotation">Distance</a></li>
983985
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/perimeter-annotation">Perimeter</a></li>

‎Document-Processing/PDF/PDF-Viewer/react/annotation/annotation-types/area-annotation.md‎

Lines changed: 1 addition & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,6 @@ Area is a measurement annotation used to calculate the surface of a closed regio
1313

1414
![Area overview](../../../javascript-es6/annotations/annotation-images/area-annot.png)
1515

16-
---
17-
1816
## Enable Area Measurement
1917

2018
To enable Area annotations, inject the following modules into the React PDF Viewer:
@@ -47,11 +45,9 @@ ReactDOM.createRoot(document.getElementById('sample')).render(<App />);
4745
{% endhighlight %}
4846
{% endtabs %}
4947

50-
---
51-
5248
## Add Area Annotation
5349

54-
### Draw Area Using the Toolbar
50+
### Add Area Using the Toolbar
5551

5652
1. Open the **Annotation Toolbar**.
5753
2. Select **Measurement** → **Area**.
@@ -87,8 +83,6 @@ function exitAreaMode() {
8783
{% endhighlight %}
8884
{% endtabs %}
8985

90-
---
91-
9286
### Add Area Programmatically
9387
Use the [`addAnnotation`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#addannotation) API to draw an area by providing **vertexPoints** for a closed region.
9488

@@ -112,8 +106,6 @@ function addArea() {
112106
{% endhighlight %}
113107
{% endtabs %}
114108

115-
---
116-
117109
## Customize Area Appearance
118110
Configure default properties using the [`Area Settings`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#areasettings) property (for example, default **fill color**, **stroke color**, **opacity**).
119111

@@ -133,8 +125,6 @@ Configure default properties using the [`Area Settings`](https://ej2.syncfusion.
133125
{% endhighlight %}
134126
{% endtabs %}
135127

136-
---
137-
138128
## Manage Area (Move, Reshape, Edit, Delete)
139129
- **Move**: Drag inside the polygon to reposition it.
140130
- **Reshape**: Drag any vertex handle to adjust points and shape.
@@ -177,15 +167,10 @@ function editAreaProgrammatically() {
177167
{% endhighlight %}
178168
{% endtabs %}
179169

180-
---
181-
182170
### Delete Distance Annotation
183171

184172
Delete Distance Annotation via UI (toolbar/context menu) or programmatically. For supported workflows and APIs, see [**Delete Annotation**](../remove-annotations).
185173

186-
---
187-
188-
189174
## Set Default Properties During Initialization
190175
Apply defaults for Area using the [`areaSettings`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#areasettings) property.
191176

@@ -205,8 +190,6 @@ Apply defaults for Area using the [`areaSettings`](https://ej2.syncfusion.com/re
205190
{% endhighlight %}
206191
{% endtabs %}
207192

208-
---
209-
210193
## Set Properties While Adding Individual Annotation
211194
Pass per‑annotation values directly when calling [`addAnnotation`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#addannotation).
212195

@@ -234,8 +217,6 @@ function addStyledArea() {
234217
{% endhighlight %}
235218
{% endtabs %}
236219

237-
---
238-
239220
## Scale Ratio and Units
240221
- Use **Scale Ratio** from the context menu to set the actual‑to‑page scale.
241222
![Scale ratio](../../images/calibrate_scaleratio.png)
@@ -261,19 +242,13 @@ Configure scale defaults using [`measurementSettings`](https://ej2.syncfusion.co
261242
{% endhighlight %}
262243
{% endtabs %}
263244

264-
---
265-
266245
## Handle Area Events
267246

268247
Listen to annotation life-cycle events (add/modify/select/remove). For the full list and parameters, see [**Annotation Events**](../annotation-event).
269248

270-
---
271-
272249
## Export and Import
273250
Area measurements can be exported or imported with other annotations. For workflows and supported formats, see [**Export and Import annotations**](../export-import-annotations).
274251

275-
---
276-
277252
## See Also
278253
- [Annotation Toolbar](../../toolbar-customization/annotation-toolbar)
279254
- [Customize Context Menu](../../context-menu/custom-context-menu)

‎Document-Processing/PDF/PDF-Viewer/react/annotation/annotation-types/arrow-annotation.md‎

Lines changed: 2 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,6 @@ Arrow annotations let users point, direct attention, or indicate flow on PDFs—
1313

1414
![Arrow overview](../../../javascript-es6/annotations/annotation-images/arrow-annot.png)
1515

16-
---
17-
1816
## Enable Arrow Annotation in the Viewer
1917

2018
To enable Arrow annotations, inject the following modules into the React PDF Viewer:
@@ -47,11 +45,9 @@ ReactDOM.createRoot(document.getElementById('sample')).render(<App />);
4745
{% endhighlight %}
4846
{% endtabs %}
4947

50-
---
51-
52-
## Apply Arrow Annotation
48+
## Add Arrow Annotation
5349

54-
### Apply Arrow Annotation Using the Toolbar
50+
### Add Arrow Annotation Using the Toolbar
5551
1. Open the **Annotation Toolbar**.
5652
2. Select **Shapes** → **Arrow**.
5753
3. Click and drag on the PDF page to draw the arrow.
@@ -60,8 +56,6 @@ ReactDOM.createRoot(document.getElementById('sample')).render(<App />);
6056

6157
N> When in Pan mode, selecting a shape tool automatically switches the viewer to selection mode for smooth interaction.
6258

63-
---
64-
6559
### Enable Arrow Mode
6660
Switch the viewer into highlight mode using `setAnnotationMode('Arrow')`.
6761

@@ -88,8 +82,6 @@ function exitArrowMode() {
8882
{% endhighlight %}
8983
{% endtabs %}
9084

91-
---
92-
9385
### Add Arrow Programmatically
9486
Use the [`addAnnotation`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#addannotation) API to draw an arrow at a specific location (defined by two **vertexPoints**).
9587

@@ -111,8 +103,6 @@ function addArrow() {
111103
{% endhighlight %}
112104
{% endtabs %}
113105

114-
---
115-
116106
## Customize Arrow Appearance
117107
Configure default arrow appearance (fill color, stroke color, thickness, opacity) using the [`arrowSettings`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#arrowsettings) property.
118108

@@ -134,8 +124,6 @@ Configure default arrow appearance (fill color, stroke color, thickness, opacity
134124

135125
N> For **Line** and **Arrow** annotations, **Fill Color** is available only when an arrowhead style is applied at the **Start** or **End**. If both are `None`, lines do not render fill and the Fill option remains disabled.
136126

137-
---
138-
139127
## Manage Arrow (Edit, Move, Resize, Delete)
140128
### Edit Arrow
141129

@@ -181,21 +169,15 @@ function editArrowProgrammatically() {
181169
{% endhighlight %}
182170
{% endtabs %}
183171

184-
---
185-
186172
### Delete Arrow
187173

188174
The PDF Viewer supports deleting existing annotations through the UI and API.
189175
See [**Delete Annotation**](../remove-annotations) for full behavior and workflows.
190176

191-
---
192-
193177
### Comments
194178

195179
Use the [**Comments panel**](../comments) to add, view, and reply to threaded discussions linked to arrow annotations. It provides a dedicated interface for collaboration and review within the PDF Viewer.
196180

197-
---
198-
199181
## Set properties while adding Individual Annotation
200182

201183
Set properties for individual arrow annotations by passing values directly during [`addAnnotation`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#addannotation).
@@ -240,8 +222,6 @@ function addMultipleArrows() {
240222
{% endhighlight %}
241223
{% endtabs %}
242224

243-
---
244-
245225
## Disable Arrow Annotation
246226

247227
Disable shape annotations (Line, Arrow, Rectangle, Circle, Polygon) using the [`enableShapeAnnotation`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#enableshapeannotation) property.
@@ -262,20 +242,14 @@ Disable shape annotations (Line, Arrow, Rectangle, Circle, Polygon) using the [`
262242
{% endhighlight %}
263243
{% endtabs %}
264244

265-
---
266-
267245
## Handle Arrow Events
268246

269247
The PDF viewer provides annotation life-cycle events that notify when Arrow annotations are added, modified, selected, or removed.
270248
For the full list of available events and their descriptions, see [**Annotation Events**](../annotation-event)
271249

272-
---
273-
274250
## Export and Import
275251
The PDF Viewer supports exporting and importing annotations. For details on supported formats and workflows, see [**Export and Import annotations**](../export-import-annotations).
276252

277-
---
278-
279253
## See Also
280254
- [Annotation Toolbar](../../toolbar-customization/annotation-toolbar)
281255
- [Customize Context Menu](../../context-menu/custom-context-menu)

‎Document-Processing/PDF/PDF-Viewer/react/annotation/annotation-types/circle-annotation.md‎

Lines changed: 1 addition & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,6 @@ Circle annotations let users highlight circular regions or draw emphasis bubbles
1313

1414
![Circle overview](../../../javascript-es6/annotations/annotation-images/circle-annot.png)
1515

16-
---
17-
1816
## Enable Circle Annotation in the Viewer
1917

2018
To enable Line annotations, inject the following modules into the React PDF Viewer:
@@ -47,9 +45,7 @@ ReactDOM.createRoot(document.getElementById('sample')).render(<App />);
4745
{% endhighlight %}
4846
{% endtabs %}
4947

50-
---
51-
52-
## Apply Circle Annotation
48+
## Add Circle Annotation
5349

5450
### Apply Circle Annotation Using the Toolbar
5551
1. Open the **Annotation Toolbar**.
@@ -60,8 +56,6 @@ ReactDOM.createRoot(document.getElementById('sample')).render(<App />);
6056

6157
N> When in Pan mode, selecting a shape tool automatically switches the viewer to selection mode for smooth interaction.
6258

63-
---
64-
6559
### Enable Circle Mode
6660

6761
Switch the viewer into highlight mode using `setAnnotationMode('Circle')`.
@@ -92,8 +86,6 @@ function exitCircleMode() {
9286
{% endhighlight %}
9387
{% endtabs %}
9488

95-
---
96-
9789
### Add Circle Programmatically
9890
Use the [`addAnnotation`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#addannotation) API to draw a circle (ellipse) at a specific location.
9991

@@ -113,8 +105,6 @@ function addCircle() {
113105
{% endhighlight %}
114106
{% endtabs %}
115107

116-
---
117-
118108
## Customize Circle Appearance
119109
Configure default circle appearance (fill color, stroke color, thickness, opacity) using the [`circleSettings`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#circlesettings) property.
120110

@@ -134,8 +124,6 @@ Configure default circle appearance (fill color, stroke color, thickness, opacit
134124
{% endhighlight %}
135125
{% endtabs %}
136126

137-
---
138-
139127
## Manage Circle (Edit, Move, Resize, Delete)
140128

141129
### Edit Circle
@@ -184,19 +172,13 @@ function editCircleProgrammatically() {
184172
{% endhighlight %}
185173
{% endtabs %}
186174

187-
---
188-
189175
### Delete Circle
190176
The PDF Viewer supports deleting existing annotations through the UI and API.
191177
See [**Delete Annotation**](../remove-annotations) for full behavior and workflows.
192178

193-
---
194-
195179
### Comments
196180
Use the [**Comments panel**](../comments) to add, view, and reply to threaded discussions linked to circle annotations. It provides a dedicated interface for collaboration and review within the PDF Viewer.
197181

198-
---
199-
200182
## Set properties while adding Individual Annotation
201183
Set properties for individual circle annotations by passing values directly during [`addAnnotation`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#addannotation).
202184

@@ -234,8 +216,6 @@ function addMultipleCircles() {
234216
{% endhighlight %}
235217
{% endtabs %}
236218

237-
---
238-
239219
## Disable Circle Annotation
240220
Disable shape annotations (Line, Arrow, Rectangle, Circle, Polygon) using the [`enableShapeAnnotation`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#enableshapeannotation) property.
241221

@@ -255,21 +235,15 @@ Disable shape annotations (Line, Arrow, Rectangle, Circle, Polygon) using the [`
255235
{% endhighlight %}
256236
{% endtabs %}
257237

258-
---
259-
260238
## Handle Circle Events
261239

262240
The PDF viewer provides annotation life-cycle events that notify when Circle annotations are added, modified, selected, or removed.
263241
For the full list of available events and their descriptions, see [**Annotation Events**](../annotation-event)
264242

265-
---
266-
267243
## Export and Import
268244

269245
The PDF Viewer supports exporting and importing annotations. For details on supported formats and workflows, see [**Export and Import annotations**](../export-import-annotations).
270246

271-
---
272-
273247
## See Also
274248
- [Annotation Toolbar](../../toolbar-customization/annotation-toolbar)
275249
- [Customize Context Menu](../../context-menu/custom-context-menu)

0 commit comments

Comments
 (0)