Skip to content

Commit ba94288

Browse files
Integrated latest changes at 12-28-2023 1:36:41 AM
1 parent 6cc7692 commit ba94288

File tree

5 files changed

+172
-2
lines changed

5 files changed

+172
-2
lines changed

ej2-angular-toc.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1694,6 +1694,7 @@
16941694
<li><a href="/ej2-angular/pdfviewer/how-to/load-n-number-page">Load N number of pages on initial loading</a></li>
16951695
<li><a href="/ej2-angular/pdfviewer/how-to/retry-timeout">Retry Timeout</a></li>
16961696
<li><a href="/ej2-angular/pdfviewer/how-to/redis-cache">Configure Redis Cache</a></li>
1697+
<li><a href="/ej2-angular/pdfviewer/how-to/toolbar-icon-customization">Customize toolbar</a></li>
16971698
</ul>
16981699
</li>
16991700
<li>Troubleshooting
@@ -2727,7 +2728,7 @@
27272728
</ul>
27282729
</li> <li>Release Notes
27292730
<ul>
2730-
<li>2023 Volume 4 - 24.*<ul><li><a href="/ej2-angular/release-notes/24.1.41">24.1.41 Main Release</a></li></ul></li>
2731+
<li>2023 Volume 4 - 24.*<ul><li>Weekly Nuget Release <ul><li><a href="/ej2-angular/release-notes/24.1.43">24.1.43</a></li></ul></li><li><a href="/ej2-angular/release-notes/24.1.41">24.1.41 Main Release</a></li></ul></li>
27312732
<li>2023 Volume 3 - 23.*<ul><li> Weekly Nuget Release <ul><li><a href="/ej2-angular/release-notes/23.2.7">23.2.7</a></li><li><a href="/ej2-angular/release-notes/23.2.6">23.2.6</a></li><li><a href="/ej2-angular/release-notes/23.2.5">23.2.5</a></li><li><a href="/ej2-angular/release-notes/23.1.44">23.1.44</a></li><li><a href="/ej2-angular/release-notes/23.1.43">23.1.43</a></li><li><a href="/ej2-angular/release-notes/23.1.42">23.1.42</a></li><li><a href="/ej2-angular/release-notes/23.1.41">23.1.41</a></li><li><a href="/ej2-angular/release-notes/23.1.40">23.1.40</a></li><li><a href="/ej2-angular/release-notes/23.1.39">23.1.39</a></li><li><a href="/ej2-angular/release-notes/23.1.38">23.1.38</a></li></ul></li>
27322733
<li><a href="/ej2-angular/release-notes/23.2.4">23.2.4 Service Pack Release</a></li>
27332734
<li><a href="/ej2-angular/release-notes/23.1.36">23.1.36 Main Release</a></li></ul></li>

ej2-angular/Release-notes/24.1.43.md

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
---
2+
title: Essential Studio for Angular 2023 Weekly Nuget Release Release Notes
3+
description: Essential Studio for Angular 2023 Weekly Nuget Release Release Notes
4+
platform: ej2-angular
5+
documentation: ug
6+
---
7+
8+
# Essential Studio for ##Platform_Name## Release Notes
9+
10+
{% include release-info.html date="December 27, 2023" version="v24.1.43" %}
11+
12+
{% directory path: _includes/release-notes/v24.1.43 %}
13+
14+
{% include {{file.url}} %}
15+
16+
{% enddirectory %}
Lines changed: 153 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,153 @@
1+
---
2+
layout: post
3+
title: Customize toolbar in Angular Pdfviewer component | Syncfusion
4+
description: Learn here all about Customize toolbar in Syncfusion Angular Pdfviewer component of Syncfusion Essential JS 2 and more.
5+
platform: ej2-angular
6+
control: PDF Viewer
7+
documentation: ug
8+
domainurl: ##DomainURL##
9+
---
10+
11+
# Customize toolbar in PDF Viewer component
12+
13+
## How to customize existing toolbar in PDF Viewer component
14+
15+
PDF Viewer allows you to customize(add, show, hide, enable, and disable) existing items in a toolbar.
16+
17+
* Add - New items can defined by **CustomToolbarItemModel** and with existing items in [**ToolbarSettings**](https://ej2.syncfusion.com/angular/documentation/api/pdfviewer/toolbarSettings/) property. Newly added item click action can be defined in [`toolbarclick`](https://ej2.syncfusion.com/angular/documentation/api/toolbar/clickEventArgs/).
18+
19+
* Show, Hide - Existing items can be shown or hidden using the [`ToolbarSettings`](https://ej2.syncfusion.com/angular/documentation/api/pdfviewer/toolbarSettings/) property. Pre-defined toolbar items are available with [`ToolbarItem`](https://ej2.syncfusion.com/angular/documentation/api/pdfviewer/toolbarItem/).
20+
21+
* Enable, Disable - Toolbar items can be enabled or disable using [`enabletoolbaritem`](https://ej2.syncfusion.com/angular/documentation/api/pdfviewer/toolbar/#enabletoolbaritem)
22+
23+
{% tabs %}
24+
{% highlight html tabtitle="Standalone" %}
25+
26+
import { Component, OnInit } from '@angular/core';
27+
import {
28+
LinkAnnotationService, BookmarkViewService, MagnificationService,
29+
ThumbnailViewService, ToolbarService, NavigationService,
30+
AnnotationService, TextSearchService, TextSelectionService,
31+
PrintService, FormDesignerService, FormFieldsService, CustomToolbarItemModel
32+
} from '@syncfusion/ej2-angular-pdfviewer';
33+
34+
@Component({
35+
selector: 'app-root',
36+
template: `<div class="content-wrapper">
37+
<ejs-pdfviewer id="pdfViewer"
38+
[documentPath]="document"
39+
[resourceUrl]="resource"
40+
[toolbarSettings]="toolbarSettings"
41+
(toolbarClick)="toolbarClick($event)"
42+
style="height:640px;display:block">
43+
</ejs-pdfviewer>
44+
</div>`,
45+
providers: [LinkAnnotationService, BookmarkViewService, MagnificationService,
46+
ThumbnailViewService, ToolbarService, NavigationService,
47+
AnnotationService, TextSearchService, TextSelectionService,
48+
PrintService, FormDesignerService, FormFieldsService]
49+
})
50+
export class AppComponent implements OnInit {
51+
public document = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf';
52+
public resource = 'https://cdn.syncfusion.com/ej2/24.1.41/dist/ej2-pdfviewer-lib';
53+
54+
public toolItem: CustomToolbarItemModel = {
55+
prefixIcon: 'e-icons e-paste',
56+
id: 'print',
57+
tooltipText: 'Custom toolbar item',
58+
align: 'left'
59+
};
60+
61+
public toolbarSettings = {
62+
showTooltip: true,
63+
toolbarItems: [this.toolItem,'OpenOption', 'PageNavigationTool', 'MagnificationTool', 'PanTool', 'SelectionTool',
64+
'SearchOption', 'PrintOption', 'DownloadOption', 'UndoRedoTool', 'AnnotationEditTool',
65+
'FormDesignerEditTool', 'CommentTool', 'SubmitForm', this.toolItem]
66+
};
67+
public toolbarClick(args: any): void {
68+
var pdfViewer = (<any>document.getElementById('pdfViewer')).ej2_instances[0];
69+
if (args.item && args.item.id === 'print') {
70+
pdfViewer.printModule.print();
71+
} else if (args.item && args.item.id === 'download') {
72+
pdfViewer.download();
73+
}
74+
}
75+
prefixIcon: "e-de-ctnr-lock",
76+
tooltipText: "Disable Image",
77+
text: "Disable Image",
78+
id: "Custom"
79+
};
80+
public toolbarSettings = { toolbarItems: [this.toolItem, 'OpenOption', 'PageNavigationTool', 'MagnificationTool', 'PanTool', 'SelectionTool', 'SearchOption', 'PrintOption', 'DownloadOption', 'UndoRedoTool', 'AnnotationEditTool', 'FormDesignerEditTool', 'CommentTool', 'SubmitForm']}
81+
82+
ngOnInit(): void {
83+
}
84+
}
85+
86+
{% endhighlight %}
87+
{% highlight html tabtitle="Server-Backed" %}
88+
89+
import { Component, OnInit } from '@angular/core';
90+
import {
91+
LinkAnnotationService, BookmarkViewService, MagnificationService,
92+
ThumbnailViewService, ToolbarService, NavigationService,
93+
AnnotationService, TextSearchService, TextSelectionService,
94+
PrintService, FormDesignerService, FormFieldsService, CustomToolbarItemModel
95+
} from '@syncfusion/ej2-angular-pdfviewer';
96+
97+
@Component({
98+
selector: 'app-root',
99+
template: `<div class="content-wrapper">
100+
<ejs-pdfviewer id="pdfViewer"
101+
[documentPath]="document"
102+
[serviceUrl]='service'
103+
[toolbarSettings]="toolbarSettings"
104+
(toolbarClick)="toolbarClick($event)"
105+
style="height:640px;display:block">
106+
</ejs-pdfviewer>
107+
</div>`,
108+
providers: [LinkAnnotationService, BookmarkViewService, MagnificationService,
109+
ThumbnailViewService, ToolbarService, NavigationService,
110+
AnnotationService, TextSearchService, TextSelectionService,
111+
PrintService, FormDesignerService, FormFieldsService]
112+
})
113+
export class AppComponent implements OnInit {
114+
public document = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf';
115+
public service = 'https://services.syncfusion.com/angular/production/api/pdfviewer';
116+
117+
public toolItem: CustomToolbarItemModel = {
118+
prefixIcon: 'e-icons e-paste',
119+
id: 'print',
120+
tooltipText: 'Custom toolbar item',
121+
align: 'left'
122+
};
123+
124+
public toolbarSettings = {
125+
showTooltip: true,
126+
toolbarItems: [this.toolItem,'OpenOption', 'PageNavigationTool', 'MagnificationTool', 'PanTool', 'SelectionTool',
127+
'SearchOption', 'PrintOption', 'DownloadOption', 'UndoRedoTool', 'AnnotationEditTool',
128+
'FormDesignerEditTool', 'CommentTool', 'SubmitForm', this.toolItem]
129+
};
130+
public toolbarClick(args: any): void {
131+
var pdfViewer = (<any>document.getElementById('pdfViewer')).ej2_instances[0];
132+
if (args.item && args.item.id === 'print') {
133+
pdfViewer.printModule.print();
134+
} else if (args.item && args.item.id === 'download') {
135+
pdfViewer.download();
136+
}
137+
}
138+
139+
prefixIcon: "e-de-ctnr-lock",
140+
tooltipText: "Disable Image",
141+
text: "Disable Image",
142+
id: "Custom"
143+
};
144+
public toolbarSettings = { toolbarItems: [this.toolItem, 'OpenOption', 'PageNavigationTool', 'MagnificationTool', 'PanTool', 'SelectionTool', 'SearchOption', 'PrintOption', 'DownloadOption', 'UndoRedoTool', 'AnnotationEditTool', 'FormDesignerEditTool', 'CommentTool', 'SubmitForm']}
145+
146+
ngOnInit(): void {
147+
}
148+
}
149+
150+
{% endhighlight %}
151+
{% endtabs %}
152+
153+
>Note : Default value of toolbar items is ['OpenOption', 'PageNavigationTool','MagnificationTool', 'PanTool', 'SelectionTool', 'SearchOption', 'PrintOption', 'DownloadOption','UndoRedoTool', 'AnnotationEditTool', 'FormDesignerEditTool', 'CommentTool', 'SubmitForm']
Loading

ej2-angular/pivotview/virtual-scrolling.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ To use the virtual scrolling feature, inject the `VirtualScroll` module in to th
3939
* Grouping, which takes additional time to splitting the raw items into the provided format.
4040
* Date Formatting, which takes additional time to convert date format.
4141
* Date Formatting with sorting, here additionally full date time format should be framed to perform sorting along with the provided date format which lags the performance.
42-
* When using OLAP data, subtotals and grandtotals are only displayed when measures are bound at the last position in the [row](https://ej2.syncfusion.com/angular/documentation/api/pivotview/dataSourceSettings/#rows) or [column](https://ej2.syncfusion.com/angular/documentation/api/pivotview/dataSourceSettings/#columns) axis. Otherwise, the data from the pivot table will be shown without summary totals.
42+
* When using OLAP data, subtotals and grandtotals are only displayed when measures are bound at the last position in the [`rows`](https://ej2.syncfusion.com/angular/documentation/api/pivotview/dataSourceSettings/#rows) or [`columns`](https://ej2.syncfusion.com/angular/documentation/api/pivotview/dataSourceSettings/#columns) axis. Otherwise, the data from the pivot table will be shown without summary totals.
4343
* Even if virtual scrolling is enabled, not only is the current view port data retrieved, but also the data for the immediate previous page and the immediate next page. As a result, when the end user scrolls slightly ahead or behind, the next or previous page data is displayed immediately without requiring a refresh. **Note:** If the pivot table's width and height are large, the loading data count in the current, previous, and next view ports (pages) will also increase, affecting performance.
4444

4545
## Data Compression

0 commit comments

Comments
 (0)