Skip to content

Commit 45e9e17

Browse files
SF4524LogeshKumarSivaSelvan-SF
SF4524LogeshKumar
authored and
SivaSelvan-SF
committed
986770: restructure angular
1 parent 3ecc5f6 commit 45e9e17

17 files changed

+2825
-3
lines changed

‎Document-Processing-toc.html‎

Lines changed: 36 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -378,11 +378,27 @@
378378
</ul>
379379
</li>
380380
<li><a href="/document-processing/pdf/pdf-viewer/angular/toolbar">Toolbar</a></li>
381-
<li><a href="/document-processing/pdf/pdf-viewer/angular/mobile-toolbar">Mobile Toolbar Interface</a></li>
382381
<li><a href="/document-processing/pdf/pdf-viewer/angular/navigation">Navigation</a></li>
382+
<li>Toolbar Customization
383+
<ul>
384+
<li><a href="/document-processing/pdf/pdf-viewer/angular/toolbar-customization/primary-toolbar-customization">Primary Toolbar</a></li>
385+
<li><a href="/document-processing/pdf/pdf-viewer/angular/toolbar-customization/annotation-toolbar-customization">Annotation Toolbar</a></li>
386+
<li><a href="/document-processing/pdf/pdf-viewer/angular/toolbar-customization/form-designer-toolbar-customization">Form Designer Toolbar</a></li>
387+
<li><a href="/document-processing/pdf/pdf-viewer/angular/organize-pdf/toolbar-organize-page">Organize Page Toolbar</a></li>
388+
<li><a href="/document-processing/pdf/pdf-viewer/angular/toolbar-customization/mobile-toolbar">Mobile Toolbar</a></li>
389+
<li><a href="/document-processing/pdf/pdf-viewer/angular/toolbar-customization/custom-toolbar">Custom Toolbar</a></li>
390+
</ul>
391+
</li>
392+
<li><a href="/document-processing/pdf/pdf-viewer/angular/navigation">Interactive PDF Navigation</a>
393+
<ul>
394+
<li><a href="/document-processing/pdf/pdf-viewer/angular/interactive-pdf-navigation/page-navigation">Pages</a></li>
395+
<li><a href="/document-processing/pdf/pdf-viewer/angular/interactive-pdf-navigation/bookmark-navigation">Bookmark</a></li>
396+
<li><a href="/document-processing/pdf/pdf-viewer/angular/interactive-pdf-navigation/page-thumbnail-navigation">Page Thumbnail</a></li>
397+
<li><a href="/document-processing/pdf/pdf-viewer/angular/interactive-pdf-navigation/hyperlink-navigation">Hyperlink Navigation</a></li>
398+
</ul>
399+
</li>
383400
<li><a href="/document-processing/pdf/pdf-viewer/angular/magnification">Magnification</a></li>
384401
<li><a href="/document-processing/pdf/pdf-viewer/angular/text-search">Text Search</a></li>
385-
386402
<li>Annotation
387403
<ul>
388404
<li><a href="/document-processing/pdf/pdf-viewer/angular/annotation/text-markup-annotation">Text Markup Annotation</a></li>
@@ -396,22 +412,39 @@
396412
<li><a href="/document-processing/pdf/pdf-viewer/angular/annotation/import-export-annotation">Import and Export Annotations</a></li>
397413
<li><a href="/document-processing/pdf/pdf-viewer/angular/annotation/comments">Comments</a></li>
398414
<li><a href="/document-processing/pdf/pdf-viewer/angular/annotation/signature-annotation">Handwritten Signature</a></li>
415+
<li><a href="/document-processing/pdf/pdf-viewer/angular/annotations/annotation-event">Annotations Events</a></li>
416+
<li><a href="/document-processing/pdf/pdf-viewer/angular/annotations/annotations-in-mobile-view">Annotations in Mobile view</a></li>
399417
</ul>
400418
</li>
401419
<li><a href="/document-processing/pdf/pdf-viewer/angular/interaction-mode">Interaction Mode</a></li>
402420
<li>Form Designer
403421
<ul>
404422
<li><a href="/document-processing/pdf/pdf-viewer/angular/form-designer/create-programmatically">Create Programmatically</a></li>
405423
<li><a href="/document-processing/pdf/pdf-viewer/angular/form-designer/create-with-user-interface-interaction">Create with UI Interaction</a></li>
424+
<li><a href="/document-processing/pdf/pdf-viewer/angular/toolbar-customization/form-designer-toolbar-customization">Form Designer Toolbar</a></li>
406425
<li><a href="/document-processing/pdf/pdf-viewer/angular/form-designer/form-field-events">Form Field Events</a></li>
426+
<li><a href="/document-processing/pdf/pdf-viewer/angular/how-to/custom-fonts-ts">Custom fonts</a></li>
427+
</ul>
428+
</li>
429+
<li><a href="/document-processing/pdf/pdf-viewer/angular/form-filling">Form Filling</a></li>
430+
<li>Organize Pages
431+
<ul>
432+
<li><a href="/document-processing/pdf/pdf-viewer/angular/organize-pdf-overview">Overview</a></li>
433+
<li><a href="/document-processing/pdf/pdf-viewer/angular/organize-pdf/programmatic-support-for-organize-page">Programmatic Support</a></li>
434+
<li><a href="/document-processing/pdf/pdf-viewer/angular/organize-pdf/ui-interactions-organize-page">UI Interactions</a></li>
435+
<li><a href="/document-processing/pdf/pdf-viewer/angular/organize-pdf/toolbar-organize-page">Toolbar</a></li>
436+
<li><a href="/document-processing/pdf/pdf-viewer/angular/organize-pdf/organize-page-mobile-view">Mobile View</a></li>
437+
<li><a href="/document-processing/pdf/pdf-viewer/angular/organize-pdf/organize-pdf-events">Events</a></li>
407438
</ul>
408439
</li>
409440
<li><a href="/document-processing/pdf/pdf-viewer/angular/organize-pdf">Organize Pages</a></li>
410441
<li><a href="/document-processing/pdf/pdf-viewer/angular/print">Print</a></li>
411442
<li><a href="/document-processing/pdf/pdf-viewer/angular/download">Download</a></li>
443+
<li><a href="/document-processing/pdf/pdf-viewer/angular/event">Event</a></li>
444+
<li><a href="/document-processing/pdf/pdf-viewer/angular/textselection">Text Selection</a></li>
412445
<li><a href="/document-processing/pdf/pdf-viewer/angular/globalization">Globalization</a></li>
413446
<li><a href="/document-processing/pdf/pdf-viewer/angular/accessibility">Accessibility</a></li>
414-
<li>How To
447+
<li><a href="/document-processing/pdf/pdf-viewer/angular/how-to-overview">How To</a>
415448
<ul>
416449
<li><a href="/document-processing/pdf/pdf-viewer/angular/how-to/unload-document">Unload the PDF document Programmatically</a></li>
417450
<li><a href="/document-processing/pdf/pdf-viewer/angular/how-to/load-document">Load PDF documents dynamically</a></li>

‎Document-Processing/PDF/PDF-Viewer/angular/annotation/annotations-in-mobile-view.md‎

Lines changed: 122 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,122 @@
1+
---
2+
layout: post
3+
title: Annotations mobileView in TypeScript PDF Viewer control | Syncfusion
4+
description: Learn how to use annotations in mobile view with the Syncfusion TypeScript PDF Viewer (Essential JS 2).
5+
platform: document-processing
6+
control: PDF Viewer
7+
documentation: ug
8+
domainurl: ##DomainURL##
9+
---
10+
# Annotations in mobile view in TypeScript PDF Viewer control
11+
12+
## Open the annotation toolbar
13+
14+
**Step 1:** Click Edit Annotation on the toolbar to enable the annotation toolbar.
15+
16+
![Enable the annotation toolbar](./images/edit-annotation.png)
17+
18+
**Step 2:** The annotation toolbar appears below the main toolbar.
19+
20+
![Annotation toolbar displayed](../images/after-enabling-annotation-toolbar.png)
21+
22+
## Add sticky note annotations
23+
24+
**Step 1:** Click the Sticky Notes icon, then tap the page where the note should be placed.
25+
26+
![Open sticky note tool](../images/add-sticky-notes.png)
27+
28+
**Step 2:** Tap the page to add the sticky note annotation.
29+
30+
![Sticky note annotation added on the page](../images/sticky-notes-in-page.png)
31+
32+
## Add text markup annotations
33+
34+
**Step 1:** Tap a text markup icon, select the text to mark, then tap the selection to apply the markup.
35+
36+
![Select text for markup](../images/select-text.png)
37+
38+
**Step 2:** The text markup annotation is applied to the selected text.
39+
40+
![Text markup applied on the page](../images/add-text-markup.png)
41+
42+
## Add shape and measurement annotations
43+
44+
**Step 1:** Tap the Shape or Measure icon to open the corresponding toolbar.
45+
46+
![Open shape and measurement tools](../images/add-shapes.png)
47+
48+
**Step 2:** Choose a shape or measurement type, then draw it on the page.
49+
50+
![Select measurement type](../images/open-radius.png)
51+
52+
**Step 3:** The annotation appears on the PDF page.
53+
54+
![Measurement annotation placed on the page](../images/radius-annotation.png)
55+
56+
## Add stamp annotations
57+
58+
**Step 1:** Tap the Stamp icon and select a stamp type from the menu.
59+
60+
![Open stamp tool](../images/open-stamp.png)
61+
62+
**Step 2:** Tap the page to place the stamp annotation.
63+
64+
![Stamp annotation added on the page](../images/add-revised.png)
65+
66+
## Add signature annotations
67+
68+
**Step 1:** Tap the Signature icon to open the canvas. Draw the signature, tap Create, then tap the viewer to place it.
69+
70+
![Open signature canvas](../images/add-signature.png)
71+
72+
**Step 2:** The signature is added to the page.
73+
74+
![Signature placed on the page](../images/adding-signature.png)
75+
76+
## Add ink annotations
77+
78+
**Step 1:** Tap the Ink tool and draw on the page.
79+
80+
![Open ink tool](../images/open-ink.png)
81+
82+
**Step 2:** The ink annotation appears on the page.
83+
84+
![Ink annotation drawn on the page](../how-to/images/ink-annotation.png)
85+
86+
## Change annotation properties (before adding)
87+
88+
**Step 1:** Change properties before placing the annotation.
89+
90+
**Step 2:** Tap the annotation icon to open the property toolbar, adjust properties, then place the annotation on the page.
91+
92+
![Adjust fill color before adding](../images/open-fillcolor.png)
93+
94+
## Change annotation properties (after adding)
95+
96+
**Step 1:** Change annotation properties after adding the annotation.
97+
98+
**Step 2:** Select the annotation to show the property toolbar, then adjust the properties.
99+
100+
![Edit annotation properties after adding](../images/change-property.png)
101+
102+
## Delete annotations
103+
104+
**Step 1:** Select the annotation to show the property toolbar, then tap the Delete icon to remove it.
105+
106+
![Delete icon in the property toolbar](../images/delete-icon.png)
107+
108+
## Open the comment panel
109+
110+
**Step 1:** Open the comment panel using the icon in the property toolbar or the annotation toolbar.
111+
112+
![Open the comment panel](../images/open-comment.png)
113+
114+
**Step 2:** The comment panel appears.
115+
116+
![Comment panel displayed](../images/comment-panel.png)
117+
118+
## Close the comment panel
119+
120+
**Step 1:** Tap the Close button to close the comment panel.
121+
122+
![Close the comment panel](../images/close-comment-panel.png)

‎Document-Processing/PDF/PDF-Viewer/angular/how-to-overview.md‎

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
---
2+
layout: post
3+
title: FAQ Section in PDF Viewer control | Syncfusion
4+
description: In this section, you can know about the various questions asked about manipulation of in PDF Viewer control.
5+
platform: document-processing
6+
control: PDF Viewer
7+
documentation: ug
8+
domainurl: ##DomainURL##
9+
---
10+
11+
# Frequently Asked Questions Section in PDF Viewer control
12+
13+
The frequently asked questions in Essential<sup>&reg;</sup> PDF Viewer are listed below.
14+
15+
* [Unload the PDF document Programmatically](./how-to/unload-document)
16+
* [Load PDF documents dynamically](./how-to/load-document)
17+
* [Include Authorization Token](./how-to/include-authorization-token)
18+
* [Get the Base64 string of the loaded PDF document](./how-to/get-base-string-of-the-loaded-document)
19+
* [Customize the selection border](./how-to/change-selection-border)
20+
* [Extract Text using extractTextCompleted Event](./how-to/extract-text-completed)
21+
* [Import and Export annotation](./how-to/import-export-annotation)
22+
* [Delete a specific annotation](./how-to/delete-annotation)
23+
* [Open Thumbnail pane programmatically](./how-to/open-thumbnail)
24+
* [How to enable and disable the delete button based on annotation selection and unselection events](./how-to/enable-disable-annotation)
25+
* [Add the custom stamp based on the free text bounds](./how-to/custom-stamp)
26+
* [Install packages required for versions below 12](./how-to/install-packages-required-for-lower-versions)
27+
* [Load Office files in PDF Viewer](./how-to/load-office-files)
28+
* [How to Change the Font Family in the Type Signature](./how-to/font-family)
29+
* [Resolve unable to find an entry point named FPDFText_GetCharAngle error](./how-to/resolve-unable-to-find-an-entry-point-error)
30+
* [How to clear the Web-service is not listening error](./how-to/webservice-not-listening)
31+
* [Load N number of pages on initial loading](./how-to/load-n-number-page)
32+
* [Retry Timeout](./how-to/retry-timeout)
33+
* [Configure Redis Cache](./how-to/redis-cache)
34+
* [Supported conformance documents](./how-to/conformance)
35+
* [Customize context menu](./how-to/custom-context-menu)
36+
* [PageRenderInitiate and PageRenderComplete event](./how-to/pagerenderstarted-pagerendercompleted)
37+
* [Open and Close Bookmark pane programmatically](./how-to/open-bookmark)
38+
* [Locking Form Fields in a PDF document](./how-to/lock-formfield-in-a-document)
39+
* [SignatureSelect and SignatureUnselect event](./how-to/signatureselect-signatureunselect)
40+
* [Controlling File Downloads](./how-to/download-start-event)
41+
* [Minimum and Maximum Zoom Properties](./how-to/min-max-zoom)
42+
* [Restrict Zoom Percentage on Mobile Devices](./how-to/restricting-zoom-in-mobile-mode)
43+
* [Custom fonts for Signature and Initial fields](./how-to/custom-font-signature-field)
44+
* [Export As Image in Angular PDF Viewer component](./how-to/export-as-image)
45+
* [Add custom fonts to the PDF Viewer using the PDF document](./how-to/custom-fonts)
46+
* [Create a Standalone PDF Viewer in Angular 17 and above with --no-standalone flag](./how-to/create-a-standalone-pdf-viewer-in-angular-17-and-above-with-no-standalone-flag)
47+
* [Create a Standalone PDF Viewer in Angular 17 and above without --no-standalone flag](./how-to/create-a-standalone-pdf-viewer-in-angular-17-and-above-without-no-standalone-flag)
48+
* [Configure Annotation Selector Setting](./how-to/configure-annotation-selector-setting)
49+
* [Convert Pdf Library Bounds to Pdf viewer bounds](./how-to/convert-pdf-library-bounds-to-pdf-viewer-bounds)
50+
* [Display Custom Stamp items in Custom Stamp](./how-to/show-custom-stamp-item)
51+
* [Get Page Info in Angular PDF Viewer component](./how-to/getPageInfo)
52+
* [Retrieve base64-encoded value of a loaded PDF document](./how-to/get-base64)
53+
* [Enable Local Storage](./how-to/enable-local-storage)
54+
* [Add Rectangle Annotation using Search Text Bounds](./how-to/add-annotation-in-text-search)
55+
* [Control Annotation Visibility](./how-to/control-annotation-visibility)
56+
* [Extract Text Option](./how-to/extract-text-option)
57+
* [Find Text using findTextAsync Method](./how-to/find-text-async)
58+
* [Extract Text](./how-to/extract-text)
59+
* [Dynamically Enable or Disable Text Selection](./how-to/enable-text-selection)
60+
* [Show and Hide Annotations](./how-to/show-hide-annotation)

‎Document-Processing/PDF/PDF-Viewer/angular/interactive-pdf-navigation/bookmark-navigation.md‎

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
---
2+
layout: post
3+
title: Bookmark Navigation in Angular PDF Viewer | Syncfusion
4+
description: Learn how to use bookmarks for quick navigation in the Syncfusion Angular PDF Viewer control, enhancing user experience and accessibility.
5+
platform: document-processing
6+
control: PDF Viewer
7+
documentation: ug
8+
domainurl: ##DomainURL##
9+
---
10+
11+
# Bookmark navigation in Angular PDF Viewer control
12+
13+
The Bookmarks saved in PDF files are loaded and made ready for easy navigation.
14+
You can enable/disable bookmark navigation by using the following code snippet.,
15+
16+
{% tabs %}
17+
{% highlight ts tabtitle="Standalone" %}
18+
19+
20+
import { PdfViewer, Toolbar, Magnification, Navigation, LinkAnnotation, Annotation, ThumbnailView,BookmarkView, TextSelection} from '@syncfusion/ej2-pdfviewer';
21+
22+
PdfViewer.Inject(Toolbar,Magnification,Navigation, Annotation, LinkAnnotation,ThumbnailView,BookmarkView, TextSelection);
23+
24+
let pdfviewer: PdfViewer = new PdfViewer({enableBookmark: true, documentPath:'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'});
25+
pdfviewer.appendTo('#PdfViewer');
26+
27+
{% endhighlight %}
28+
{% highlight ts tabtitle="Server-Backed" %}
29+
30+
import { PdfViewer, Toolbar, Magnification, Navigation, LinkAnnotation, Annotation, ThumbnailView,BookmarkView, TextSelection} from '@syncfusion/ej2-pdfviewer';
31+
32+
PdfViewer.Inject(Toolbar,Magnification,Navigation, Annotation, LinkAnnotation,ThumbnailView,BookmarkView, TextSelection);
33+
34+
let pdfviewer: PdfViewer = new PdfViewer({enableBookmark: true, documentPath:'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'});
35+
pdfviewer.serviceUrl = 'https://document.syncfusion.com/web-services/pdf-viewer/api/pdfviewer/';
36+
pdfviewer.appendTo('#PdfViewer');
37+
38+
{% endhighlight %}
39+
{% endtabs %}
40+
41+
![Alt text](../images/bookmark.png)
42+
43+
To perform bookmark navigation, you can use the **goToBookmark** method. It's important to note that the **goToBookmark** method will throw an error if the specified bookmark does not exist in the PDF document.
44+
45+
Here is an example of how to use the **goToBookmark** method:
46+
47+
```
48+
<button id="gotobookmark">Specfic Page</button>
49+
```
50+
51+
```ts
52+
document.getElementById('gotobookmark').addEventListener('click', () => {
53+
viewer.bookmark.goToBookmark(x, y);
54+
});
55+
```
56+
57+
x - Specifies the pageIndex for Navigate.
58+
59+
y - Specifies the Y coordinates value of the Page.
60+
61+
Also, you can use the **getBookmarks** method to retrieve a list of all the bookmarks in a PDF document. This method returns a List of Bookmark objects, which contain information about each bookmark.
62+
63+
Here is an example of how to use the getBookmarks method:
64+
65+
```
66+
<button id="getBookmarks">retrieve bookmark</button>
67+
```
68+
69+
```ts
70+
document.getElementById('getBookmarks').addEventListener('click', () => {
71+
var getBookmarks = viewer.bookmark.getBookmarks();
72+
console.log(getBookmarks)
73+
});
74+
```
75+
76+
## See also
77+
78+
* [Toolbar items](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/angular/toolbar)
79+
* [Feature Modules](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/angular/feature-module)

0 commit comments

Comments
 (0)