Skip to content

Commit 54cf3de

Browse files
Merge pull request #2335 from Syncfusion-Content/hotfix/hotfix-v32.2.3
DOCINFRA-2341_merged_using_automation
2 parents caf0b8e + b8e8666 commit 54cf3de

32 files changed

Lines changed: 2856 additions & 736 deletions

Document-Processing-toc.html

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -884,7 +884,7 @@
884884
</li>
885885
</ul>
886886
</li>
887-
<li>
887+
<li>
888888
<a href="/document-processing/pdf/pdf-viewer/react/overview">React</a>
889889
<ul>
890890
<li>
@@ -975,6 +975,16 @@
975975
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/rectangle-annotation">Rectangle</a></li>
976976
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/circle-annotation">Circle</a></li>
977977
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/polygon-annotation">Polygon</a></li>
978+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/ink-annotation">Ink</a></li>
979+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/stamp-annotation">Stamp</a></li>
980+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/sticky-notes">Sticky Notes</a></li>
981+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/redaction-annotation">Redaction</a></li>
982+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/free-text-annotation">Free Text</a></li>
983+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/distance-annotation">Distance</a></li>
984+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/perimeter-annotation">Perimeter</a></li>
985+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/area-annotation">Area</a></li>
986+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/radius-annotation">Radius</a></li>
987+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/volume-annotation">Volume</a></li>
978988
</ul>
979989
</li>
980990
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/text-markup-annotation">Text Markup Annotation</a></li>
@@ -6479,6 +6489,9 @@
64796489
<li>
64806490
<a href="/document-processing/excel/excel-library/net/faqs/why-formulas-referencing-the-deleted-column-show-ref-errors">Why do formulas referencing a deleted column show #REF! errors?</a>
64816491
</li>
6492+
<li>
6493+
<a href="/document-processing/excel/excel-library/net/faqs/how-to-read-all-values-of-a-column">How to read all values from a specific column in an Excel worksheet using XlsIO?</a>
6494+
</li>
64826495
</ul>
64836496
</li>
64846497
</ul>
Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
---
2+
title: How to read all values of a column | Syncfusion
3+
description: This page explains how to read all values of a column in an Excel worksheet using Syncfusion .NET Excel library (XlsIO).
4+
platform: document-processing
5+
control: XlsIO
6+
documentation: UG
7+
---
8+
9+
# How to read all values from a column in an Excel worksheet?
10+
11+
The following code example illustrates how to read all values from a specific column in an Excel worksheet using XlsIO in C# (cross-platform and Windows-specific) and VB.NET.
12+
13+
{% tabs %}
14+
{% highlight c# tabtitle="C# [Cross-platform]" %}
15+
using (ExcelEngine excelEngine = new ExcelEngine())
16+
{
17+
IApplication application = excelEngine.Excel;
18+
application.DefaultVersion = ExcelVersion.Xlsx;
19+
IWorkbook workbook = application.Workbooks.Open(Path.GetFullPath(@"Data/InputTemplate.xlsx"));
20+
IWorksheet worksheet = workbook.Worksheets[0];
21+
22+
// Select the column
23+
string columnName = "E";
24+
foreach (IRange row in sheet.Rows)
25+
{
26+
// Read all the value of a column
27+
var val = sheet[columnName + row.Row].Value;
28+
}
29+
}
30+
{% endhighlight %}
31+
32+
{% highlight c# tabtitle="C# [Windows-specific]" %}
33+
using (ExcelEngine excelEngine = new ExcelEngine())
34+
{
35+
IApplication application = excelEngine.Excel;
36+
application.DefaultVersion = ExcelVersion.Xlsx;
37+
IWorkbook workbook = application.Workbooks.Open(Path.GetFullPath(@"Data/InputTemplate.xlsx"));
38+
IWorksheet worksheet = workbook.Worksheets[0];
39+
40+
// Select the column
41+
string columnName = "E";
42+
foreach (IRange row in sheet.Rows)
43+
{
44+
// Read all the value of a column
45+
var val = sheet[columnName + row.Row].Value;
46+
}
47+
}
48+
{% endhighlight %}
49+
50+
{% highlight vb.net tabtitle="VB.NET [Windows-specific]" %}
51+
Using excelEngine As ExcelEngine = New ExcelEngine()
52+
Dim application As IApplication = excelEngine.Excel
53+
application.DefaultVersion = ExcelVersion.Xlsx
54+
Dim workbook As IWorkbook = application.Workbooks.Open("InputTemplate.xlsx")
55+
Dim worksheet As IWorksheet = workbook.Worksheets(0)
56+
57+
' Select the column
58+
Dim columnName As String = "E"
59+
For Each row As IRange In worksheet.Rows
60+
Dim cellAddress As String = columnName & row.Row.ToString()
61+
' Read all the value of a column
62+
Dim val = worksheet(cellAddress).Value
63+
Next
64+
End Using
65+
{% endhighlight %}
66+
{% endtabs %}
Lines changed: 258 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,258 @@
1+
---
2+
layout: post
3+
title: Add Area Measurement Annotations in React PDF Viewer | Syncfusion
4+
description: Learn how to enable, draw, customize, and manage Area measurement annotations in the Syncfusion React PDF Viewer.
5+
platform: document-processing
6+
control: PDF Viewer
7+
documentation: ug
8+
domainurl: ##DomainURL##
9+
---
10+
11+
# Add Area Measurement Annotations in React PDF Viewer
12+
Area is a measurement annotation used to calculate the surface of a closed region on a PDF page—ideal for engineering, construction, or design reviews.
13+
14+
![Area overview](../../../javascript-es6/annotations/annotation-images/area-annot.png)
15+
16+
## Enable Area Measurement
17+
18+
To enable Area annotations, inject the following modules into the React PDF Viewer:
19+
20+
- [**Annotation**](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#annotation)
21+
- [**Toolbar**](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#toolbar)
22+
23+
{% tabs %}
24+
{% highlight js tabtitle="Standalone" %}
25+
{% raw %}
26+
import * as React from 'react';
27+
import * as ReactDOM from 'react-dom/client';
28+
import { PdfViewerComponent, Inject, Toolbar, Annotation } from '@syncfusion/ej2-react-pdfviewer';
29+
30+
function App() {
31+
return (
32+
<PdfViewerComponent
33+
id="container"
34+
documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf"
35+
resourceUrl="https://cdn.syncfusion.com/ej2/31.2.2/dist/ej2-pdfviewer-lib"
36+
style={{ height: '650px' }}
37+
>
38+
<Inject services={[Toolbar, Annotation]} />
39+
</PdfViewerComponent>
40+
);
41+
}
42+
43+
ReactDOM.createRoot(document.getElementById('sample')).render(<App />);
44+
{% endraw %}
45+
{% endhighlight %}
46+
{% endtabs %}
47+
48+
## Add Area Annotation
49+
50+
### Add Area Using the Toolbar
51+
52+
1. Open the **Annotation Toolbar**.
53+
2. Select **Measurement****Area**.
54+
3. Click points to define the polygon; double‑click to close and finalize the area.
55+
56+
![Measurement toolbar](../../images/calibrate_tool.png)
57+
58+
> **Tip:** If Pan mode is active, choosing a measurement tool switches the viewer into the appropriate interaction mode for a smoother workflow.
59+
60+
### Enable Area Mode
61+
Programmatically switch the viewer into Area mode.
62+
63+
{% tabs %}
64+
{% highlight js tabtitle="Standalone" %}
65+
{% raw %}
66+
function enableAreaMode() {
67+
const viewer = document.getElementById('container').ej2_instances[0];
68+
viewer.annotation.setAnnotationMode('Area');
69+
}
70+
{% endraw %}
71+
{% endhighlight %}
72+
{% endtabs %}
73+
74+
#### Exit Area Mode
75+
{% tabs %}
76+
{% highlight js tabtitle="Standalone" %}
77+
{% raw %}
78+
function exitAreaMode() {
79+
const viewer = document.getElementById('container').ej2_instances[0];
80+
viewer.annotation.setAnnotationMode('None');
81+
}
82+
{% endraw %}
83+
{% endhighlight %}
84+
{% endtabs %}
85+
86+
### Add Area Programmatically
87+
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.
88+
89+
{% tabs %}
90+
{% highlight js tabtitle="Standalone" %}
91+
{% raw %}
92+
function addArea() {
93+
const viewer = document.getElementById('container').ej2_instances[0];
94+
viewer.annotation.addAnnotation('Area', {
95+
offset: { x: 200, y: 500 },
96+
pageNumber: 1,
97+
vertexPoints: [
98+
{ x: 200, y: 500 },
99+
{ x: 288, y: 499 },
100+
{ x: 289, y: 553 },
101+
{ x: 200, y: 500 }
102+
]
103+
});
104+
}
105+
{% endraw %}
106+
{% endhighlight %}
107+
{% endtabs %}
108+
109+
## Customize Area Appearance
110+
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**).
111+
112+
{% tabs %}
113+
{% highlight js tabtitle="Standalone" %}
114+
{% raw %}
115+
<PdfViewerComponent
116+
id="container"
117+
documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf"
118+
resourceUrl="https://cdn.syncfusion.com/ej2/31.2.2/dist/ej2-pdfviewer-lib"
119+
areaSettings={{ fillColor: 'yellow', strokeColor: 'orange', opacity: 0.6 }}
120+
style={{ height: '650px' }}
121+
>
122+
<Inject services={[Toolbar, Annotation]} />
123+
</PdfViewerComponent>
124+
{% endraw %}
125+
{% endhighlight %}
126+
{% endtabs %}
127+
128+
## Manage Area (Move, Reshape, Edit, Delete)
129+
- **Move**: Drag inside the polygon to reposition it.
130+
- **Reshape**: Drag any vertex handle to adjust points and shape.
131+
132+
### Edit Perimeter
133+
134+
#### Edit Perimeter (UI)
135+
136+
- Edit the **fill color** using the Edit Color tool.
137+
![Fill color](../../images/calibrate_fillcolor.png)
138+
- Edit the **stroke color** using the Edit Stroke Color tool.
139+
![Stroke color](../../images/calibrate_stroke.png)
140+
- Edit the **border thickness** using the Edit Thickness tool.
141+
![Thickness](../../images/calibrate_thickness.png)
142+
- Edit the **opacity** using the Edit Opacity tool.
143+
![Opacity](../../images/calibrate_opacity.png)
144+
- Open **Right Click → Properties** for additional line‑based options.
145+
![Line properties](../../images/calibrate_lineprop.png)
146+
147+
#### Edit Area Programmatically
148+
149+
Update properties and call `editAnnotation()`.
150+
151+
{% tabs %}
152+
{% highlight js tabtitle="Standalone" %}
153+
{% raw %}
154+
function editAreaProgrammatically() {
155+
const viewer = document.getElementById('container').ej2_instances[0];
156+
for (const ann of viewer.annotationCollection) {
157+
if (ann.subject === 'Area calculation') {
158+
ann.strokeColor = '#0000FF';
159+
ann.thickness = 2;
160+
ann.fillColor = '#FFFF00';
161+
viewer.annotation.editAnnotation(ann);
162+
break;
163+
}
164+
}
165+
}
166+
{% endraw %}
167+
{% endhighlight %}
168+
{% endtabs %}
169+
170+
### Delete Distance Annotation
171+
172+
Delete Distance Annotation via UI (toolbar/context menu) or programmatically. For supported workflows and APIs, see [**Delete Annotation**](../remove-annotations).
173+
174+
## Set Default Properties During Initialization
175+
Apply defaults for Area using the [`areaSettings`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#areasettings) property.
176+
177+
{% tabs %}
178+
{% highlight js tabtitle="Standalone" %}
179+
{% raw %}
180+
<PdfViewerComponent
181+
id="container"
182+
documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf"
183+
resourceUrl="https://cdn.syncfusion.com/ej2/31.2.2/dist/ej2-pdfviewer-lib"
184+
areaSettings={{ fillColor: 'yellow', strokeColor: 'orange', opacity: 0.6 }}
185+
style={{ height: '650px' }}
186+
>
187+
<Inject services={[Toolbar, Annotation]} />
188+
</PdfViewerComponent>
189+
{% endraw %}
190+
{% endhighlight %}
191+
{% endtabs %}
192+
193+
## Set Properties While Adding Individual Annotation
194+
Pass per‑annotation values directly when calling [`addAnnotation`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#addannotation).
195+
196+
{% tabs %}
197+
{% highlight js tabtitle="Standalone" %}
198+
{% raw %}
199+
function addStyledArea() {
200+
const viewer = document.getElementById('container').ej2_instances[0];
201+
viewer.annotation.addAnnotation('Area', {
202+
offset: { x: 210, y: 510 },
203+
pageNumber: 1,
204+
vertexPoints: [
205+
{ x: 210, y: 510 },
206+
{ x: 300, y: 510 },
207+
{ x: 305, y: 560 },
208+
{ x: 210, y: 510 }
209+
],
210+
strokeColor: '#EA580C',
211+
fillColor: '#FEF3C7',
212+
thickness: 2,
213+
opacity: 0.85
214+
});
215+
}
216+
{% endraw %}
217+
{% endhighlight %}
218+
{% endtabs %}
219+
220+
## Scale Ratio and Units
221+
- Use **Scale Ratio** from the context menu to set the actual‑to‑page scale.
222+
![Scale ratio](../../images/calibrate_scaleratio.png)
223+
- Supported units include **Inch, Millimeter, Centimeter, Point, Pica, Feet**.
224+
![Scale dialog](../../images/calibrate_scaledialog.png)
225+
226+
### Set Default Scale Ratio During Initialization
227+
Configure scale defaults using [`measurementSettings`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/index-default#mesaurementsettings).
228+
229+
{% tabs %}
230+
{% highlight js tabtitle="Standalone" %}
231+
{% raw %}
232+
<PdfViewerComponent
233+
id="container"
234+
documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf"
235+
resourceUrl="https://cdn.syncfusion.com/ej2/31.2.2/dist/ej2-pdfviewer-lib"
236+
measurementSettings={{ scaleRatio: 2, conversionUnit: 'cm', displayUnit: 'cm' }}
237+
style={{ height: '650px' }}
238+
>
239+
<Inject services={[Toolbar, Annotation]} />
240+
</PdfViewerComponent>
241+
{% endraw %}
242+
{% endhighlight %}
243+
{% endtabs %}
244+
245+
## Handle Area Events
246+
247+
Listen to annotation life-cycle events (add/modify/select/remove). For the full list and parameters, see [**Annotation Events**](../annotation-event).
248+
249+
## Export and Import
250+
Area measurements can be exported or imported with other annotations. For workflows and supported formats, see [**Export and Import annotations**](../export-import-annotations).
251+
252+
## See Also
253+
- [Annotation Toolbar](../../toolbar-customization/annotation-toolbar)
254+
- [Customize Context Menu](../../context-menu/custom-context-menu)
255+
- [Comments Panel](../comments)
256+
- [Annotation Events](../annotation-event)
257+
- [Export and Import annotations](../export-import-annotations)
258+
- [Delete Annotations](../remove-annotations)

0 commit comments

Comments
 (0)