@progress/kendo-angular-chart-wizard 17.0.0-develop.21 → 17.0.0-develop.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/chart-wizard.component.d.ts +1 -1
- package/common/models.d.ts +1 -1
- package/{esm2020 → esm2022}/chart-wizard.component.mjs +84 -58
- package/{esm2020 → esm2022}/chart-wizard.module.mjs +13 -13
- package/{esm2020 → esm2022}/events/export-event.mjs +8 -0
- package/{esm2020 → esm2022}/events/preventable-event.mjs +1 -3
- package/{esm2020 → esm2022}/grid-integration/grid-chart-wizard.directive.mjs +26 -13
- package/{esm2020 → esm2022}/localization/chartwizard-localization.service.mjs +3 -3
- package/{esm2020 → esm2022}/localization/custom-messages.component.mjs +9 -8
- package/{esm2020 → esm2022}/localization/localized-messages.directive.mjs +9 -8
- package/esm2022/localization/messages.mjs +657 -0
- package/{esm2020 → esm2022}/package-metadata.mjs +2 -2
- package/{esm2020 → esm2022}/property-pane/chart-tab.component.mjs +19 -16
- package/{esm2020 → esm2022}/property-pane/data-tab.component.mjs +18 -12
- package/{esm2020 → esm2022}/property-pane/form-field.component.mjs +30 -13
- package/{esm2020 → esm2022}/property-pane/format-tab.component.mjs +76 -73
- package/{esm2020 → esm2022}/series-type-button.component.mjs +9 -5
- package/esm2022/state.service.mjs +36 -0
- package/{fesm2020 → fesm2022}/progress-kendo-angular-chart-wizard.mjs +756 -253
- package/grid-integration/grid-chart-wizard.directive.d.ts +1 -1
- package/localization/messages.d.ts +1 -1
- package/package.json +24 -30
- package/property-pane/form-field.component.d.ts +1 -1
- package/series-type-button.component.d.ts +1 -1
- package/esm2020/localization/messages.mjs +0 -233
- package/esm2020/state.service.mjs +0 -37
- package/fesm2015/progress-kendo-angular-chart-wizard.mjs +0 -3643
- /package/{esm2020 → esm2022}/chart-wizard-state.mjs +0 -0
- /package/{esm2020 → esm2022}/common/get-wizard-data-from-data-rows.mjs +0 -0
- /package/{esm2020 → esm2022}/common/index.mjs +0 -0
- /package/{esm2020 → esm2022}/common/models.mjs +0 -0
- /package/{esm2020 → esm2022}/common/window-settings.mjs +0 -0
- /package/{esm2020 → esm2022}/directives.mjs +0 -0
- /package/{esm2020 → esm2022}/events/index.mjs +0 -0
- /package/{esm2020 → esm2022}/grid-integration/get-grid-selected-rows.mjs +0 -0
- /package/{esm2020 → esm2022}/grid-integration/get-wizard-data-from-grid-selection.mjs +0 -0
- /package/{esm2020 → esm2022}/grid-integration/index.mjs +0 -0
- /package/{esm2020 → esm2022}/index.mjs +0 -0
- /package/{esm2020 → esm2022}/progress-kendo-angular-chart-wizard.mjs +0 -0
@@ -1,3643 +0,0 @@
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
2
|
-
* Copyright © 2024 Progress Software Corporation. All rights reserved.
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
5
|
-
import * as i0 from '@angular/core';
|
6
|
-
import { Injectable, Inject, Optional, Component, ChangeDetectionStrategy, ViewEncapsulation, ViewChild, Input, EventEmitter, Output, HostBinding, Directive, forwardRef, HostListener, NgModule } from '@angular/core';
|
7
|
-
import { shouldShowValidationUI, isPresent, WatermarkOverlayComponent, ResizeBatchService } from '@progress/kendo-angular-common';
|
8
|
-
import * as i1 from '@progress/kendo-angular-l10n';
|
9
|
-
import { LocalizationService, L10N_PREFIX, RTL, ComponentMessages } from '@progress/kendo-angular-l10n';
|
10
|
-
import { validatePackage } from '@progress/kendo-licensing';
|
11
|
-
import { Subscription } from 'rxjs';
|
12
|
-
import { ChartWizardCommon } from '@progress/kendo-charts';
|
13
|
-
import { trashIcon, plusIcon, exportIcon, chartBarClusteredIcon, chartBarStackedIcon, chartBarStacked100Icon, chartPieIcon, chartColumnClusteredIcon, chartColumnStackedIcon, chartColumnStacked100Icon, chartLineIcon, chartLineStackedIcon, chartLineStacked100Icon, chartScatterIcon, filePdfIcon, fileIcon, fileImageIcon } from '@progress/kendo-svg-icons';
|
14
|
-
import { ChartComponent, TitleComponent, SubtitleComponent, ChartAreaComponent, CategoryAxisComponent, CategoryAxisItemComponent, ValueAxisComponent, ValueAxisItemComponent, SeriesComponent, SeriesItemComponent, LegendComponent, XAxisComponent, XAxisItemComponent, YAxisComponent, YAxisItemComponent, ThemeService } from '@progress/kendo-angular-charts';
|
15
|
-
import { saveAs } from '@progress/kendo-file-saver';
|
16
|
-
import { exportPDF } from '@progress/kendo-drawing';
|
17
|
-
import * as i1$1 from '@progress/kendo-angular-grid';
|
18
|
-
import { GridComponent, ReactiveEditingDirective, DataBindingDirective, ToolbarTemplateDirective, RowReorderColumnComponent, ColumnComponent, CommandColumnComponent, CellTemplateDirective, GridToolbarFocusableDirective, RemoveCommandDirective } from '@progress/kendo-angular-grid';
|
19
|
-
import { NgIf, NgFor } from '@angular/common';
|
20
|
-
import { ExpansionPanelComponent, SplitterComponent, SplitterPaneComponent, TabStripComponent, TabStripTabComponent, TabContentDirective } from '@progress/kendo-angular-layout';
|
21
|
-
import { DropDownListComponent, ValueTemplateDirective, ComboBoxComponent } from '@progress/kendo-angular-dropdowns';
|
22
|
-
import { ButtonComponent, FocusableDirective, DropDownButtonComponent } from '@progress/kendo-angular-buttons';
|
23
|
-
import * as i2 from '@angular/forms';
|
24
|
-
import { SVGIconComponent, IconsService } from '@progress/kendo-angular-icons';
|
25
|
-
import { WindowComponent, DialogContainerService, DialogService, WindowService, WindowContainerService } from '@progress/kendo-angular-dialog';
|
26
|
-
import { NumericTextBoxComponent, ColorPickerComponent, TextBoxComponent, CheckBoxComponent, SwitchComponent } from '@progress/kendo-angular-inputs';
|
27
|
-
import { LabelComponent } from '@progress/kendo-angular-label';
|
28
|
-
import { trigger, state, style, transition, animate } from '@angular/animations';
|
29
|
-
import { PopupService } from '@progress/kendo-angular-popup';
|
30
|
-
import { getter } from '@progress/kendo-common';
|
31
|
-
|
32
|
-
/**
|
33
|
-
* @hidden
|
34
|
-
*/
|
35
|
-
const packageMetadata = {
|
36
|
-
name: '@progress/kendo-angular-chart-wizard',
|
37
|
-
productName: 'Kendo UI for Angular',
|
38
|
-
productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
|
39
|
-
publishDate: 1729874525,
|
40
|
-
version: '17.0.0-develop.21',
|
41
|
-
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning',
|
42
|
-
};
|
43
|
-
|
44
|
-
/**
|
45
|
-
* @hidden
|
46
|
-
*/
|
47
|
-
const fontSizes = ChartWizardCommon.fontSizes;
|
48
|
-
/**
|
49
|
-
* @hidden
|
50
|
-
*/
|
51
|
-
const fontNames = ChartWizardCommon.fontNames;
|
52
|
-
/**
|
53
|
-
* @hidden
|
54
|
-
*/
|
55
|
-
const createState = ChartWizardCommon.createState;
|
56
|
-
/**
|
57
|
-
* @hidden
|
58
|
-
*/
|
59
|
-
const updateState = ChartWizardCommon.updateState;
|
60
|
-
/**
|
61
|
-
* @hidden
|
62
|
-
*/
|
63
|
-
const mergeStates = ChartWizardCommon.mergeStates;
|
64
|
-
/**
|
65
|
-
* @hidden
|
66
|
-
*/
|
67
|
-
const isCategorical = ChartWizardCommon.isCategorical;
|
68
|
-
/**
|
69
|
-
* @hidden
|
70
|
-
*/
|
71
|
-
const parseFont = ChartWizardCommon.parseFont;
|
72
|
-
/**
|
73
|
-
* @hidden
|
74
|
-
*/
|
75
|
-
const ActionTypes = ChartWizardCommon.ActionTypes;
|
76
|
-
/**
|
77
|
-
* @hidden
|
78
|
-
*/
|
79
|
-
const rotations = [
|
80
|
-
{ text: 'Auto', value: 'auto' },
|
81
|
-
{ text: '0°', value: 0 },
|
82
|
-
{ text: '45°', value: 45 },
|
83
|
-
{ text: '90°', value: 90 },
|
84
|
-
{ text: '135°', value: 135 },
|
85
|
-
{ text: '180°', value: 180 }
|
86
|
-
];
|
87
|
-
/**
|
88
|
-
* @hidden
|
89
|
-
*/
|
90
|
-
const positions = [
|
91
|
-
{ text: 'Top', value: 'top' },
|
92
|
-
{ text: 'Bottom', value: 'bottom' },
|
93
|
-
{ text: 'Left', value: 'left' },
|
94
|
-
{ text: 'Right', value: 'right' }
|
95
|
-
];
|
96
|
-
|
97
|
-
/**
|
98
|
-
* @hidden
|
99
|
-
*/
|
100
|
-
const defaultAllSeriesItem = { name: 'All Series' };
|
101
|
-
/**
|
102
|
-
* @hidden
|
103
|
-
*/
|
104
|
-
const defaultFormat = {
|
105
|
-
value: '',
|
106
|
-
text: 'Text'
|
107
|
-
};
|
108
|
-
/**
|
109
|
-
* @hidden
|
110
|
-
*/
|
111
|
-
const labelFormats = [
|
112
|
-
defaultFormat,
|
113
|
-
{ value: 'n0', text: 'Number' },
|
114
|
-
{ value: 'c0', text: 'Currency' },
|
115
|
-
{ value: 'p0', text: 'Percent' }
|
116
|
-
];
|
117
|
-
|
118
|
-
/**
|
119
|
-
* @hidden
|
120
|
-
*/
|
121
|
-
class StateService {
|
122
|
-
constructor() {
|
123
|
-
this.state = {
|
124
|
-
categoryAxis: [],
|
125
|
-
valueAxis: [],
|
126
|
-
series: [],
|
127
|
-
initialSeries: [],
|
128
|
-
columns: [],
|
129
|
-
data: [],
|
130
|
-
area: { margin: { top: 0, right: 0, bottom: 0, left: 0 } },
|
131
|
-
seriesType: 'bar'
|
132
|
-
};
|
133
|
-
this.seriesType = 'bar';
|
134
|
-
this.currentTitle = 'Chart Title';
|
135
|
-
this.currentSeries = defaultAllSeriesItem;
|
136
|
-
this.data = [];
|
137
|
-
this.deletedSeries = [];
|
138
|
-
this.direction = 'ltr';
|
139
|
-
this.windowSize = { width: 700, height: 550 };
|
140
|
-
this.splitterPaneSize = '300px';
|
141
|
-
}
|
142
|
-
}
|
143
|
-
StateService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: StateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
144
|
-
StateService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: StateService });
|
145
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: StateService, decorators: [{
|
146
|
-
type: Injectable
|
147
|
-
}] });
|
148
|
-
|
149
|
-
/**
|
150
|
-
* @hidden
|
151
|
-
*/
|
152
|
-
class ChartWizardLocalizationService extends LocalizationService {
|
153
|
-
constructor(prefix, messageService, _rtl) {
|
154
|
-
super(prefix, messageService, _rtl);
|
155
|
-
}
|
156
|
-
}
|
157
|
-
ChartWizardLocalizationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i1.MessageService, optional: true }, { token: RTL, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
|
158
|
-
ChartWizardLocalizationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardLocalizationService });
|
159
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardLocalizationService, decorators: [{
|
160
|
-
type: Injectable
|
161
|
-
}], ctorParameters: function () {
|
162
|
-
return [{ type: undefined, decorators: [{
|
163
|
-
type: Inject,
|
164
|
-
args: [L10N_PREFIX]
|
165
|
-
}] }, { type: i1.MessageService, decorators: [{
|
166
|
-
type: Optional
|
167
|
-
}] }, { type: undefined, decorators: [{
|
168
|
-
type: Optional
|
169
|
-
}, {
|
170
|
-
type: Inject,
|
171
|
-
args: [RTL]
|
172
|
-
}] }];
|
173
|
-
} });
|
174
|
-
|
175
|
-
/**
|
176
|
-
* @hidden
|
177
|
-
*/
|
178
|
-
class ChartWizardPropertyPaneDataTabComponent {
|
179
|
-
constructor(stateService, formBuilder, cdr, renderer, localization) {
|
180
|
-
this.stateService = stateService;
|
181
|
-
this.formBuilder = formBuilder;
|
182
|
-
this.cdr = cdr;
|
183
|
-
this.renderer = renderer;
|
184
|
-
this.localization = localization;
|
185
|
-
this.categoryAxisX = ActionTypes.categoryAxisX;
|
186
|
-
this.valueAxisY = ActionTypes.valueAxisY;
|
187
|
-
this.trashIcon = trashIcon;
|
188
|
-
this.plusIcon = plusIcon;
|
189
|
-
this.isCategorical = isCategorical;
|
190
|
-
this.formGroup = this.formBuilder.group({
|
191
|
-
name: null,
|
192
|
-
});
|
193
|
-
}
|
194
|
-
ngAfterViewInit() {
|
195
|
-
if (this.grid) {
|
196
|
-
const gridHeader = this.grid.wrapper.nativeElement.querySelector('.k-grid .k-grid-header');
|
197
|
-
const gridContent = this.grid.wrapper.nativeElement.querySelector('.k-grid .k-grid-content');
|
198
|
-
this.renderer.setStyle(gridHeader, 'display', 'none');
|
199
|
-
this.renderer.setStyle(gridContent, 'overflow', 'auto');
|
200
|
-
}
|
201
|
-
}
|
202
|
-
updateState(action, value) {
|
203
|
-
this.stateService.state = updateState(this.stateService.state, action, value);
|
204
|
-
}
|
205
|
-
createFormGroup(args) {
|
206
|
-
const item = args.isNew ? {} : args.dataItem;
|
207
|
-
this.formGroup = this.formBuilder.group({
|
208
|
-
name: item.name,
|
209
|
-
});
|
210
|
-
return this.formGroup;
|
211
|
-
}
|
212
|
-
addData() {
|
213
|
-
this.stateService.state.series.push(this.stateService.deletedSeries[0]);
|
214
|
-
this.stateService.deletedSeries.shift();
|
215
|
-
this.updateState(ActionTypes.seriesChange, this.stateService.state.series);
|
216
|
-
}
|
217
|
-
removeData(event) {
|
218
|
-
this.stateService.deletedSeries.push(event.dataItem);
|
219
|
-
this.updateState(ActionTypes.seriesChange, event.sender.data.data);
|
220
|
-
}
|
221
|
-
onRowReorder(grid) {
|
222
|
-
this.updateState(ActionTypes.seriesChange, grid.data.data);
|
223
|
-
}
|
224
|
-
isDisabled(grid) {
|
225
|
-
return grid.data.data.length === this.stateService.state.initialSeries.length;
|
226
|
-
}
|
227
|
-
detectChanges() {
|
228
|
-
this.cdr.detectChanges();
|
229
|
-
}
|
230
|
-
messageFor(key) {
|
231
|
-
return this.localization.get(key);
|
232
|
-
}
|
233
|
-
}
|
234
|
-
ChartWizardPropertyPaneDataTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardPropertyPaneDataTabComponent, deps: [{ token: StateService }, { token: i2.FormBuilder }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: ChartWizardLocalizationService }], target: i0.ɵɵFactoryTarget.Component });
|
235
|
-
ChartWizardPropertyPaneDataTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChartWizardPropertyPaneDataTabComponent, isStandalone: true, selector: "kendo-chartwizard-property-pane-data-tab", viewQueries: [{ propertyName: "grid", first: true, predicate: GridComponent, descendants: true }], ngImport: i0, template: `
|
236
|
-
<kendo-expansionpanel [title]="messageFor('configuration')" [expanded]="true">
|
237
|
-
<form class="k-form k-form-md">
|
238
|
-
<fieldset class="k-form-fieldset">
|
239
|
-
<legend class="k-form-legend">
|
240
|
-
{{ stateService.state.seriesType === 'scatter' ? messageFor('configurationXAxis') : messageFor('configurationCategoryAxis') }}
|
241
|
-
</legend>
|
242
|
-
<kendo-dropdownlist
|
243
|
-
[data]="stateService.state.columns"
|
244
|
-
[value]="stateService.state.categoryField"
|
245
|
-
(valueChange)="updateState(categoryAxisX, $event)"
|
246
|
-
fillMode="outline"
|
247
|
-
rounded="medium"
|
248
|
-
size="medium"
|
249
|
-
>
|
250
|
-
</kendo-dropdownlist>
|
251
|
-
</fieldset>
|
252
|
-
<fieldset class="k-form-fieldset" *ngIf="isCategorical(stateService.state.seriesType)">
|
253
|
-
<legend class="k-form-legend">{{ messageFor('configurationSeries') }}</legend>
|
254
|
-
<kendo-grid
|
255
|
-
#grid
|
256
|
-
[kendoGridReactiveEditing]="createFormGroup"
|
257
|
-
[kendoGridBinding]="stateService.state.series"
|
258
|
-
[rowReorderable]="true"
|
259
|
-
(rowReorder)="onRowReorder(grid)"
|
260
|
-
(remove)="removeData($event)"
|
261
|
-
>
|
262
|
-
<ng-template kendoGridToolbarTemplate>
|
263
|
-
<button
|
264
|
-
kendoButton
|
265
|
-
type="button"
|
266
|
-
[svgIcon]="plusIcon"
|
267
|
-
fillMode="flat"
|
268
|
-
rounded="medium"
|
269
|
-
[disabled]="isDisabled(grid)"
|
270
|
-
(click)="addData()"
|
271
|
-
>
|
272
|
-
{{ messageFor('configurationSeriesAdd') }}
|
273
|
-
</button>
|
274
|
-
</ng-template>
|
275
|
-
<kendo-grid-rowreorder-column [width]="40"></kendo-grid-rowreorder-column>
|
276
|
-
<kendo-grid-column field="name" title="">
|
277
|
-
</kendo-grid-column>
|
278
|
-
<kendo-grid-command-column [width]="40">
|
279
|
-
<ng-template kendoGridCellTemplate>
|
280
|
-
<button
|
281
|
-
[svgIcon]="trashIcon"
|
282
|
-
kendoGridRemoveCommand
|
283
|
-
fillMode="flat"
|
284
|
-
rounded="medium"
|
285
|
-
[disabled]="stateService.state.series.length < 2"
|
286
|
-
></button>
|
287
|
-
</ng-template>
|
288
|
-
</kendo-grid-command-column>
|
289
|
-
</kendo-grid>
|
290
|
-
</fieldset>
|
291
|
-
<fieldset
|
292
|
-
class="k-form-fieldset"
|
293
|
-
*ngIf="stateService.state.seriesType === 'pie'"
|
294
|
-
>
|
295
|
-
<legend class="k-form-legend">
|
296
|
-
{{ messageFor('configurationValueAxis') }}
|
297
|
-
</legend>
|
298
|
-
<kendo-dropdownlist
|
299
|
-
[data]="stateService.state.columns"
|
300
|
-
[value]="stateService.state.valueField"
|
301
|
-
(valueChange)="updateState(valueAxisY, $event)"
|
302
|
-
fillMode="outline"
|
303
|
-
rounded="medium"
|
304
|
-
size="medium"
|
305
|
-
>
|
306
|
-
</kendo-dropdownlist>
|
307
|
-
</fieldset>
|
308
|
-
</form>
|
309
|
-
</kendo-expansionpanel>
|
310
|
-
`, isInline: true, dependencies: [{ kind: "component", type: ExpansionPanelComponent, selector: "kendo-expansionpanel", inputs: ["title", "subtitle", "disabled", "expanded", "svgExpandIcon", "svgCollapseIcon", "expandIcon", "collapseIcon", "animation"], outputs: ["expandedChange", "action", "expand", "collapse"], exportAs: ["kendoExpansionPanel"] }, { kind: "component", type: DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GridComponent, selector: "kendo-grid", inputs: ["data", "pageSize", "height", "rowHeight", "detailRowHeight", "skip", "scrollable", "selectable", "sort", "size", "trackBy", "filter", "group", "virtualColumns", "filterable", "sortable", "pageable", "groupable", "rowReorderable", "navigable", "navigatable", "autoSize", "rowClass", "rowSticky", "rowSelected", "isRowSelectable", "cellSelected", "resizable", "reorderable", "loading", "columnMenu", "hideHeader", "isDetailExpanded", "isGroupExpanded"], outputs: ["filterChange", "pageChange", "groupChange", "sortChange", "selectionChange", "rowReorder", "dataStateChange", "groupExpand", "groupCollapse", "detailExpand", "detailCollapse", "edit", "cancel", "save", "remove", "add", "cellClose", "cellClick", "pdfExport", "excelExport", "columnResize", "columnReorder", "columnVisibilityChange", "columnLockedChange", "columnStickyChange", "scrollBottom", "contentScroll"], exportAs: ["kendoGrid"] }, { kind: "directive", type: ReactiveEditingDirective, selector: "[kendoGridReactiveEditing]", inputs: ["kendoGridReactiveEditing"] }, { kind: "directive", type: DataBindingDirective, selector: "[kendoGridBinding]", inputs: ["skip", "sort", "filter", "pageSize", "group", "kendoGridBinding"], exportAs: ["kendoGridBinding"] }, { kind: "directive", type: ToolbarTemplateDirective, selector: "[kendoGridToolbarTemplate]", inputs: ["position"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: RowReorderColumnComponent, selector: "kendo-grid-rowreorder-column", inputs: ["dragHandleIcon", "dragHandleSVGIcon"] }, { kind: "component", type: ColumnComponent, selector: "kendo-grid-column", inputs: ["field", "format", "sortable", "groupable", "editor", "filter", "filterable", "editable"] }, { kind: "component", type: CommandColumnComponent, selector: "kendo-grid-command-column" }, { kind: "directive", type: CellTemplateDirective, selector: "[kendoGridCellTemplate]" }, { kind: "directive", type: GridToolbarFocusableDirective, selector: " [kendoGridToolbarFocusable], [kendoGridAddCommand], [kendoGridCancelCommand], [kendoGridEditCommand], [kendoGridRemoveCommand], [kendoGridSaveCommand], [kendoGridExcelCommand], [kendoGridPDFCommand] " }, { kind: "component", type: RemoveCommandDirective, selector: "[kendoGridRemoveCommand]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
311
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardPropertyPaneDataTabComponent, decorators: [{
|
312
|
-
type: Component,
|
313
|
-
args: [{
|
314
|
-
selector: 'kendo-chartwizard-property-pane-data-tab',
|
315
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
316
|
-
encapsulation: ViewEncapsulation.None,
|
317
|
-
template: `
|
318
|
-
<kendo-expansionpanel [title]="messageFor('configuration')" [expanded]="true">
|
319
|
-
<form class="k-form k-form-md">
|
320
|
-
<fieldset class="k-form-fieldset">
|
321
|
-
<legend class="k-form-legend">
|
322
|
-
{{ stateService.state.seriesType === 'scatter' ? messageFor('configurationXAxis') : messageFor('configurationCategoryAxis') }}
|
323
|
-
</legend>
|
324
|
-
<kendo-dropdownlist
|
325
|
-
[data]="stateService.state.columns"
|
326
|
-
[value]="stateService.state.categoryField"
|
327
|
-
(valueChange)="updateState(categoryAxisX, $event)"
|
328
|
-
fillMode="outline"
|
329
|
-
rounded="medium"
|
330
|
-
size="medium"
|
331
|
-
>
|
332
|
-
</kendo-dropdownlist>
|
333
|
-
</fieldset>
|
334
|
-
<fieldset class="k-form-fieldset" *ngIf="isCategorical(stateService.state.seriesType)">
|
335
|
-
<legend class="k-form-legend">{{ messageFor('configurationSeries') }}</legend>
|
336
|
-
<kendo-grid
|
337
|
-
#grid
|
338
|
-
[kendoGridReactiveEditing]="createFormGroup"
|
339
|
-
[kendoGridBinding]="stateService.state.series"
|
340
|
-
[rowReorderable]="true"
|
341
|
-
(rowReorder)="onRowReorder(grid)"
|
342
|
-
(remove)="removeData($event)"
|
343
|
-
>
|
344
|
-
<ng-template kendoGridToolbarTemplate>
|
345
|
-
<button
|
346
|
-
kendoButton
|
347
|
-
type="button"
|
348
|
-
[svgIcon]="plusIcon"
|
349
|
-
fillMode="flat"
|
350
|
-
rounded="medium"
|
351
|
-
[disabled]="isDisabled(grid)"
|
352
|
-
(click)="addData()"
|
353
|
-
>
|
354
|
-
{{ messageFor('configurationSeriesAdd') }}
|
355
|
-
</button>
|
356
|
-
</ng-template>
|
357
|
-
<kendo-grid-rowreorder-column [width]="40"></kendo-grid-rowreorder-column>
|
358
|
-
<kendo-grid-column field="name" title="">
|
359
|
-
</kendo-grid-column>
|
360
|
-
<kendo-grid-command-column [width]="40">
|
361
|
-
<ng-template kendoGridCellTemplate>
|
362
|
-
<button
|
363
|
-
[svgIcon]="trashIcon"
|
364
|
-
kendoGridRemoveCommand
|
365
|
-
fillMode="flat"
|
366
|
-
rounded="medium"
|
367
|
-
[disabled]="stateService.state.series.length < 2"
|
368
|
-
></button>
|
369
|
-
</ng-template>
|
370
|
-
</kendo-grid-command-column>
|
371
|
-
</kendo-grid>
|
372
|
-
</fieldset>
|
373
|
-
<fieldset
|
374
|
-
class="k-form-fieldset"
|
375
|
-
*ngIf="stateService.state.seriesType === 'pie'"
|
376
|
-
>
|
377
|
-
<legend class="k-form-legend">
|
378
|
-
{{ messageFor('configurationValueAxis') }}
|
379
|
-
</legend>
|
380
|
-
<kendo-dropdownlist
|
381
|
-
[data]="stateService.state.columns"
|
382
|
-
[value]="stateService.state.valueField"
|
383
|
-
(valueChange)="updateState(valueAxisY, $event)"
|
384
|
-
fillMode="outline"
|
385
|
-
rounded="medium"
|
386
|
-
size="medium"
|
387
|
-
>
|
388
|
-
</kendo-dropdownlist>
|
389
|
-
</fieldset>
|
390
|
-
</form>
|
391
|
-
</kendo-expansionpanel>
|
392
|
-
`,
|
393
|
-
standalone: true,
|
394
|
-
imports: [
|
395
|
-
ExpansionPanelComponent,
|
396
|
-
DropDownListComponent,
|
397
|
-
ValueTemplateDirective,
|
398
|
-
NgIf,
|
399
|
-
GridComponent,
|
400
|
-
ReactiveEditingDirective,
|
401
|
-
DataBindingDirective,
|
402
|
-
ToolbarTemplateDirective,
|
403
|
-
ButtonComponent,
|
404
|
-
RowReorderColumnComponent,
|
405
|
-
ColumnComponent,
|
406
|
-
CommandColumnComponent,
|
407
|
-
CellTemplateDirective,
|
408
|
-
GridToolbarFocusableDirective,
|
409
|
-
FocusableDirective,
|
410
|
-
RemoveCommandDirective
|
411
|
-
]
|
412
|
-
}]
|
413
|
-
}], ctorParameters: function () { return [{ type: StateService }, { type: i2.FormBuilder }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: ChartWizardLocalizationService }]; }, propDecorators: { grid: [{
|
414
|
-
type: ViewChild,
|
415
|
-
args: [GridComponent]
|
416
|
-
}] } });
|
417
|
-
|
418
|
-
/**
|
419
|
-
* @hidden
|
420
|
-
*/
|
421
|
-
class ChartWizardSeriesTypeButtonComponent {
|
422
|
-
constructor(stateService) {
|
423
|
-
this.stateService = stateService;
|
424
|
-
this.stack = false;
|
425
|
-
}
|
426
|
-
onSelect() {
|
427
|
-
this.stateService.seriesType = this.seriesType;
|
428
|
-
if (this.stateService.data.length > 0) {
|
429
|
-
this.stateService.state = mergeStates(this.stateService.state, createState(this.stateService.data, this.stateService.seriesType));
|
430
|
-
this.stateService.currentSeries = {};
|
431
|
-
if (this.stack) {
|
432
|
-
this.stateService.state = updateState(this.stateService.state, ActionTypes.stacked, this.stack);
|
433
|
-
}
|
434
|
-
}
|
435
|
-
this.stateService.dataTab.detectChanges();
|
436
|
-
}
|
437
|
-
isSelected() {
|
438
|
-
var _a;
|
439
|
-
return (this.stateService.state.seriesType === this.seriesType &&
|
440
|
-
((_a = this.stateService.state.series[0]) === null || _a === void 0 ? void 0 : _a.stack) === this.stack);
|
441
|
-
}
|
442
|
-
}
|
443
|
-
ChartWizardSeriesTypeButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardSeriesTypeButtonComponent, deps: [{ token: StateService }], target: i0.ɵɵFactoryTarget.Component });
|
444
|
-
ChartWizardSeriesTypeButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChartWizardSeriesTypeButtonComponent, isStandalone: true, selector: "kendo-chartwizard-series-type-button", inputs: { title: "title", chartTypeIcon: "chartTypeIcon", stack: "stack", seriesType: "seriesType" }, ngImport: i0, template: `
|
445
|
-
<div class="k-icon-text-wrapper" [class.k-selected]="isSelected()" (click)="onSelect()">
|
446
|
-
<div class="k-icon-background-area">
|
447
|
-
<kendo-svgicon [icon]="chartTypeIcon" size="xlarge" themeColor="primary"> </kendo-svgicon>
|
448
|
-
</div>
|
449
|
-
{{ title }}
|
450
|
-
</div>
|
451
|
-
`, isInline: true, dependencies: [{ kind: "component", type: SVGIconComponent, selector: "kendo-svg-icon, kendo-svgicon", inputs: ["icon"], exportAs: ["kendoSVGIcon"] }] });
|
452
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardSeriesTypeButtonComponent, decorators: [{
|
453
|
-
type: Component,
|
454
|
-
args: [{
|
455
|
-
selector: 'kendo-chartwizard-series-type-button',
|
456
|
-
template: `
|
457
|
-
<div class="k-icon-text-wrapper" [class.k-selected]="isSelected()" (click)="onSelect()">
|
458
|
-
<div class="k-icon-background-area">
|
459
|
-
<kendo-svgicon [icon]="chartTypeIcon" size="xlarge" themeColor="primary"> </kendo-svgicon>
|
460
|
-
</div>
|
461
|
-
{{ title }}
|
462
|
-
</div>
|
463
|
-
`,
|
464
|
-
standalone: true,
|
465
|
-
imports: [SVGIconComponent]
|
466
|
-
}]
|
467
|
-
}], ctorParameters: function () { return [{ type: StateService }]; }, propDecorators: { title: [{
|
468
|
-
type: Input
|
469
|
-
}], chartTypeIcon: [{
|
470
|
-
type: Input
|
471
|
-
}], stack: [{
|
472
|
-
type: Input
|
473
|
-
}], seriesType: [{
|
474
|
-
type: Input
|
475
|
-
}] } });
|
476
|
-
|
477
|
-
/**
|
478
|
-
* @hidden
|
479
|
-
*/
|
480
|
-
class ChartWizardPropertyPaneChartTabComponent {
|
481
|
-
constructor(stateService, cdr, localization) {
|
482
|
-
this.stateService = stateService;
|
483
|
-
this.cdr = cdr;
|
484
|
-
this.localization = localization;
|
485
|
-
this.exportIcon = exportIcon;
|
486
|
-
this.chartBarClusteredIcon = chartBarClusteredIcon;
|
487
|
-
this.chartBarStackedIcon = chartBarStackedIcon;
|
488
|
-
this.chartBarStacked100Icon = chartBarStacked100Icon;
|
489
|
-
this.chartPieIcon = chartPieIcon;
|
490
|
-
this.chartColumnClusteredIcon = chartColumnClusteredIcon;
|
491
|
-
this.chartColumnStackedIcon = chartColumnStackedIcon;
|
492
|
-
this.chartColumnStacked100Icon = chartColumnStacked100Icon;
|
493
|
-
this.chartLineIcon = chartLineIcon;
|
494
|
-
this.chartLineStackedIcon = chartLineStackedIcon;
|
495
|
-
this.chartLineStacked100Icon = chartLineStacked100Icon;
|
496
|
-
this.chartScatterIcon = chartScatterIcon;
|
497
|
-
}
|
498
|
-
ngAfterViewChecked() {
|
499
|
-
this.localization.changes.subscribe(() => {
|
500
|
-
this.detectChanges();
|
501
|
-
});
|
502
|
-
}
|
503
|
-
ngOnDestroy() {
|
504
|
-
this.localization.changes.unsubscribe();
|
505
|
-
}
|
506
|
-
detectChanges() {
|
507
|
-
this.cdr.detectChanges();
|
508
|
-
}
|
509
|
-
messageFor(key) {
|
510
|
-
return this.localization.get(key);
|
511
|
-
}
|
512
|
-
}
|
513
|
-
ChartWizardPropertyPaneChartTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardPropertyPaneChartTabComponent, deps: [{ token: StateService }, { token: i0.ChangeDetectorRef }, { token: ChartWizardLocalizationService }], target: i0.ɵɵFactoryTarget.Component });
|
514
|
-
ChartWizardPropertyPaneChartTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChartWizardPropertyPaneChartTabComponent, isStandalone: true, selector: "kendo-chartwizard-property-pane-chart-tab", ngImport: i0, template: `
|
515
|
-
<kendo-expansionpanel [title]="messageFor('barChart')" [expanded]="true">
|
516
|
-
<div class="k-chart-types-wrapper">
|
517
|
-
<kendo-chartwizard-series-type-button
|
518
|
-
[title]="messageFor('barChartBar')"
|
519
|
-
[chartTypeIcon]="chartBarClusteredIcon"
|
520
|
-
seriesType="bar"
|
521
|
-
[stack]="false"
|
522
|
-
>
|
523
|
-
</kendo-chartwizard-series-type-button>
|
524
|
-
<kendo-chartwizard-series-type-button
|
525
|
-
[title]="messageFor('barChartStackedBar')"
|
526
|
-
[chartTypeIcon]="chartBarStackedIcon"
|
527
|
-
seriesType="bar"
|
528
|
-
[stack]="true"
|
529
|
-
>
|
530
|
-
</kendo-chartwizard-series-type-button>
|
531
|
-
<kendo-chartwizard-series-type-button
|
532
|
-
[title]="messageFor('barChart100StackedBar')"
|
533
|
-
[chartTypeIcon]="chartBarStacked100Icon"
|
534
|
-
seriesType="bar"
|
535
|
-
[stack]="{ type: '100%' }"
|
536
|
-
>
|
537
|
-
</kendo-chartwizard-series-type-button>
|
538
|
-
</div>
|
539
|
-
</kendo-expansionpanel>
|
540
|
-
<kendo-expansionpanel [title]="messageFor('pieChart')" [expanded]="true">
|
541
|
-
<div class="k-chart-types-wrapper">
|
542
|
-
<kendo-chartwizard-series-type-button
|
543
|
-
[title]="messageFor('pieChartPie')"
|
544
|
-
[chartTypeIcon]="chartPieIcon"
|
545
|
-
seriesType="pie"
|
546
|
-
[stack]="undefined"
|
547
|
-
>
|
548
|
-
</kendo-chartwizard-series-type-button>
|
549
|
-
</div>
|
550
|
-
</kendo-expansionpanel>
|
551
|
-
<kendo-expansionpanel [title]="messageFor('columnChart')" [expanded]="true">
|
552
|
-
<div class="k-chart-types-wrapper">
|
553
|
-
<kendo-chartwizard-series-type-button
|
554
|
-
[title]="messageFor('columnChartColumn')"
|
555
|
-
[chartTypeIcon]="chartColumnClusteredIcon"
|
556
|
-
seriesType="column"
|
557
|
-
[stack]="false"
|
558
|
-
>
|
559
|
-
</kendo-chartwizard-series-type-button>
|
560
|
-
<kendo-chartwizard-series-type-button
|
561
|
-
[title]="messageFor('columnChartStackedColumn')"
|
562
|
-
[chartTypeIcon]="chartColumnStackedIcon"
|
563
|
-
seriesType="column"
|
564
|
-
[stack]="true"
|
565
|
-
>
|
566
|
-
</kendo-chartwizard-series-type-button>
|
567
|
-
<kendo-chartwizard-series-type-button
|
568
|
-
[title]="messageFor('columnChart100StackedColumn')"
|
569
|
-
[chartTypeIcon]="chartColumnStacked100Icon"
|
570
|
-
seriesType="column"
|
571
|
-
[stack]="{ type: '100%' }"
|
572
|
-
>
|
573
|
-
</kendo-chartwizard-series-type-button>
|
574
|
-
</div>
|
575
|
-
</kendo-expansionpanel>
|
576
|
-
<kendo-expansionpanel [title]="messageFor('lineChart')" [expanded]="true">
|
577
|
-
<div class="k-chart-types-wrapper">
|
578
|
-
<kendo-chartwizard-series-type-button
|
579
|
-
[title]="messageFor('lineChartLine')"
|
580
|
-
[chartTypeIcon]="chartLineIcon"
|
581
|
-
seriesType="line"
|
582
|
-
[stack]="false"
|
583
|
-
>
|
584
|
-
</kendo-chartwizard-series-type-button>
|
585
|
-
<kendo-chartwizard-series-type-button
|
586
|
-
[title]="messageFor('lineChartStackedLine')"
|
587
|
-
[chartTypeIcon]="chartLineStackedIcon"
|
588
|
-
seriesType="line"
|
589
|
-
[stack]="true"
|
590
|
-
>
|
591
|
-
</kendo-chartwizard-series-type-button>
|
592
|
-
<kendo-chartwizard-series-type-button
|
593
|
-
[title]="messageFor('lineChart100StackedLine')"
|
594
|
-
[chartTypeIcon]="chartLineStacked100Icon"
|
595
|
-
seriesType="line"
|
596
|
-
[stack]="{ type: '100%' }"
|
597
|
-
>
|
598
|
-
</kendo-chartwizard-series-type-button>
|
599
|
-
</div>
|
600
|
-
</kendo-expansionpanel>
|
601
|
-
<kendo-expansionpanel [title]="messageFor('scatterChart')" [expanded]="true">
|
602
|
-
<div class="k-chart-types-wrapper">
|
603
|
-
<kendo-chartwizard-series-type-button
|
604
|
-
[title]="messageFor('scatterChartScatter')"
|
605
|
-
[chartTypeIcon]="chartScatterIcon"
|
606
|
-
seriesType="scatter"
|
607
|
-
[stack]="false"
|
608
|
-
>
|
609
|
-
</kendo-chartwizard-series-type-button>
|
610
|
-
</div>
|
611
|
-
</kendo-expansionpanel>
|
612
|
-
`, isInline: true, dependencies: [{ kind: "component", type: ExpansionPanelComponent, selector: "kendo-expansionpanel", inputs: ["title", "subtitle", "disabled", "expanded", "svgExpandIcon", "svgCollapseIcon", "expandIcon", "collapseIcon", "animation"], outputs: ["expandedChange", "action", "expand", "collapse"], exportAs: ["kendoExpansionPanel"] }, { kind: "component", type: ChartWizardSeriesTypeButtonComponent, selector: "kendo-chartwizard-series-type-button", inputs: ["title", "chartTypeIcon", "stack", "seriesType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
613
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardPropertyPaneChartTabComponent, decorators: [{
|
614
|
-
type: Component,
|
615
|
-
args: [{
|
616
|
-
selector: 'kendo-chartwizard-property-pane-chart-tab',
|
617
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
618
|
-
template: `
|
619
|
-
<kendo-expansionpanel [title]="messageFor('barChart')" [expanded]="true">
|
620
|
-
<div class="k-chart-types-wrapper">
|
621
|
-
<kendo-chartwizard-series-type-button
|
622
|
-
[title]="messageFor('barChartBar')"
|
623
|
-
[chartTypeIcon]="chartBarClusteredIcon"
|
624
|
-
seriesType="bar"
|
625
|
-
[stack]="false"
|
626
|
-
>
|
627
|
-
</kendo-chartwizard-series-type-button>
|
628
|
-
<kendo-chartwizard-series-type-button
|
629
|
-
[title]="messageFor('barChartStackedBar')"
|
630
|
-
[chartTypeIcon]="chartBarStackedIcon"
|
631
|
-
seriesType="bar"
|
632
|
-
[stack]="true"
|
633
|
-
>
|
634
|
-
</kendo-chartwizard-series-type-button>
|
635
|
-
<kendo-chartwizard-series-type-button
|
636
|
-
[title]="messageFor('barChart100StackedBar')"
|
637
|
-
[chartTypeIcon]="chartBarStacked100Icon"
|
638
|
-
seriesType="bar"
|
639
|
-
[stack]="{ type: '100%' }"
|
640
|
-
>
|
641
|
-
</kendo-chartwizard-series-type-button>
|
642
|
-
</div>
|
643
|
-
</kendo-expansionpanel>
|
644
|
-
<kendo-expansionpanel [title]="messageFor('pieChart')" [expanded]="true">
|
645
|
-
<div class="k-chart-types-wrapper">
|
646
|
-
<kendo-chartwizard-series-type-button
|
647
|
-
[title]="messageFor('pieChartPie')"
|
648
|
-
[chartTypeIcon]="chartPieIcon"
|
649
|
-
seriesType="pie"
|
650
|
-
[stack]="undefined"
|
651
|
-
>
|
652
|
-
</kendo-chartwizard-series-type-button>
|
653
|
-
</div>
|
654
|
-
</kendo-expansionpanel>
|
655
|
-
<kendo-expansionpanel [title]="messageFor('columnChart')" [expanded]="true">
|
656
|
-
<div class="k-chart-types-wrapper">
|
657
|
-
<kendo-chartwizard-series-type-button
|
658
|
-
[title]="messageFor('columnChartColumn')"
|
659
|
-
[chartTypeIcon]="chartColumnClusteredIcon"
|
660
|
-
seriesType="column"
|
661
|
-
[stack]="false"
|
662
|
-
>
|
663
|
-
</kendo-chartwizard-series-type-button>
|
664
|
-
<kendo-chartwizard-series-type-button
|
665
|
-
[title]="messageFor('columnChartStackedColumn')"
|
666
|
-
[chartTypeIcon]="chartColumnStackedIcon"
|
667
|
-
seriesType="column"
|
668
|
-
[stack]="true"
|
669
|
-
>
|
670
|
-
</kendo-chartwizard-series-type-button>
|
671
|
-
<kendo-chartwizard-series-type-button
|
672
|
-
[title]="messageFor('columnChart100StackedColumn')"
|
673
|
-
[chartTypeIcon]="chartColumnStacked100Icon"
|
674
|
-
seriesType="column"
|
675
|
-
[stack]="{ type: '100%' }"
|
676
|
-
>
|
677
|
-
</kendo-chartwizard-series-type-button>
|
678
|
-
</div>
|
679
|
-
</kendo-expansionpanel>
|
680
|
-
<kendo-expansionpanel [title]="messageFor('lineChart')" [expanded]="true">
|
681
|
-
<div class="k-chart-types-wrapper">
|
682
|
-
<kendo-chartwizard-series-type-button
|
683
|
-
[title]="messageFor('lineChartLine')"
|
684
|
-
[chartTypeIcon]="chartLineIcon"
|
685
|
-
seriesType="line"
|
686
|
-
[stack]="false"
|
687
|
-
>
|
688
|
-
</kendo-chartwizard-series-type-button>
|
689
|
-
<kendo-chartwizard-series-type-button
|
690
|
-
[title]="messageFor('lineChartStackedLine')"
|
691
|
-
[chartTypeIcon]="chartLineStackedIcon"
|
692
|
-
seriesType="line"
|
693
|
-
[stack]="true"
|
694
|
-
>
|
695
|
-
</kendo-chartwizard-series-type-button>
|
696
|
-
<kendo-chartwizard-series-type-button
|
697
|
-
[title]="messageFor('lineChart100StackedLine')"
|
698
|
-
[chartTypeIcon]="chartLineStacked100Icon"
|
699
|
-
seriesType="line"
|
700
|
-
[stack]="{ type: '100%' }"
|
701
|
-
>
|
702
|
-
</kendo-chartwizard-series-type-button>
|
703
|
-
</div>
|
704
|
-
</kendo-expansionpanel>
|
705
|
-
<kendo-expansionpanel [title]="messageFor('scatterChart')" [expanded]="true">
|
706
|
-
<div class="k-chart-types-wrapper">
|
707
|
-
<kendo-chartwizard-series-type-button
|
708
|
-
[title]="messageFor('scatterChartScatter')"
|
709
|
-
[chartTypeIcon]="chartScatterIcon"
|
710
|
-
seriesType="scatter"
|
711
|
-
[stack]="false"
|
712
|
-
>
|
713
|
-
</kendo-chartwizard-series-type-button>
|
714
|
-
</div>
|
715
|
-
</kendo-expansionpanel>
|
716
|
-
`,
|
717
|
-
standalone: true,
|
718
|
-
imports: [ExpansionPanelComponent, ChartWizardSeriesTypeButtonComponent]
|
719
|
-
}]
|
720
|
-
}], ctorParameters: function () { return [{ type: StateService }, { type: i0.ChangeDetectorRef }, { type: ChartWizardLocalizationService }]; } });
|
721
|
-
|
722
|
-
/**
|
723
|
-
* @hidden
|
724
|
-
*/
|
725
|
-
class PreventableEvent {
|
726
|
-
constructor() {
|
727
|
-
this.prevented = false;
|
728
|
-
}
|
729
|
-
/**
|
730
|
-
* Prevents the default action for a specified event.
|
731
|
-
* In this way, the source component suppresses
|
732
|
-
* the built-in behavior that follows the event.
|
733
|
-
*/
|
734
|
-
preventDefault() {
|
735
|
-
this.prevented = true;
|
736
|
-
}
|
737
|
-
/**
|
738
|
-
* Returns `true` if the event was prevented
|
739
|
-
* by any of its subscribers.
|
740
|
-
*
|
741
|
-
* @returns `true` if the default action was prevented.
|
742
|
-
* Otherwise, returns `false`.
|
743
|
-
*/
|
744
|
-
isDefaultPrevented() {
|
745
|
-
return this.prevented;
|
746
|
-
}
|
747
|
-
}
|
748
|
-
|
749
|
-
/**
|
750
|
-
* Arguments for the `export` event on the Chart Wizard.
|
751
|
-
*/
|
752
|
-
class ExportEvent extends PreventableEvent {
|
753
|
-
/**
|
754
|
-
* @hidden
|
755
|
-
*/
|
756
|
-
constructor(chart, exportOptions) {
|
757
|
-
super();
|
758
|
-
this.chart = chart;
|
759
|
-
this.exportOptions = exportOptions;
|
760
|
-
}
|
761
|
-
}
|
762
|
-
|
763
|
-
/**
|
764
|
-
* @hidden
|
765
|
-
*/
|
766
|
-
class ChartWizardPropertyPaneFormFieldComponent {
|
767
|
-
constructor(localization, cdr) {
|
768
|
-
this.localization = localization;
|
769
|
-
this.cdr = cdr;
|
770
|
-
this.colSpan = 1;
|
771
|
-
this.hasLabel = true;
|
772
|
-
this.isLabelInsideFormFieldWrap = false;
|
773
|
-
this.disabled = false;
|
774
|
-
this.valueChange = new EventEmitter();
|
775
|
-
this.formField = true;
|
776
|
-
}
|
777
|
-
get isColSpan2() {
|
778
|
-
return this.colSpan === 2;
|
779
|
-
}
|
780
|
-
ngAfterViewChecked() {
|
781
|
-
this.localization.changes.subscribe(() => {
|
782
|
-
this.cdr.detectChanges();
|
783
|
-
});
|
784
|
-
}
|
785
|
-
ngOnDestroy() {
|
786
|
-
this.localization.changes.unsubscribe();
|
787
|
-
}
|
788
|
-
ngAfterViewInit() {
|
789
|
-
if (this.hasLabel) {
|
790
|
-
this.label.for =
|
791
|
-
this.numericTextBox ||
|
792
|
-
this.colorPicker ||
|
793
|
-
this.dropDownList ||
|
794
|
-
this.textBox ||
|
795
|
-
this.comboBox ||
|
796
|
-
this.checkBox;
|
797
|
-
}
|
798
|
-
}
|
799
|
-
}
|
800
|
-
ChartWizardPropertyPaneFormFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardPropertyPaneFormFieldComponent, deps: [{ token: i1.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
801
|
-
ChartWizardPropertyPaneFormFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChartWizardPropertyPaneFormFieldComponent, isStandalone: true, selector: "kendo-chartwizard-property-pane-form-field", inputs: { currentState: "currentState", action: "action", class: "class", inputType: "inputType", text: "text", data: "data", placeholder: "placeholder", colSpan: "colSpan", hasLabel: "hasLabel", isLabelInsideFormFieldWrap: "isLabelInsideFormFieldWrap", value: "value", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.k-form-field": "this.formField", "class.k-col-span-2": "this.isColSpan2" } }, viewQueries: [{ propertyName: "label", first: true, predicate: LabelComponent, descendants: true }, { propertyName: "numericTextBox", first: true, predicate: NumericTextBoxComponent, descendants: true }, { propertyName: "colorPicker", first: true, predicate: ColorPickerComponent, descendants: true }, { propertyName: "dropDownList", first: true, predicate: DropDownListComponent, descendants: true }, { propertyName: "textBox", first: true, predicate: TextBoxComponent, descendants: true }, { propertyName: "comboBox", first: true, predicate: ComboBoxComponent, descendants: true }, { propertyName: "checkBox", first: true, predicate: CheckBoxComponent, descendants: true }], ngImport: i0, template: `
|
802
|
-
<kendo-label *ngIf="hasLabel && !isLabelInsideFormFieldWrap && inputType !== 'checkbox'" class="k-form-label" [text]="text"></kendo-label>
|
803
|
-
<div class="k-form-field-wrap">
|
804
|
-
<kendo-label
|
805
|
-
*ngIf="hasLabel && isLabelInsideFormFieldWrap && inputType !== 'checkbox'"
|
806
|
-
class="k-form-label"
|
807
|
-
[text]="text"
|
808
|
-
></kendo-label>
|
809
|
-
<kendo-numerictextbox
|
810
|
-
*ngIf="inputType === 'numeric'"
|
811
|
-
fillMode="outline"
|
812
|
-
rounded="medium"
|
813
|
-
[value]="value"
|
814
|
-
(valueChange)="valueChange.emit($event)"
|
815
|
-
[placeholder]="placeholder"
|
816
|
-
></kendo-numerictextbox>
|
817
|
-
<kendo-colorpicker
|
818
|
-
*ngIf="inputType === 'colorPicker'"
|
819
|
-
fillMode="outline"
|
820
|
-
rounded="medium"
|
821
|
-
[value]="value"
|
822
|
-
[disabled]="disabled"
|
823
|
-
(valueChange)="valueChange.emit($event)"
|
824
|
-
></kendo-colorpicker>
|
825
|
-
<kendo-dropdownlist
|
826
|
-
*ngIf="inputType === 'dropDownList'"
|
827
|
-
[data]="data"
|
828
|
-
textField="text"
|
829
|
-
valueField="value"
|
830
|
-
[valuePrimitive]="true"
|
831
|
-
fillMode="outline"
|
832
|
-
rounded="medium"
|
833
|
-
size="medium"
|
834
|
-
[value]="value"
|
835
|
-
(valueChange)="valueChange.emit($event)"
|
836
|
-
></kendo-dropdownlist>
|
837
|
-
<kendo-combobox
|
838
|
-
*ngIf="inputType === 'comboBox'"
|
839
|
-
[data]="data"
|
840
|
-
[value]="value"
|
841
|
-
textField="text"
|
842
|
-
valueField="value"
|
843
|
-
[valuePrimitive]="true"
|
844
|
-
fillMode="outline"
|
845
|
-
rounded="medium"
|
846
|
-
size="medium"
|
847
|
-
[placeholder]="placeholder"
|
848
|
-
(valueChange)="valueChange.emit($event)"
|
849
|
-
></kendo-combobox>
|
850
|
-
<kendo-textbox
|
851
|
-
*ngIf="inputType === 'text'"
|
852
|
-
fillMode="outline"
|
853
|
-
rounded="medium"
|
854
|
-
[placeholder]="placeholder"
|
855
|
-
[value]="value"
|
856
|
-
(valueChange)="valueChange.emit($event)"
|
857
|
-
></kendo-textbox>
|
858
|
-
<kendo-checkbox
|
859
|
-
*ngIf="inputType === 'checkbox'"
|
860
|
-
class="k-checkbox-md k-rounded-md"
|
861
|
-
[checkedState]="value"
|
862
|
-
(checkedStateChange)="valueChange.emit($event)"
|
863
|
-
></kendo-checkbox>
|
864
|
-
<kendo-label
|
865
|
-
*ngIf="hasLabel && isLabelInsideFormFieldWrap && inputType === 'checkbox'"
|
866
|
-
class="k-checkbox-label"
|
867
|
-
[text]="text"
|
868
|
-
></kendo-label>
|
869
|
-
</div>
|
870
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { kind: "component", type: NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoNumericTextBox"] }, { kind: "component", type: ColorPickerComponent, selector: "kendo-colorpicker", inputs: ["views", "view", "activeView", "readonly", "disabled", "format", "value", "popupSettings", "paletteSettings", "gradientSettings", "icon", "iconClass", "svgIcon", "clearButton", "tabindex", "preview", "actionsLayout", "size", "rounded", "fillMode"], outputs: ["valueChange", "open", "close", "focus", "blur", "cancel", "activeColorClick", "clearButtonClick", "activeViewChange"], exportAs: ["kendoColorPicker"] }, { kind: "component", type: DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "component", type: ComboBoxComponent, selector: "kendo-combobox", inputs: ["icon", "svgIcon", "inputAttributes", "showStickyHeader", "focusableId", "allowCustom", "data", "value", "textField", "valueField", "valuePrimitive", "valueNormalizer", "placeholder", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "loading", "suggest", "clearButton", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode"], outputs: ["valueChange", "selectionChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur", "escape"], exportAs: ["kendoComboBox"] }, { kind: "component", type: TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "component", type: CheckBoxComponent, selector: "kendo-checkbox", inputs: ["checkedState", "rounded"], outputs: ["checkedStateChange"], exportAs: ["kendoCheckBox"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
871
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardPropertyPaneFormFieldComponent, decorators: [{
|
872
|
-
type: Component,
|
873
|
-
args: [{
|
874
|
-
selector: 'kendo-chartwizard-property-pane-form-field',
|
875
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
876
|
-
template: `
|
877
|
-
<kendo-label *ngIf="hasLabel && !isLabelInsideFormFieldWrap && inputType !== 'checkbox'" class="k-form-label" [text]="text"></kendo-label>
|
878
|
-
<div class="k-form-field-wrap">
|
879
|
-
<kendo-label
|
880
|
-
*ngIf="hasLabel && isLabelInsideFormFieldWrap && inputType !== 'checkbox'"
|
881
|
-
class="k-form-label"
|
882
|
-
[text]="text"
|
883
|
-
></kendo-label>
|
884
|
-
<kendo-numerictextbox
|
885
|
-
*ngIf="inputType === 'numeric'"
|
886
|
-
fillMode="outline"
|
887
|
-
rounded="medium"
|
888
|
-
[value]="value"
|
889
|
-
(valueChange)="valueChange.emit($event)"
|
890
|
-
[placeholder]="placeholder"
|
891
|
-
></kendo-numerictextbox>
|
892
|
-
<kendo-colorpicker
|
893
|
-
*ngIf="inputType === 'colorPicker'"
|
894
|
-
fillMode="outline"
|
895
|
-
rounded="medium"
|
896
|
-
[value]="value"
|
897
|
-
[disabled]="disabled"
|
898
|
-
(valueChange)="valueChange.emit($event)"
|
899
|
-
></kendo-colorpicker>
|
900
|
-
<kendo-dropdownlist
|
901
|
-
*ngIf="inputType === 'dropDownList'"
|
902
|
-
[data]="data"
|
903
|
-
textField="text"
|
904
|
-
valueField="value"
|
905
|
-
[valuePrimitive]="true"
|
906
|
-
fillMode="outline"
|
907
|
-
rounded="medium"
|
908
|
-
size="medium"
|
909
|
-
[value]="value"
|
910
|
-
(valueChange)="valueChange.emit($event)"
|
911
|
-
></kendo-dropdownlist>
|
912
|
-
<kendo-combobox
|
913
|
-
*ngIf="inputType === 'comboBox'"
|
914
|
-
[data]="data"
|
915
|
-
[value]="value"
|
916
|
-
textField="text"
|
917
|
-
valueField="value"
|
918
|
-
[valuePrimitive]="true"
|
919
|
-
fillMode="outline"
|
920
|
-
rounded="medium"
|
921
|
-
size="medium"
|
922
|
-
[placeholder]="placeholder"
|
923
|
-
(valueChange)="valueChange.emit($event)"
|
924
|
-
></kendo-combobox>
|
925
|
-
<kendo-textbox
|
926
|
-
*ngIf="inputType === 'text'"
|
927
|
-
fillMode="outline"
|
928
|
-
rounded="medium"
|
929
|
-
[placeholder]="placeholder"
|
930
|
-
[value]="value"
|
931
|
-
(valueChange)="valueChange.emit($event)"
|
932
|
-
></kendo-textbox>
|
933
|
-
<kendo-checkbox
|
934
|
-
*ngIf="inputType === 'checkbox'"
|
935
|
-
class="k-checkbox-md k-rounded-md"
|
936
|
-
[checkedState]="value"
|
937
|
-
(checkedStateChange)="valueChange.emit($event)"
|
938
|
-
></kendo-checkbox>
|
939
|
-
<kendo-label
|
940
|
-
*ngIf="hasLabel && isLabelInsideFormFieldWrap && inputType === 'checkbox'"
|
941
|
-
class="k-checkbox-label"
|
942
|
-
[text]="text"
|
943
|
-
></kendo-label>
|
944
|
-
</div>
|
945
|
-
`,
|
946
|
-
standalone: true,
|
947
|
-
imports: [
|
948
|
-
NgIf,
|
949
|
-
LabelComponent,
|
950
|
-
NumericTextBoxComponent,
|
951
|
-
ColorPickerComponent,
|
952
|
-
DropDownListComponent,
|
953
|
-
ComboBoxComponent,
|
954
|
-
TextBoxComponent,
|
955
|
-
CheckBoxComponent
|
956
|
-
]
|
957
|
-
}]
|
958
|
-
}], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { currentState: [{
|
959
|
-
type: Input
|
960
|
-
}], action: [{
|
961
|
-
type: Input
|
962
|
-
}], class: [{
|
963
|
-
type: Input
|
964
|
-
}], inputType: [{
|
965
|
-
type: Input
|
966
|
-
}], text: [{
|
967
|
-
type: Input
|
968
|
-
}], data: [{
|
969
|
-
type: Input
|
970
|
-
}], placeholder: [{
|
971
|
-
type: Input
|
972
|
-
}], colSpan: [{
|
973
|
-
type: Input
|
974
|
-
}], hasLabel: [{
|
975
|
-
type: Input
|
976
|
-
}], isLabelInsideFormFieldWrap: [{
|
977
|
-
type: Input
|
978
|
-
}], value: [{
|
979
|
-
type: Input
|
980
|
-
}], disabled: [{
|
981
|
-
type: Input
|
982
|
-
}], valueChange: [{
|
983
|
-
type: Output
|
984
|
-
}], formField: [{
|
985
|
-
type: HostBinding,
|
986
|
-
args: ['class.k-form-field']
|
987
|
-
}], isColSpan2: [{
|
988
|
-
type: HostBinding,
|
989
|
-
args: ['class.k-col-span-2']
|
990
|
-
}], label: [{
|
991
|
-
type: ViewChild,
|
992
|
-
args: [LabelComponent]
|
993
|
-
}], numericTextBox: [{
|
994
|
-
type: ViewChild,
|
995
|
-
args: [NumericTextBoxComponent]
|
996
|
-
}], colorPicker: [{
|
997
|
-
type: ViewChild,
|
998
|
-
args: [ColorPickerComponent]
|
999
|
-
}], dropDownList: [{
|
1000
|
-
type: ViewChild,
|
1001
|
-
args: [DropDownListComponent]
|
1002
|
-
}], textBox: [{
|
1003
|
-
type: ViewChild,
|
1004
|
-
args: [TextBoxComponent]
|
1005
|
-
}], comboBox: [{
|
1006
|
-
type: ViewChild,
|
1007
|
-
args: [ComboBoxComponent]
|
1008
|
-
}], checkBox: [{
|
1009
|
-
type: ViewChild,
|
1010
|
-
args: [CheckBoxComponent]
|
1011
|
-
}] } });
|
1012
|
-
|
1013
|
-
/**
|
1014
|
-
* @hidden
|
1015
|
-
*/
|
1016
|
-
class ChartWizardPropertyPaneFormatTabComponent {
|
1017
|
-
constructor(stateService, localization, cdr) {
|
1018
|
-
this.stateService = stateService;
|
1019
|
-
this.localization = localization;
|
1020
|
-
this.cdr = cdr;
|
1021
|
-
this.chartTitles = [
|
1022
|
-
{ text: this.messageFor('formatTitleChartTitle'), value: 'Chart Title' },
|
1023
|
-
{ text: this.messageFor('formatTitleChartSubtitle'), value: 'Chart Subtitle' },
|
1024
|
-
];
|
1025
|
-
this.areaMarginLeft = ActionTypes.areaMarginLeft;
|
1026
|
-
this.areaMarginRight = ActionTypes.areaMarginRight;
|
1027
|
-
this.areaMarginTop = ActionTypes.areaMarginTop;
|
1028
|
-
this.areaMarginBottom = ActionTypes.areaMarginBottom;
|
1029
|
-
this.areaBackground = ActionTypes.areaBackground;
|
1030
|
-
this.legendVisible = ActionTypes.legendVisible;
|
1031
|
-
this.legendFontName = ActionTypes.legendFontName;
|
1032
|
-
this.legendFontSize = ActionTypes.legendFontSize;
|
1033
|
-
this.legendColor = ActionTypes.legendColor;
|
1034
|
-
this.legendPosition = ActionTypes.legendPosition;
|
1035
|
-
this.categoryAxisTitleText = ActionTypes.categoryAxisTitleText;
|
1036
|
-
this.categoryAxisTitleFontName = ActionTypes.categoryAxisTitleFontName;
|
1037
|
-
this.categoryAxisTitleFontSize = ActionTypes.categoryAxisTitleFontSize;
|
1038
|
-
this.categoryAxisTitleColor = ActionTypes.categoryAxisTitleColor;
|
1039
|
-
this.categoryAxisLabelsFontName = ActionTypes.categoryAxisLabelsFontName;
|
1040
|
-
this.categoryAxisLabelsFontSize = ActionTypes.categoryAxisLabelsFontSize;
|
1041
|
-
this.categoryAxisLabelsColor = ActionTypes.categoryAxisLabelsColor;
|
1042
|
-
this.categoryAxisLabelsRotation = ActionTypes.categoryAxisLabelsRotation;
|
1043
|
-
this.categoryAxisReverseOrder = ActionTypes.categoryAxisReverseOrder;
|
1044
|
-
this.valueAxisTitleText = ActionTypes.valueAxisTitleText;
|
1045
|
-
this.valueAxisTitleFontName = ActionTypes.valueAxisTitleFontName;
|
1046
|
-
this.valueAxisTitleFontSize = ActionTypes.valueAxisTitleFontSize;
|
1047
|
-
this.valueAxisTitleColor = ActionTypes.valueAxisTitleColor;
|
1048
|
-
this.valueAxisLabelsFontName = ActionTypes.valueAxisLabelsFontName;
|
1049
|
-
this.valueAxisLabelsFormat = ActionTypes.valueAxisLabelsFormat;
|
1050
|
-
this.valueAxisLabelsFontSize = ActionTypes.valueAxisLabelsFontSize;
|
1051
|
-
this.valueAxisLabelsColor = ActionTypes.valueAxisLabelsColor;
|
1052
|
-
this.valueAxisLabelsRotation = ActionTypes.valueAxisLabelsRotation;
|
1053
|
-
this.parseFont = parseFont;
|
1054
|
-
this.defaultAllSeriesItem = defaultAllSeriesItem;
|
1055
|
-
this.fontNames = fontNames;
|
1056
|
-
this.fontSizes = fontSizes;
|
1057
|
-
this.labelFormats = [
|
1058
|
-
{ value: '', text: this.messageFor('formatValueAxisLabelsFormatText') },
|
1059
|
-
{ value: 'n0', text: this.messageFor('formatValueAxisLabelsFormatNumber') },
|
1060
|
-
{ value: 'c0', text: this.messageFor('formatValueAxisLabelsFormatCurrency') },
|
1061
|
-
{ value: 'p0', text: this.messageFor('formatValueAxisLabelsFormatPercent') }
|
1062
|
-
];
|
1063
|
-
this.legendPositions = [
|
1064
|
-
{ text: this.messageFor('formatLegendPositionTop'), value: 'top' },
|
1065
|
-
{ text: this.messageFor('formatLegendPositionBottom'), value: 'bottom' },
|
1066
|
-
{ text: this.messageFor('formatLegendPositionLeft'), value: 'left' },
|
1067
|
-
{ text: this.messageFor('formatLegendPositionRight'), value: 'right' }
|
1068
|
-
];
|
1069
|
-
this.labelsCategoryAxisRotation = [
|
1070
|
-
{ text: this.messageFor('formatCategoryAxisLabelsRotationAuto'), value: 'auto' },
|
1071
|
-
{ text: '0°', value: 0 },
|
1072
|
-
{ text: '45°', value: 45 },
|
1073
|
-
{ text: '90°', value: 90 },
|
1074
|
-
{ text: '135°', value: 135 },
|
1075
|
-
{ text: '180°', value: 180 }
|
1076
|
-
];
|
1077
|
-
this.labelsValueAxisRotation = [
|
1078
|
-
{ text: this.messageFor('formatValueAxisLabelsRotationAuto'), value: 'auto' },
|
1079
|
-
{ text: '0°', value: 0 },
|
1080
|
-
{ text: '45°', value: 45 },
|
1081
|
-
{ text: '90°', value: 90 },
|
1082
|
-
{ text: '135°', value: 135 },
|
1083
|
-
{ text: '180°', value: 180 }
|
1084
|
-
];
|
1085
|
-
}
|
1086
|
-
get chartTitleTypeText() {
|
1087
|
-
var _a, _b;
|
1088
|
-
return this.stateService.currentTitle === 'Chart Title'
|
1089
|
-
? (_a = this.stateService.state.title) === null || _a === void 0 ? void 0 : _a.text
|
1090
|
-
: (_b = this.stateService.state.subtitle) === null || _b === void 0 ? void 0 : _b.text;
|
1091
|
-
}
|
1092
|
-
get chartTitleTypeFont() {
|
1093
|
-
var _a, _b;
|
1094
|
-
return this.stateService.currentTitle === 'Chart Title'
|
1095
|
-
? parseFont((_a = this.stateService.state.title) === null || _a === void 0 ? void 0 : _a.font).name
|
1096
|
-
: parseFont((_b = this.stateService.state.subtitle) === null || _b === void 0 ? void 0 : _b.font).name;
|
1097
|
-
}
|
1098
|
-
get chartTitleTypeFontSize() {
|
1099
|
-
var _a, _b;
|
1100
|
-
return this.stateService.currentTitle === 'Chart Title'
|
1101
|
-
? parseFont((_a = this.stateService.state.title) === null || _a === void 0 ? void 0 : _a.font).size
|
1102
|
-
: parseFont((_b = this.stateService.state.subtitle) === null || _b === void 0 ? void 0 : _b.font).size;
|
1103
|
-
}
|
1104
|
-
get chartTitleTypeColor() {
|
1105
|
-
var _a, _b;
|
1106
|
-
return this.stateService.currentTitle === 'Chart Title'
|
1107
|
-
? (_a = this.stateService.state.title) === null || _a === void 0 ? void 0 : _a.color
|
1108
|
-
: (_b = this.stateService.state.subtitle) === null || _b === void 0 ? void 0 : _b.color;
|
1109
|
-
}
|
1110
|
-
get chartTitleTypeAction() {
|
1111
|
-
return this.stateService.currentTitle === 'Chart Title' ? ActionTypes.titleText : ActionTypes.subtitleText;
|
1112
|
-
}
|
1113
|
-
get chartTitleTypeFontAction() {
|
1114
|
-
return this.stateService.currentTitle === 'Chart Title' ? ActionTypes.titleFontName : ActionTypes.subtitleFontName;
|
1115
|
-
}
|
1116
|
-
get chartTitleTypeColorAction() {
|
1117
|
-
return this.stateService.currentTitle === 'Chart Title' ? ActionTypes.titleColor : ActionTypes.subtitleColor;
|
1118
|
-
}
|
1119
|
-
get chartTitleTypeFontSizeAction() {
|
1120
|
-
return this.stateService.currentTitle === 'Chart Title' ? ActionTypes.titleFontSize : ActionTypes.subtitleFontSize;
|
1121
|
-
}
|
1122
|
-
get seriesData() {
|
1123
|
-
return [
|
1124
|
-
{ text: this.messageFor('formatSeriesAllSeries'), name: 'All Series' },
|
1125
|
-
...this.stateService.state.series.map(item => (Object.assign({ text: item.name }, item)))
|
1126
|
-
];
|
1127
|
-
}
|
1128
|
-
get showLabels() {
|
1129
|
-
var _a, _b;
|
1130
|
-
return this.stateService.currentSeries.name !== defaultAllSeriesItem.name ? (_b = (_a = this.stateService.state.series.find(s => s.name === this.stateService.currentSeries.name)) === null || _a === void 0 ? void 0 : _a.labels) === null || _b === void 0 ? void 0 : _b.visible : this.stateService.state.series.every(s => { var _a; return (_a = s.labels) === null || _a === void 0 ? void 0 : _a.visible; });
|
1131
|
-
}
|
1132
|
-
get labelFormatValue() {
|
1133
|
-
var _a;
|
1134
|
-
return ((_a = labelFormats.find(f => { var _a, _b; return f.value === ((_b = (_a = this.stateService.state.valueAxis[0]) === null || _a === void 0 ? void 0 : _a.labels) === null || _b === void 0 ? void 0 : _b.format); })) === null || _a === void 0 ? void 0 : _a.value) || defaultFormat.value;
|
1135
|
-
}
|
1136
|
-
ngAfterViewChecked() {
|
1137
|
-
this.localization.changes.subscribe(() => {
|
1138
|
-
this.cdr.detectChanges();
|
1139
|
-
});
|
1140
|
-
}
|
1141
|
-
ngOnDestroy() {
|
1142
|
-
this.localization.changes.unsubscribe();
|
1143
|
-
}
|
1144
|
-
updateState(action, value) {
|
1145
|
-
if (action === ActionTypes.seriesLabel && this.stateService.currentSeries.name === defaultAllSeriesItem.name) {
|
1146
|
-
this.stateService.state = updateState(this.stateService.state, action, { name: '', all: true, visible: value.labels.visible });
|
1147
|
-
return;
|
1148
|
-
}
|
1149
|
-
this.stateService.state = updateState(this.stateService.state, action, value);
|
1150
|
-
}
|
1151
|
-
changeCurrentTitle(value) {
|
1152
|
-
this.stateService.currentTitle = value;
|
1153
|
-
}
|
1154
|
-
toggleSeriesLabels(value) {
|
1155
|
-
this.updateCurrentSeries(this.stateService.currentSeries);
|
1156
|
-
this.stateService.currentSeries.labels = { visible: value };
|
1157
|
-
this.updateState(ActionTypes.seriesLabel, this.stateService.currentSeries);
|
1158
|
-
}
|
1159
|
-
updateCurrentSeries(value) {
|
1160
|
-
if (value.name === defaultAllSeriesItem.name) {
|
1161
|
-
this.stateService.currentSeries = defaultAllSeriesItem;
|
1162
|
-
}
|
1163
|
-
else {
|
1164
|
-
this.stateService.currentSeries = this.stateService.state.series.find((series) => series.name === value.name);
|
1165
|
-
}
|
1166
|
-
}
|
1167
|
-
updateSeriesColor(value) {
|
1168
|
-
this.updateCurrentSeries(this.stateService.currentSeries);
|
1169
|
-
this.stateService.currentSeries.color = value;
|
1170
|
-
this.updateState(ActionTypes.seriesColor, this.stateService.currentSeries);
|
1171
|
-
}
|
1172
|
-
messageFor(key) {
|
1173
|
-
return this.localization.get(key);
|
1174
|
-
}
|
1175
|
-
}
|
1176
|
-
ChartWizardPropertyPaneFormatTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardPropertyPaneFormatTabComponent, deps: [{ token: StateService }, { token: ChartWizardLocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
1177
|
-
ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChartWizardPropertyPaneFormatTabComponent, isStandalone: true, selector: "kendo-chartwizard-property-pane-format-tab", ngImport: i0, template: `
|
1178
|
-
<section>
|
1179
|
-
<kendo-expansionpanel
|
1180
|
-
[style.max-width.px]="576"
|
1181
|
-
[title]="messageFor('formatChartArea')"
|
1182
|
-
[expanded]="true"
|
1183
|
-
[attr.dir]="stateService.direction"
|
1184
|
-
>
|
1185
|
-
<form class="k-form k-form-md">
|
1186
|
-
<fieldset class="k-form-fieldset">
|
1187
|
-
<legend class="k-form-legend">{{ messageFor('formatChartAreaMargins') }}</legend>
|
1188
|
-
<div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
|
1189
|
-
<kendo-chartwizard-property-pane-form-field
|
1190
|
-
[text]="messageFor('formatChartAreaMarginsLeft')"
|
1191
|
-
inputType="numeric"
|
1192
|
-
[placeholder]="messageFor('formatChartAreaMarginsAuto')"
|
1193
|
-
[value]="$any(stateService.state.area.margin).left"
|
1194
|
-
(valueChange)="updateState(areaMarginLeft, $event)"
|
1195
|
-
>
|
1196
|
-
</kendo-chartwizard-property-pane-form-field>
|
1197
|
-
<kendo-chartwizard-property-pane-form-field
|
1198
|
-
[text]="messageFor('formatChartAreaMarginsRight')"
|
1199
|
-
inputType="numeric"
|
1200
|
-
[placeholder]="messageFor('formatChartAreaMarginsAuto')"
|
1201
|
-
[value]="$any(stateService.state.area.margin).right"
|
1202
|
-
(valueChange)="updateState(areaMarginRight, $event)"
|
1203
|
-
>
|
1204
|
-
</kendo-chartwizard-property-pane-form-field>
|
1205
|
-
<kendo-chartwizard-property-pane-form-field
|
1206
|
-
[text]="messageFor('formatChartAreaMarginsTop')"
|
1207
|
-
inputType="numeric"
|
1208
|
-
[placeholder]="messageFor('formatChartAreaMarginsAuto')"
|
1209
|
-
[value]="$any(stateService.state.area.margin).top"
|
1210
|
-
(valueChange)="updateState(areaMarginTop, $event)"
|
1211
|
-
>
|
1212
|
-
</kendo-chartwizard-property-pane-form-field>
|
1213
|
-
<kendo-chartwizard-property-pane-form-field
|
1214
|
-
[text]="messageFor('formatChartAreaMarginsBottom')"
|
1215
|
-
inputType="numeric"
|
1216
|
-
[placeholder]="messageFor('formatChartAreaMarginsAuto')"
|
1217
|
-
[value]="$any(stateService.state.area.margin).bottom"
|
1218
|
-
(valueChange)="updateState(areaMarginBottom, $event)"
|
1219
|
-
>
|
1220
|
-
</kendo-chartwizard-property-pane-form-field>
|
1221
|
-
</div>
|
1222
|
-
</fieldset>
|
1223
|
-
<fieldset class="k-form-fieldset">
|
1224
|
-
<legend class="k-form-legend">{{ messageFor('formatChartAreaBackground') }}</legend>
|
1225
|
-
<kendo-chartwizard-property-pane-form-field
|
1226
|
-
[text]="messageFor('formatChartAreaBackgroundColor')"
|
1227
|
-
inputType="colorPicker"
|
1228
|
-
[value]="stateService.state.area?.background"
|
1229
|
-
(valueChange)="updateState(areaBackground, $event)"
|
1230
|
-
>
|
1231
|
-
</kendo-chartwizard-property-pane-form-field>
|
1232
|
-
</fieldset>
|
1233
|
-
</form>
|
1234
|
-
</kendo-expansionpanel>
|
1235
|
-
</section>
|
1236
|
-
<section>
|
1237
|
-
<kendo-expansionpanel
|
1238
|
-
[style.max-width.px]="576"
|
1239
|
-
[title]="messageFor('formatTitle')"
|
1240
|
-
[expanded]="true"
|
1241
|
-
>
|
1242
|
-
<form class="k-form k-form-md">
|
1243
|
-
<div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
|
1244
|
-
<kendo-chartwizard-property-pane-form-field
|
1245
|
-
[text]="messageFor('formatTitleApplyTo')"
|
1246
|
-
inputType="dropDownList"
|
1247
|
-
[data]="chartTitles"
|
1248
|
-
[colSpan]="2"
|
1249
|
-
[value]="stateService.currentTitle"
|
1250
|
-
(valueChange)="changeCurrentTitle($event)"
|
1251
|
-
>
|
1252
|
-
</kendo-chartwizard-property-pane-form-field>
|
1253
|
-
<kendo-chartwizard-property-pane-form-field
|
1254
|
-
[text]="messageFor('formatTitleLabel')"
|
1255
|
-
inputType="text"
|
1256
|
-
[colSpan]="2"
|
1257
|
-
[value]="chartTitleTypeText"
|
1258
|
-
(valueChange)="updateState(chartTitleTypeAction, $event)"
|
1259
|
-
>
|
1260
|
-
</kendo-chartwizard-property-pane-form-field>
|
1261
|
-
<kendo-chartwizard-property-pane-form-field
|
1262
|
-
[text]="messageFor('formatTitleFont')"
|
1263
|
-
inputType="comboBox"
|
1264
|
-
[data]="fontNames"
|
1265
|
-
[colSpan]="2"
|
1266
|
-
[value]="chartTitleTypeFont"
|
1267
|
-
[placeholder]="messageFor('formatTitleFontPlaceholder')"
|
1268
|
-
(valueChange)="updateState(chartTitleTypeFontAction, $event)"
|
1269
|
-
>
|
1270
|
-
</kendo-chartwizard-property-pane-form-field>
|
1271
|
-
<kendo-chartwizard-property-pane-form-field
|
1272
|
-
[text]="messageFor('formatTitleSize')"
|
1273
|
-
inputType="comboBox"
|
1274
|
-
[placeholder]="messageFor('formatTitleSizePlaceholder')"
|
1275
|
-
[data]="fontSizes"
|
1276
|
-
[value]="chartTitleTypeFontSize"
|
1277
|
-
(valueChange)="updateState(chartTitleTypeFontSizeAction, $event)"
|
1278
|
-
>
|
1279
|
-
</kendo-chartwizard-property-pane-form-field>
|
1280
|
-
<kendo-chartwizard-property-pane-form-field
|
1281
|
-
[text]="messageFor('formatTitleColor')"
|
1282
|
-
inputType="colorPicker"
|
1283
|
-
[value]="chartTitleTypeColor"
|
1284
|
-
(valueChange)="updateState(chartTitleTypeColorAction, $event)"
|
1285
|
-
>
|
1286
|
-
</kendo-chartwizard-property-pane-form-field>
|
1287
|
-
</div>
|
1288
|
-
</form>
|
1289
|
-
</kendo-expansionpanel>
|
1290
|
-
</section>
|
1291
|
-
<section>
|
1292
|
-
<kendo-expansionpanel
|
1293
|
-
[style.max-width.px]="576"
|
1294
|
-
[title]="messageFor('formatLegend')"
|
1295
|
-
[expanded]="true"
|
1296
|
-
>
|
1297
|
-
<form class="k-form k-form-md">
|
1298
|
-
<div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
|
1299
|
-
<kendo-label [for]="toggleLegend" [text]="messageFor('formatLegendShowLegend')"></kendo-label>
|
1300
|
-
<kendo-switch
|
1301
|
-
#toggleLegend
|
1302
|
-
onLabel="On"
|
1303
|
-
offLabel="Off"
|
1304
|
-
thumbRounded="full"
|
1305
|
-
size="medium"
|
1306
|
-
[checked]="stateService.state.legend?.visible"
|
1307
|
-
(valueChange)="updateState(legendVisible, $event)"
|
1308
|
-
></kendo-switch>
|
1309
|
-
<kendo-chartwizard-property-pane-form-field
|
1310
|
-
[text]="messageFor('formatLegendFont')"
|
1311
|
-
inputType="comboBox"
|
1312
|
-
[data]="fontNames"
|
1313
|
-
[colSpan]="2"
|
1314
|
-
[placeholder]="messageFor('formatLegendFontPlaceholder')"
|
1315
|
-
[value]="parseFont(stateService.state.legend?.labels?.font).name"
|
1316
|
-
(valueChange)="updateState(legendFontName, $event)"
|
1317
|
-
>
|
1318
|
-
</kendo-chartwizard-property-pane-form-field>
|
1319
|
-
<kendo-chartwizard-property-pane-form-field
|
1320
|
-
[text]="messageFor('formatLegendSize')"
|
1321
|
-
inputType="comboBox"
|
1322
|
-
[data]="fontSizes"
|
1323
|
-
[placeholder]="messageFor('formatLegendSizePlaceholder')"
|
1324
|
-
[value]="parseFont(stateService.state.legend?.labels?.font).size"
|
1325
|
-
(valueChange)="updateState(legendFontSize, $event)"
|
1326
|
-
>
|
1327
|
-
</kendo-chartwizard-property-pane-form-field>
|
1328
|
-
<kendo-chartwizard-property-pane-form-field
|
1329
|
-
[text]="messageFor('formatLegendColor')"
|
1330
|
-
inputType="colorPicker"
|
1331
|
-
[value]="stateService.state.legend?.labels?.color"
|
1332
|
-
(valueChange)="updateState(legendColor, $event)"
|
1333
|
-
>
|
1334
|
-
</kendo-chartwizard-property-pane-form-field>
|
1335
|
-
<kendo-chartwizard-property-pane-form-field
|
1336
|
-
[text]="messageFor('formatLegendPosition')"
|
1337
|
-
inputType="dropDownList"
|
1338
|
-
[colSpan]="2"
|
1339
|
-
[data]="legendPositions"
|
1340
|
-
[value]="stateService.state.legend?.position"
|
1341
|
-
(valueChange)="updateState(legendPosition, $event)"
|
1342
|
-
>
|
1343
|
-
</kendo-chartwizard-property-pane-form-field>
|
1344
|
-
</div>
|
1345
|
-
</form>
|
1346
|
-
</kendo-expansionpanel>
|
1347
|
-
</section>
|
1348
|
-
<section>
|
1349
|
-
<kendo-expansionpanel
|
1350
|
-
[style.max-width.px]="576"
|
1351
|
-
[title]="messageFor('formatSeries')"
|
1352
|
-
[expanded]="true"
|
1353
|
-
>
|
1354
|
-
<form class="k-form k-form-md">
|
1355
|
-
<div class="k-form-field">
|
1356
|
-
<kendo-label [for]="seriesDropDown" class="k-form-label" [text]="messageFor('formatSeriesApplyTo')"></kendo-label>
|
1357
|
-
<div class="k-form-field-wrap">
|
1358
|
-
<kendo-dropdownlist
|
1359
|
-
#seriesDropDown
|
1360
|
-
[data]="seriesData"
|
1361
|
-
textField="text"
|
1362
|
-
valueField="name"
|
1363
|
-
fillMode="outline"
|
1364
|
-
rounded="medium"
|
1365
|
-
size="medium"
|
1366
|
-
[value]="stateService.currentSeries"
|
1367
|
-
(valueChange)="updateCurrentSeries($event)"
|
1368
|
-
></kendo-dropdownlist>
|
1369
|
-
</div>
|
1370
|
-
</div>
|
1371
|
-
|
1372
|
-
<kendo-chartwizard-property-pane-form-field
|
1373
|
-
[text]="messageFor('formatSeriesColor')"
|
1374
|
-
[value]="stateService.currentSeries?.color"
|
1375
|
-
inputType="colorPicker"
|
1376
|
-
[disabled]="stateService.currentSeries.name === defaultAllSeriesItem.name"
|
1377
|
-
(valueChange)="updateSeriesColor($event)"
|
1378
|
-
>
|
1379
|
-
</kendo-chartwizard-property-pane-form-field>
|
1380
|
-
<kendo-chartwizard-property-pane-form-field
|
1381
|
-
[text]="messageFor('formatSeriesShowLabels')"
|
1382
|
-
[value]="showLabels"
|
1383
|
-
[isLabelInsideFormFieldWrap]="true"
|
1384
|
-
[colSpan]="2"
|
1385
|
-
inputType="checkbox"
|
1386
|
-
(valueChange)="toggleSeriesLabels($event)"
|
1387
|
-
>
|
1388
|
-
</kendo-chartwizard-property-pane-form-field>
|
1389
|
-
</form>
|
1390
|
-
</kendo-expansionpanel>
|
1391
|
-
</section>
|
1392
|
-
<section *ngIf="stateService.state.seriesType !== 'pie'" class="k-row-start-1 k-row-end-3 k-col-start-3">
|
1393
|
-
<kendo-expansionpanel
|
1394
|
-
[style.max-width.px]="576"
|
1395
|
-
[title]="stateService.state.seriesType === 'scatter' ? messageFor('formatXAxis') : messageFor('formatCategoryAxis')"
|
1396
|
-
[expanded]="true"
|
1397
|
-
>
|
1398
|
-
<form class="k-form k-form-md">
|
1399
|
-
<fieldset class="k-form-fieldset">
|
1400
|
-
<legend class="k-form-legend">{{ messageFor('formatCategoryAxisTitle') }}</legend>
|
1401
|
-
<div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
|
1402
|
-
<kendo-chartwizard-property-pane-form-field
|
1403
|
-
inputType="text"
|
1404
|
-
[hasLabel]="false"
|
1405
|
-
[colSpan]="2"
|
1406
|
-
[placeholder]="messageFor('formatCategoryAxisTitlePlaceholder')"
|
1407
|
-
[value]="stateService.state.categoryAxis[0]?.title?.text || null"
|
1408
|
-
(valueChange)="updateState(categoryAxisTitleText, $event)"
|
1409
|
-
>
|
1410
|
-
</kendo-chartwizard-property-pane-form-field>
|
1411
|
-
<kendo-chartwizard-property-pane-form-field
|
1412
|
-
[text]="messageFor('formatCategoryAxisTitleFont')"
|
1413
|
-
inputType="comboBox"
|
1414
|
-
[data]="fontNames"
|
1415
|
-
[colSpan]="2"
|
1416
|
-
[placeholder]="messageFor('formatCategoryAxisTitleFontPlaceholder')"
|
1417
|
-
[value]="parseFont(stateService.state.categoryAxis[0]?.title?.font).name"
|
1418
|
-
(valueChange)="updateState(categoryAxisTitleFontName, $event)"
|
1419
|
-
>
|
1420
|
-
</kendo-chartwizard-property-pane-form-field>
|
1421
|
-
<kendo-chartwizard-property-pane-form-field
|
1422
|
-
[text]="messageFor('formatCategoryAxisTitleSize')"
|
1423
|
-
inputType="comboBox"
|
1424
|
-
[placeholder]="messageFor('formatCategoryAxisTitleSizePlaceholder')"
|
1425
|
-
[data]="fontSizes"
|
1426
|
-
[value]="parseFont(stateService.state.categoryAxis[0]?.title?.font).size"
|
1427
|
-
(valueChange)="updateState(categoryAxisTitleFontSize, $event)"
|
1428
|
-
>
|
1429
|
-
</kendo-chartwizard-property-pane-form-field>
|
1430
|
-
<kendo-chartwizard-property-pane-form-field
|
1431
|
-
[text]="messageFor('formatCategoryAxisTitleColor')"
|
1432
|
-
inputType="colorPicker"
|
1433
|
-
[value]="stateService.state.categoryAxis[0]?.title?.color"
|
1434
|
-
(valueChange)="updateState(categoryAxisTitleColor, $event)"
|
1435
|
-
>
|
1436
|
-
</kendo-chartwizard-property-pane-form-field>
|
1437
|
-
</div>
|
1438
|
-
</fieldset>
|
1439
|
-
<fieldset class="k-form-fieldset">
|
1440
|
-
<legend class="k-form-legend">{{ messageFor('formatCategoryAxisLabels') }}</legend>
|
1441
|
-
<div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
|
1442
|
-
<kendo-chartwizard-property-pane-form-field
|
1443
|
-
[text]="messageFor('formatCategoryAxisLabelsFont')"
|
1444
|
-
inputType="comboBox"
|
1445
|
-
[data]="fontNames"
|
1446
|
-
[colSpan]="2"
|
1447
|
-
[placeholder]="messageFor('formatCategoryAxisLabelsFontPlaceholder')"
|
1448
|
-
[value]="parseFont(stateService.state.categoryAxis[0]?.labels?.font).name"
|
1449
|
-
(valueChange)="updateState(categoryAxisLabelsFontName, $event)"
|
1450
|
-
>
|
1451
|
-
</kendo-chartwizard-property-pane-form-field>
|
1452
|
-
<kendo-chartwizard-property-pane-form-field
|
1453
|
-
[text]="messageFor('formatCategoryAxisLabelsSize')"
|
1454
|
-
inputType="comboBox"
|
1455
|
-
[data]="fontSizes"
|
1456
|
-
[placeholder]="messageFor('formatCategoryAxisLabelsSizePlaceholder')"
|
1457
|
-
[value]="parseFont(stateService.state.categoryAxis[0]?.labels?.font).size"
|
1458
|
-
(valueChange)="updateState(categoryAxisLabelsFontSize, $event)"
|
1459
|
-
>
|
1460
|
-
</kendo-chartwizard-property-pane-form-field>
|
1461
|
-
<kendo-chartwizard-property-pane-form-field
|
1462
|
-
[text]="messageFor('formatCategoryAxisLabelsColor')"
|
1463
|
-
inputType="colorPicker"
|
1464
|
-
[value]="stateService.state.categoryAxis[0]?.labels?.color"
|
1465
|
-
(valueChange)="updateState(categoryAxisLabelsColor, $event)"
|
1466
|
-
>
|
1467
|
-
</kendo-chartwizard-property-pane-form-field>
|
1468
|
-
<kendo-chartwizard-property-pane-form-field
|
1469
|
-
[text]="messageFor('formatCategoryAxisLabelsRotation')"
|
1470
|
-
inputType="dropDownList"
|
1471
|
-
[data]="labelsCategoryAxisRotation"
|
1472
|
-
[value]="stateService.state.categoryAxis[0]?.labels?.rotation"
|
1473
|
-
(valueChange)="updateState(categoryAxisLabelsRotation, $event)"
|
1474
|
-
>
|
1475
|
-
</kendo-chartwizard-property-pane-form-field>
|
1476
|
-
<span></span>
|
1477
|
-
<kendo-chartwizard-property-pane-form-field
|
1478
|
-
[text]="messageFor('formatCategoryAxisLabelsReverseOrder')"
|
1479
|
-
[isLabelInsideFormFieldWrap]="true"
|
1480
|
-
inputType="checkbox"
|
1481
|
-
[colSpan]="2"
|
1482
|
-
[value]="stateService.state.categoryAxis[0]?.reverse"
|
1483
|
-
(valueChange)="updateState(categoryAxisReverseOrder, $event)"
|
1484
|
-
>
|
1485
|
-
</kendo-chartwizard-property-pane-form-field>
|
1486
|
-
</div>
|
1487
|
-
</fieldset>
|
1488
|
-
</form>
|
1489
|
-
</kendo-expansionpanel>
|
1490
|
-
</section>
|
1491
|
-
<section *ngIf="stateService.state.seriesType !== 'pie'" class="k-row-start-1 k-row-end-3 k-col-start-4">
|
1492
|
-
<kendo-expansionpanel
|
1493
|
-
[style.max-width.px]="576"
|
1494
|
-
[title]="stateService.state.seriesType === 'scatter' ? messageFor('formatYAxis') : messageFor('formatValueAxis')"
|
1495
|
-
[expanded]="true"
|
1496
|
-
>
|
1497
|
-
<form class="k-form k-form-md">
|
1498
|
-
<fieldset class="k-form-fieldset">
|
1499
|
-
<legend class="k-form-legend">{{ messageFor('formatValueAxisTitle') }}</legend>
|
1500
|
-
<div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
|
1501
|
-
<kendo-chartwizard-property-pane-form-field
|
1502
|
-
inputType="text"
|
1503
|
-
[hasLabel]="false"
|
1504
|
-
[colSpan]="2"
|
1505
|
-
[placeholder]="messageFor('formatValueAxisTitlePlaceholder')"
|
1506
|
-
[value]="stateService.state.valueAxis[0]?.title?.text || null"
|
1507
|
-
(valueChange)="updateState(valueAxisTitleText, $event)"
|
1508
|
-
>
|
1509
|
-
</kendo-chartwizard-property-pane-form-field>
|
1510
|
-
<kendo-chartwizard-property-pane-form-field
|
1511
|
-
[text]="messageFor('formatValueAxisTitleFont')"
|
1512
|
-
inputType="comboBox"
|
1513
|
-
[colSpan]="2"
|
1514
|
-
[data]="fontNames"
|
1515
|
-
[placeholder]="messageFor('formatValueAxisTitleFontPlaceholder')"
|
1516
|
-
[value]="parseFont(stateService.state.valueAxis[0]?.title?.font).name"
|
1517
|
-
(valueChange)="updateState(valueAxisTitleFontName, $event)"
|
1518
|
-
>
|
1519
|
-
</kendo-chartwizard-property-pane-form-field>
|
1520
|
-
<kendo-chartwizard-property-pane-form-field
|
1521
|
-
[text]="messageFor('formatValueAxisTitleSize')"
|
1522
|
-
inputType="comboBox"
|
1523
|
-
[placeholder]="messageFor('formatValueAxisTitleSizePlaceholder')"
|
1524
|
-
[data]="fontSizes"
|
1525
|
-
[value]="parseFont(stateService.state.valueAxis[0]?.title?.font).size"
|
1526
|
-
(valueChange)="updateState(valueAxisTitleFontSize, $event)"
|
1527
|
-
>
|
1528
|
-
</kendo-chartwizard-property-pane-form-field>
|
1529
|
-
<kendo-chartwizard-property-pane-form-field
|
1530
|
-
[text]="messageFor('formatValueAxisTitleColor')"
|
1531
|
-
inputType="colorPicker"
|
1532
|
-
[value]="stateService.state.valueAxis[0]?.title?.color"
|
1533
|
-
(valueChange)="updateState(valueAxisTitleColor, $event)"
|
1534
|
-
>
|
1535
|
-
</kendo-chartwizard-property-pane-form-field>
|
1536
|
-
</div>
|
1537
|
-
</fieldset>
|
1538
|
-
<fieldset class="k-form-fieldset">
|
1539
|
-
<legend class="k-form-legend">{{ messageFor('formatValueAxisLabels') }}</legend>
|
1540
|
-
<div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
|
1541
|
-
<kendo-chartwizard-property-pane-form-field
|
1542
|
-
[text]="messageFor('formatValueAxisLabelsFormat')"
|
1543
|
-
[colSpan]="2"
|
1544
|
-
inputType="dropDownList"
|
1545
|
-
[data]="labelFormats"
|
1546
|
-
[value]="labelFormatValue"
|
1547
|
-
(valueChange)="updateState(valueAxisLabelsFormat, $event)"
|
1548
|
-
>
|
1549
|
-
</kendo-chartwizard-property-pane-form-field>
|
1550
|
-
<kendo-chartwizard-property-pane-form-field
|
1551
|
-
[text]="messageFor('formatValueAxisLabelsFont')"
|
1552
|
-
inputType="comboBox"
|
1553
|
-
[data]="fontNames"
|
1554
|
-
[colSpan]="2"
|
1555
|
-
[placeholder]="messageFor('formatValueAxisLabelsFontPlaceholder')"
|
1556
|
-
[value]="parseFont(stateService.state.valueAxis[0]?.labels?.font).name"
|
1557
|
-
(valueChange)="updateState(valueAxisLabelsFontName, $event)"
|
1558
|
-
>
|
1559
|
-
</kendo-chartwizard-property-pane-form-field>
|
1560
|
-
<kendo-chartwizard-property-pane-form-field
|
1561
|
-
[text]="messageFor('formatValueAxisLabelsSize')"
|
1562
|
-
inputType="comboBox"
|
1563
|
-
[data]="fontSizes"
|
1564
|
-
[placeholder]="messageFor('formatValueAxisLabelsSizePlaceholder')"
|
1565
|
-
[value]="parseFont(stateService.state.valueAxis[0]?.labels?.font).size"
|
1566
|
-
(valueChange)="updateState(valueAxisLabelsFontSize, $event)"
|
1567
|
-
>
|
1568
|
-
</kendo-chartwizard-property-pane-form-field>
|
1569
|
-
<kendo-chartwizard-property-pane-form-field
|
1570
|
-
[text]="messageFor('formatValueAxisLabelsColor')"
|
1571
|
-
inputType="colorPicker"
|
1572
|
-
[value]="stateService.state.valueAxis[0]?.labels?.color"
|
1573
|
-
(valueChange)="updateState(valueAxisLabelsColor, $event)"
|
1574
|
-
>
|
1575
|
-
</kendo-chartwizard-property-pane-form-field>
|
1576
|
-
<kendo-chartwizard-property-pane-form-field
|
1577
|
-
[text]="messageFor('formatValueAxisLabelsRotation')"
|
1578
|
-
inputType="dropDownList"
|
1579
|
-
[data]="labelsValueAxisRotation"
|
1580
|
-
[value]="stateService.state.valueAxis[0]?.labels?.rotation"
|
1581
|
-
(valueChange)="updateState(valueAxisLabelsRotation, $event)"
|
1582
|
-
>
|
1583
|
-
</kendo-chartwizard-property-pane-form-field>
|
1584
|
-
</div>
|
1585
|
-
</fieldset>
|
1586
|
-
</form>
|
1587
|
-
</kendo-expansionpanel>
|
1588
|
-
</section>
|
1589
|
-
`, isInline: true, dependencies: [{ kind: "component", type: ExpansionPanelComponent, selector: "kendo-expansionpanel", inputs: ["title", "subtitle", "disabled", "expanded", "svgExpandIcon", "svgCollapseIcon", "expandIcon", "collapseIcon", "animation"], outputs: ["expandedChange", "action", "expand", "collapse"], exportAs: ["kendoExpansionPanel"] }, { kind: "component", type: ChartWizardPropertyPaneFormFieldComponent, selector: "kendo-chartwizard-property-pane-form-field", inputs: ["currentState", "action", "class", "inputType", "text", "data", "placeholder", "colSpan", "hasLabel", "isLabelInsideFormFieldWrap", "value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { kind: "component", type: SwitchComponent, selector: "kendo-switch", inputs: ["focusableId", "onLabel", "offLabel", "checked", "disabled", "readonly", "tabindex", "size", "thumbRounded", "trackRounded", "tabIndex"], outputs: ["focus", "blur", "valueChange"], exportAs: ["kendoSwitch"] }, { kind: "component", type: DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
1590
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardPropertyPaneFormatTabComponent, decorators: [{
|
1591
|
-
type: Component,
|
1592
|
-
args: [{
|
1593
|
-
selector: 'kendo-chartwizard-property-pane-format-tab',
|
1594
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
1595
|
-
template: `
|
1596
|
-
<section>
|
1597
|
-
<kendo-expansionpanel
|
1598
|
-
[style.max-width.px]="576"
|
1599
|
-
[title]="messageFor('formatChartArea')"
|
1600
|
-
[expanded]="true"
|
1601
|
-
[attr.dir]="stateService.direction"
|
1602
|
-
>
|
1603
|
-
<form class="k-form k-form-md">
|
1604
|
-
<fieldset class="k-form-fieldset">
|
1605
|
-
<legend class="k-form-legend">{{ messageFor('formatChartAreaMargins') }}</legend>
|
1606
|
-
<div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
|
1607
|
-
<kendo-chartwizard-property-pane-form-field
|
1608
|
-
[text]="messageFor('formatChartAreaMarginsLeft')"
|
1609
|
-
inputType="numeric"
|
1610
|
-
[placeholder]="messageFor('formatChartAreaMarginsAuto')"
|
1611
|
-
[value]="$any(stateService.state.area.margin).left"
|
1612
|
-
(valueChange)="updateState(areaMarginLeft, $event)"
|
1613
|
-
>
|
1614
|
-
</kendo-chartwizard-property-pane-form-field>
|
1615
|
-
<kendo-chartwizard-property-pane-form-field
|
1616
|
-
[text]="messageFor('formatChartAreaMarginsRight')"
|
1617
|
-
inputType="numeric"
|
1618
|
-
[placeholder]="messageFor('formatChartAreaMarginsAuto')"
|
1619
|
-
[value]="$any(stateService.state.area.margin).right"
|
1620
|
-
(valueChange)="updateState(areaMarginRight, $event)"
|
1621
|
-
>
|
1622
|
-
</kendo-chartwizard-property-pane-form-field>
|
1623
|
-
<kendo-chartwizard-property-pane-form-field
|
1624
|
-
[text]="messageFor('formatChartAreaMarginsTop')"
|
1625
|
-
inputType="numeric"
|
1626
|
-
[placeholder]="messageFor('formatChartAreaMarginsAuto')"
|
1627
|
-
[value]="$any(stateService.state.area.margin).top"
|
1628
|
-
(valueChange)="updateState(areaMarginTop, $event)"
|
1629
|
-
>
|
1630
|
-
</kendo-chartwizard-property-pane-form-field>
|
1631
|
-
<kendo-chartwizard-property-pane-form-field
|
1632
|
-
[text]="messageFor('formatChartAreaMarginsBottom')"
|
1633
|
-
inputType="numeric"
|
1634
|
-
[placeholder]="messageFor('formatChartAreaMarginsAuto')"
|
1635
|
-
[value]="$any(stateService.state.area.margin).bottom"
|
1636
|
-
(valueChange)="updateState(areaMarginBottom, $event)"
|
1637
|
-
>
|
1638
|
-
</kendo-chartwizard-property-pane-form-field>
|
1639
|
-
</div>
|
1640
|
-
</fieldset>
|
1641
|
-
<fieldset class="k-form-fieldset">
|
1642
|
-
<legend class="k-form-legend">{{ messageFor('formatChartAreaBackground') }}</legend>
|
1643
|
-
<kendo-chartwizard-property-pane-form-field
|
1644
|
-
[text]="messageFor('formatChartAreaBackgroundColor')"
|
1645
|
-
inputType="colorPicker"
|
1646
|
-
[value]="stateService.state.area?.background"
|
1647
|
-
(valueChange)="updateState(areaBackground, $event)"
|
1648
|
-
>
|
1649
|
-
</kendo-chartwizard-property-pane-form-field>
|
1650
|
-
</fieldset>
|
1651
|
-
</form>
|
1652
|
-
</kendo-expansionpanel>
|
1653
|
-
</section>
|
1654
|
-
<section>
|
1655
|
-
<kendo-expansionpanel
|
1656
|
-
[style.max-width.px]="576"
|
1657
|
-
[title]="messageFor('formatTitle')"
|
1658
|
-
[expanded]="true"
|
1659
|
-
>
|
1660
|
-
<form class="k-form k-form-md">
|
1661
|
-
<div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
|
1662
|
-
<kendo-chartwizard-property-pane-form-field
|
1663
|
-
[text]="messageFor('formatTitleApplyTo')"
|
1664
|
-
inputType="dropDownList"
|
1665
|
-
[data]="chartTitles"
|
1666
|
-
[colSpan]="2"
|
1667
|
-
[value]="stateService.currentTitle"
|
1668
|
-
(valueChange)="changeCurrentTitle($event)"
|
1669
|
-
>
|
1670
|
-
</kendo-chartwizard-property-pane-form-field>
|
1671
|
-
<kendo-chartwizard-property-pane-form-field
|
1672
|
-
[text]="messageFor('formatTitleLabel')"
|
1673
|
-
inputType="text"
|
1674
|
-
[colSpan]="2"
|
1675
|
-
[value]="chartTitleTypeText"
|
1676
|
-
(valueChange)="updateState(chartTitleTypeAction, $event)"
|
1677
|
-
>
|
1678
|
-
</kendo-chartwizard-property-pane-form-field>
|
1679
|
-
<kendo-chartwizard-property-pane-form-field
|
1680
|
-
[text]="messageFor('formatTitleFont')"
|
1681
|
-
inputType="comboBox"
|
1682
|
-
[data]="fontNames"
|
1683
|
-
[colSpan]="2"
|
1684
|
-
[value]="chartTitleTypeFont"
|
1685
|
-
[placeholder]="messageFor('formatTitleFontPlaceholder')"
|
1686
|
-
(valueChange)="updateState(chartTitleTypeFontAction, $event)"
|
1687
|
-
>
|
1688
|
-
</kendo-chartwizard-property-pane-form-field>
|
1689
|
-
<kendo-chartwizard-property-pane-form-field
|
1690
|
-
[text]="messageFor('formatTitleSize')"
|
1691
|
-
inputType="comboBox"
|
1692
|
-
[placeholder]="messageFor('formatTitleSizePlaceholder')"
|
1693
|
-
[data]="fontSizes"
|
1694
|
-
[value]="chartTitleTypeFontSize"
|
1695
|
-
(valueChange)="updateState(chartTitleTypeFontSizeAction, $event)"
|
1696
|
-
>
|
1697
|
-
</kendo-chartwizard-property-pane-form-field>
|
1698
|
-
<kendo-chartwizard-property-pane-form-field
|
1699
|
-
[text]="messageFor('formatTitleColor')"
|
1700
|
-
inputType="colorPicker"
|
1701
|
-
[value]="chartTitleTypeColor"
|
1702
|
-
(valueChange)="updateState(chartTitleTypeColorAction, $event)"
|
1703
|
-
>
|
1704
|
-
</kendo-chartwizard-property-pane-form-field>
|
1705
|
-
</div>
|
1706
|
-
</form>
|
1707
|
-
</kendo-expansionpanel>
|
1708
|
-
</section>
|
1709
|
-
<section>
|
1710
|
-
<kendo-expansionpanel
|
1711
|
-
[style.max-width.px]="576"
|
1712
|
-
[title]="messageFor('formatLegend')"
|
1713
|
-
[expanded]="true"
|
1714
|
-
>
|
1715
|
-
<form class="k-form k-form-md">
|
1716
|
-
<div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
|
1717
|
-
<kendo-label [for]="toggleLegend" [text]="messageFor('formatLegendShowLegend')"></kendo-label>
|
1718
|
-
<kendo-switch
|
1719
|
-
#toggleLegend
|
1720
|
-
onLabel="On"
|
1721
|
-
offLabel="Off"
|
1722
|
-
thumbRounded="full"
|
1723
|
-
size="medium"
|
1724
|
-
[checked]="stateService.state.legend?.visible"
|
1725
|
-
(valueChange)="updateState(legendVisible, $event)"
|
1726
|
-
></kendo-switch>
|
1727
|
-
<kendo-chartwizard-property-pane-form-field
|
1728
|
-
[text]="messageFor('formatLegendFont')"
|
1729
|
-
inputType="comboBox"
|
1730
|
-
[data]="fontNames"
|
1731
|
-
[colSpan]="2"
|
1732
|
-
[placeholder]="messageFor('formatLegendFontPlaceholder')"
|
1733
|
-
[value]="parseFont(stateService.state.legend?.labels?.font).name"
|
1734
|
-
(valueChange)="updateState(legendFontName, $event)"
|
1735
|
-
>
|
1736
|
-
</kendo-chartwizard-property-pane-form-field>
|
1737
|
-
<kendo-chartwizard-property-pane-form-field
|
1738
|
-
[text]="messageFor('formatLegendSize')"
|
1739
|
-
inputType="comboBox"
|
1740
|
-
[data]="fontSizes"
|
1741
|
-
[placeholder]="messageFor('formatLegendSizePlaceholder')"
|
1742
|
-
[value]="parseFont(stateService.state.legend?.labels?.font).size"
|
1743
|
-
(valueChange)="updateState(legendFontSize, $event)"
|
1744
|
-
>
|
1745
|
-
</kendo-chartwizard-property-pane-form-field>
|
1746
|
-
<kendo-chartwizard-property-pane-form-field
|
1747
|
-
[text]="messageFor('formatLegendColor')"
|
1748
|
-
inputType="colorPicker"
|
1749
|
-
[value]="stateService.state.legend?.labels?.color"
|
1750
|
-
(valueChange)="updateState(legendColor, $event)"
|
1751
|
-
>
|
1752
|
-
</kendo-chartwizard-property-pane-form-field>
|
1753
|
-
<kendo-chartwizard-property-pane-form-field
|
1754
|
-
[text]="messageFor('formatLegendPosition')"
|
1755
|
-
inputType="dropDownList"
|
1756
|
-
[colSpan]="2"
|
1757
|
-
[data]="legendPositions"
|
1758
|
-
[value]="stateService.state.legend?.position"
|
1759
|
-
(valueChange)="updateState(legendPosition, $event)"
|
1760
|
-
>
|
1761
|
-
</kendo-chartwizard-property-pane-form-field>
|
1762
|
-
</div>
|
1763
|
-
</form>
|
1764
|
-
</kendo-expansionpanel>
|
1765
|
-
</section>
|
1766
|
-
<section>
|
1767
|
-
<kendo-expansionpanel
|
1768
|
-
[style.max-width.px]="576"
|
1769
|
-
[title]="messageFor('formatSeries')"
|
1770
|
-
[expanded]="true"
|
1771
|
-
>
|
1772
|
-
<form class="k-form k-form-md">
|
1773
|
-
<div class="k-form-field">
|
1774
|
-
<kendo-label [for]="seriesDropDown" class="k-form-label" [text]="messageFor('formatSeriesApplyTo')"></kendo-label>
|
1775
|
-
<div class="k-form-field-wrap">
|
1776
|
-
<kendo-dropdownlist
|
1777
|
-
#seriesDropDown
|
1778
|
-
[data]="seriesData"
|
1779
|
-
textField="text"
|
1780
|
-
valueField="name"
|
1781
|
-
fillMode="outline"
|
1782
|
-
rounded="medium"
|
1783
|
-
size="medium"
|
1784
|
-
[value]="stateService.currentSeries"
|
1785
|
-
(valueChange)="updateCurrentSeries($event)"
|
1786
|
-
></kendo-dropdownlist>
|
1787
|
-
</div>
|
1788
|
-
</div>
|
1789
|
-
|
1790
|
-
<kendo-chartwizard-property-pane-form-field
|
1791
|
-
[text]="messageFor('formatSeriesColor')"
|
1792
|
-
[value]="stateService.currentSeries?.color"
|
1793
|
-
inputType="colorPicker"
|
1794
|
-
[disabled]="stateService.currentSeries.name === defaultAllSeriesItem.name"
|
1795
|
-
(valueChange)="updateSeriesColor($event)"
|
1796
|
-
>
|
1797
|
-
</kendo-chartwizard-property-pane-form-field>
|
1798
|
-
<kendo-chartwizard-property-pane-form-field
|
1799
|
-
[text]="messageFor('formatSeriesShowLabels')"
|
1800
|
-
[value]="showLabels"
|
1801
|
-
[isLabelInsideFormFieldWrap]="true"
|
1802
|
-
[colSpan]="2"
|
1803
|
-
inputType="checkbox"
|
1804
|
-
(valueChange)="toggleSeriesLabels($event)"
|
1805
|
-
>
|
1806
|
-
</kendo-chartwizard-property-pane-form-field>
|
1807
|
-
</form>
|
1808
|
-
</kendo-expansionpanel>
|
1809
|
-
</section>
|
1810
|
-
<section *ngIf="stateService.state.seriesType !== 'pie'" class="k-row-start-1 k-row-end-3 k-col-start-3">
|
1811
|
-
<kendo-expansionpanel
|
1812
|
-
[style.max-width.px]="576"
|
1813
|
-
[title]="stateService.state.seriesType === 'scatter' ? messageFor('formatXAxis') : messageFor('formatCategoryAxis')"
|
1814
|
-
[expanded]="true"
|
1815
|
-
>
|
1816
|
-
<form class="k-form k-form-md">
|
1817
|
-
<fieldset class="k-form-fieldset">
|
1818
|
-
<legend class="k-form-legend">{{ messageFor('formatCategoryAxisTitle') }}</legend>
|
1819
|
-
<div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
|
1820
|
-
<kendo-chartwizard-property-pane-form-field
|
1821
|
-
inputType="text"
|
1822
|
-
[hasLabel]="false"
|
1823
|
-
[colSpan]="2"
|
1824
|
-
[placeholder]="messageFor('formatCategoryAxisTitlePlaceholder')"
|
1825
|
-
[value]="stateService.state.categoryAxis[0]?.title?.text || null"
|
1826
|
-
(valueChange)="updateState(categoryAxisTitleText, $event)"
|
1827
|
-
>
|
1828
|
-
</kendo-chartwizard-property-pane-form-field>
|
1829
|
-
<kendo-chartwizard-property-pane-form-field
|
1830
|
-
[text]="messageFor('formatCategoryAxisTitleFont')"
|
1831
|
-
inputType="comboBox"
|
1832
|
-
[data]="fontNames"
|
1833
|
-
[colSpan]="2"
|
1834
|
-
[placeholder]="messageFor('formatCategoryAxisTitleFontPlaceholder')"
|
1835
|
-
[value]="parseFont(stateService.state.categoryAxis[0]?.title?.font).name"
|
1836
|
-
(valueChange)="updateState(categoryAxisTitleFontName, $event)"
|
1837
|
-
>
|
1838
|
-
</kendo-chartwizard-property-pane-form-field>
|
1839
|
-
<kendo-chartwizard-property-pane-form-field
|
1840
|
-
[text]="messageFor('formatCategoryAxisTitleSize')"
|
1841
|
-
inputType="comboBox"
|
1842
|
-
[placeholder]="messageFor('formatCategoryAxisTitleSizePlaceholder')"
|
1843
|
-
[data]="fontSizes"
|
1844
|
-
[value]="parseFont(stateService.state.categoryAxis[0]?.title?.font).size"
|
1845
|
-
(valueChange)="updateState(categoryAxisTitleFontSize, $event)"
|
1846
|
-
>
|
1847
|
-
</kendo-chartwizard-property-pane-form-field>
|
1848
|
-
<kendo-chartwizard-property-pane-form-field
|
1849
|
-
[text]="messageFor('formatCategoryAxisTitleColor')"
|
1850
|
-
inputType="colorPicker"
|
1851
|
-
[value]="stateService.state.categoryAxis[0]?.title?.color"
|
1852
|
-
(valueChange)="updateState(categoryAxisTitleColor, $event)"
|
1853
|
-
>
|
1854
|
-
</kendo-chartwizard-property-pane-form-field>
|
1855
|
-
</div>
|
1856
|
-
</fieldset>
|
1857
|
-
<fieldset class="k-form-fieldset">
|
1858
|
-
<legend class="k-form-legend">{{ messageFor('formatCategoryAxisLabels') }}</legend>
|
1859
|
-
<div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
|
1860
|
-
<kendo-chartwizard-property-pane-form-field
|
1861
|
-
[text]="messageFor('formatCategoryAxisLabelsFont')"
|
1862
|
-
inputType="comboBox"
|
1863
|
-
[data]="fontNames"
|
1864
|
-
[colSpan]="2"
|
1865
|
-
[placeholder]="messageFor('formatCategoryAxisLabelsFontPlaceholder')"
|
1866
|
-
[value]="parseFont(stateService.state.categoryAxis[0]?.labels?.font).name"
|
1867
|
-
(valueChange)="updateState(categoryAxisLabelsFontName, $event)"
|
1868
|
-
>
|
1869
|
-
</kendo-chartwizard-property-pane-form-field>
|
1870
|
-
<kendo-chartwizard-property-pane-form-field
|
1871
|
-
[text]="messageFor('formatCategoryAxisLabelsSize')"
|
1872
|
-
inputType="comboBox"
|
1873
|
-
[data]="fontSizes"
|
1874
|
-
[placeholder]="messageFor('formatCategoryAxisLabelsSizePlaceholder')"
|
1875
|
-
[value]="parseFont(stateService.state.categoryAxis[0]?.labels?.font).size"
|
1876
|
-
(valueChange)="updateState(categoryAxisLabelsFontSize, $event)"
|
1877
|
-
>
|
1878
|
-
</kendo-chartwizard-property-pane-form-field>
|
1879
|
-
<kendo-chartwizard-property-pane-form-field
|
1880
|
-
[text]="messageFor('formatCategoryAxisLabelsColor')"
|
1881
|
-
inputType="colorPicker"
|
1882
|
-
[value]="stateService.state.categoryAxis[0]?.labels?.color"
|
1883
|
-
(valueChange)="updateState(categoryAxisLabelsColor, $event)"
|
1884
|
-
>
|
1885
|
-
</kendo-chartwizard-property-pane-form-field>
|
1886
|
-
<kendo-chartwizard-property-pane-form-field
|
1887
|
-
[text]="messageFor('formatCategoryAxisLabelsRotation')"
|
1888
|
-
inputType="dropDownList"
|
1889
|
-
[data]="labelsCategoryAxisRotation"
|
1890
|
-
[value]="stateService.state.categoryAxis[0]?.labels?.rotation"
|
1891
|
-
(valueChange)="updateState(categoryAxisLabelsRotation, $event)"
|
1892
|
-
>
|
1893
|
-
</kendo-chartwizard-property-pane-form-field>
|
1894
|
-
<span></span>
|
1895
|
-
<kendo-chartwizard-property-pane-form-field
|
1896
|
-
[text]="messageFor('formatCategoryAxisLabelsReverseOrder')"
|
1897
|
-
[isLabelInsideFormFieldWrap]="true"
|
1898
|
-
inputType="checkbox"
|
1899
|
-
[colSpan]="2"
|
1900
|
-
[value]="stateService.state.categoryAxis[0]?.reverse"
|
1901
|
-
(valueChange)="updateState(categoryAxisReverseOrder, $event)"
|
1902
|
-
>
|
1903
|
-
</kendo-chartwizard-property-pane-form-field>
|
1904
|
-
</div>
|
1905
|
-
</fieldset>
|
1906
|
-
</form>
|
1907
|
-
</kendo-expansionpanel>
|
1908
|
-
</section>
|
1909
|
-
<section *ngIf="stateService.state.seriesType !== 'pie'" class="k-row-start-1 k-row-end-3 k-col-start-4">
|
1910
|
-
<kendo-expansionpanel
|
1911
|
-
[style.max-width.px]="576"
|
1912
|
-
[title]="stateService.state.seriesType === 'scatter' ? messageFor('formatYAxis') : messageFor('formatValueAxis')"
|
1913
|
-
[expanded]="true"
|
1914
|
-
>
|
1915
|
-
<form class="k-form k-form-md">
|
1916
|
-
<fieldset class="k-form-fieldset">
|
1917
|
-
<legend class="k-form-legend">{{ messageFor('formatValueAxisTitle') }}</legend>
|
1918
|
-
<div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
|
1919
|
-
<kendo-chartwizard-property-pane-form-field
|
1920
|
-
inputType="text"
|
1921
|
-
[hasLabel]="false"
|
1922
|
-
[colSpan]="2"
|
1923
|
-
[placeholder]="messageFor('formatValueAxisTitlePlaceholder')"
|
1924
|
-
[value]="stateService.state.valueAxis[0]?.title?.text || null"
|
1925
|
-
(valueChange)="updateState(valueAxisTitleText, $event)"
|
1926
|
-
>
|
1927
|
-
</kendo-chartwizard-property-pane-form-field>
|
1928
|
-
<kendo-chartwizard-property-pane-form-field
|
1929
|
-
[text]="messageFor('formatValueAxisTitleFont')"
|
1930
|
-
inputType="comboBox"
|
1931
|
-
[colSpan]="2"
|
1932
|
-
[data]="fontNames"
|
1933
|
-
[placeholder]="messageFor('formatValueAxisTitleFontPlaceholder')"
|
1934
|
-
[value]="parseFont(stateService.state.valueAxis[0]?.title?.font).name"
|
1935
|
-
(valueChange)="updateState(valueAxisTitleFontName, $event)"
|
1936
|
-
>
|
1937
|
-
</kendo-chartwizard-property-pane-form-field>
|
1938
|
-
<kendo-chartwizard-property-pane-form-field
|
1939
|
-
[text]="messageFor('formatValueAxisTitleSize')"
|
1940
|
-
inputType="comboBox"
|
1941
|
-
[placeholder]="messageFor('formatValueAxisTitleSizePlaceholder')"
|
1942
|
-
[data]="fontSizes"
|
1943
|
-
[value]="parseFont(stateService.state.valueAxis[0]?.title?.font).size"
|
1944
|
-
(valueChange)="updateState(valueAxisTitleFontSize, $event)"
|
1945
|
-
>
|
1946
|
-
</kendo-chartwizard-property-pane-form-field>
|
1947
|
-
<kendo-chartwizard-property-pane-form-field
|
1948
|
-
[text]="messageFor('formatValueAxisTitleColor')"
|
1949
|
-
inputType="colorPicker"
|
1950
|
-
[value]="stateService.state.valueAxis[0]?.title?.color"
|
1951
|
-
(valueChange)="updateState(valueAxisTitleColor, $event)"
|
1952
|
-
>
|
1953
|
-
</kendo-chartwizard-property-pane-form-field>
|
1954
|
-
</div>
|
1955
|
-
</fieldset>
|
1956
|
-
<fieldset class="k-form-fieldset">
|
1957
|
-
<legend class="k-form-legend">{{ messageFor('formatValueAxisLabels') }}</legend>
|
1958
|
-
<div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
|
1959
|
-
<kendo-chartwizard-property-pane-form-field
|
1960
|
-
[text]="messageFor('formatValueAxisLabelsFormat')"
|
1961
|
-
[colSpan]="2"
|
1962
|
-
inputType="dropDownList"
|
1963
|
-
[data]="labelFormats"
|
1964
|
-
[value]="labelFormatValue"
|
1965
|
-
(valueChange)="updateState(valueAxisLabelsFormat, $event)"
|
1966
|
-
>
|
1967
|
-
</kendo-chartwizard-property-pane-form-field>
|
1968
|
-
<kendo-chartwizard-property-pane-form-field
|
1969
|
-
[text]="messageFor('formatValueAxisLabelsFont')"
|
1970
|
-
inputType="comboBox"
|
1971
|
-
[data]="fontNames"
|
1972
|
-
[colSpan]="2"
|
1973
|
-
[placeholder]="messageFor('formatValueAxisLabelsFontPlaceholder')"
|
1974
|
-
[value]="parseFont(stateService.state.valueAxis[0]?.labels?.font).name"
|
1975
|
-
(valueChange)="updateState(valueAxisLabelsFontName, $event)"
|
1976
|
-
>
|
1977
|
-
</kendo-chartwizard-property-pane-form-field>
|
1978
|
-
<kendo-chartwizard-property-pane-form-field
|
1979
|
-
[text]="messageFor('formatValueAxisLabelsSize')"
|
1980
|
-
inputType="comboBox"
|
1981
|
-
[data]="fontSizes"
|
1982
|
-
[placeholder]="messageFor('formatValueAxisLabelsSizePlaceholder')"
|
1983
|
-
[value]="parseFont(stateService.state.valueAxis[0]?.labels?.font).size"
|
1984
|
-
(valueChange)="updateState(valueAxisLabelsFontSize, $event)"
|
1985
|
-
>
|
1986
|
-
</kendo-chartwizard-property-pane-form-field>
|
1987
|
-
<kendo-chartwizard-property-pane-form-field
|
1988
|
-
[text]="messageFor('formatValueAxisLabelsColor')"
|
1989
|
-
inputType="colorPicker"
|
1990
|
-
[value]="stateService.state.valueAxis[0]?.labels?.color"
|
1991
|
-
(valueChange)="updateState(valueAxisLabelsColor, $event)"
|
1992
|
-
>
|
1993
|
-
</kendo-chartwizard-property-pane-form-field>
|
1994
|
-
<kendo-chartwizard-property-pane-form-field
|
1995
|
-
[text]="messageFor('formatValueAxisLabelsRotation')"
|
1996
|
-
inputType="dropDownList"
|
1997
|
-
[data]="labelsValueAxisRotation"
|
1998
|
-
[value]="stateService.state.valueAxis[0]?.labels?.rotation"
|
1999
|
-
(valueChange)="updateState(valueAxisLabelsRotation, $event)"
|
2000
|
-
>
|
2001
|
-
</kendo-chartwizard-property-pane-form-field>
|
2002
|
-
</div>
|
2003
|
-
</fieldset>
|
2004
|
-
</form>
|
2005
|
-
</kendo-expansionpanel>
|
2006
|
-
</section>
|
2007
|
-
`,
|
2008
|
-
standalone: true,
|
2009
|
-
imports: [
|
2010
|
-
ExpansionPanelComponent,
|
2011
|
-
ChartWizardPropertyPaneFormFieldComponent,
|
2012
|
-
LabelComponent,
|
2013
|
-
SwitchComponent,
|
2014
|
-
DropDownListComponent,
|
2015
|
-
NgIf
|
2016
|
-
]
|
2017
|
-
}]
|
2018
|
-
}], ctorParameters: function () { return [{ type: StateService }, { type: ChartWizardLocalizationService }, { type: i0.ChangeDetectorRef }]; } });
|
2019
|
-
|
2020
|
-
/**
|
2021
|
-
* @hidden
|
2022
|
-
*/
|
2023
|
-
class Messages extends ComponentMessages {
|
2024
|
-
}
|
2025
|
-
Messages.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: Messages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
2026
|
-
Messages.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: Messages, selector: "[kendoChartWizardMessages]", inputs: { windowTitle: "windowTitle", exportButton: "exportButton", exportPDFButton: "exportPDFButton", exportSVGButton: "exportSVGButton", exportPNGButton: "exportPNGButton", tabChart: "tabChart", tabData: "tabData", tabFormat: "tabFormat", barChart: "barChart", barChartBar: "barChartBar", barChartStackedBar: "barChartStackedBar", barChart100StackedBar: "barChart100StackedBar", pieChart: "pieChart", pieChartPie: "pieChartPie", columnChart: "columnChart", columnChartColumn: "columnChartColumn", columnChartStackedColumn: "columnChartStackedColumn", columnChart100StackedColumn: "columnChart100StackedColumn", lineChart: "lineChart", lineChartLine: "lineChartLine", lineChartStackedLine: "lineChartStackedLine", lineChart100StackedLine: "lineChart100StackedLine", scatterChart: "scatterChart", scatterChartScatter: "scatterChartScatter", configuration: "configuration", configurationCategoryAxis: "configurationCategoryAxis", configurationXAxis: "configurationXAxis", configurationValueAxis: "configurationValueAxis", configurationSeries: "configurationSeries", configurationSeriesAdd: "configurationSeriesAdd", formatChartArea: "formatChartArea", formatChartAreaMargins: "formatChartAreaMargins", formatChartAreaMarginsAuto: "formatChartAreaMarginsAuto", formatChartAreaMarginsLeft: "formatChartAreaMarginsLeft", formatChartAreaMarginsRight: "formatChartAreaMarginsRight", formatChartAreaMarginsTop: "formatChartAreaMarginsTop", formatChartAreaMarginsBottom: "formatChartAreaMarginsBottom", formatChartAreaBackground: "formatChartAreaBackground", formatChartAreaBackgroundColor: "formatChartAreaBackgroundColor", formatTitle: "formatTitle", formatTitleApplyTo: "formatTitleApplyTo", formatTitleChartTitle: "formatTitleChartTitle", formatTitleChartSubtitle: "formatTitleChartSubtitle", formatTitleLabel: "formatTitleLabel", formatTitleFont: "formatTitleFont", formatTitleFontPlaceholder: "formatTitleFontPlaceholder", formatTitleSize: "formatTitleSize", formatTitleSizePlaceholder: "formatTitleSizePlaceholder", formatTitleColor: "formatTitleColor", formatSeries: "formatSeries", formatSeriesApplyTo: "formatSeriesApplyTo", formatSeriesAllSeries: "formatSeriesAllSeries", formatSeriesColor: "formatSeriesColor", formatSeriesShowLabels: "formatSeriesShowLabels", formatLegend: "formatLegend", formatLegendShowLegend: "formatLegendShowLegend", formatLegendFont: "formatLegendFont", formatLegendFontPlaceholder: "formatLegendFontPlaceholder", formatLegendSize: "formatLegendSize", formatLegendSizePlaceholder: "formatLegendSizePlaceholder", formatLegendColor: "formatLegendColor", formatLegendPosition: "formatLegendPosition", formatLegendPositionTop: "formatLegendPositionTop", formatLegendPositionBottom: "formatLegendPositionBottom", formatLegendPositionLeft: "formatLegendPositionLeft", formatLegendPositionRight: "formatLegendPositionRight", formatCategoryAxis: "formatCategoryAxis", formatXAxis: "formatXAxis", formatCategoryAxisTitle: "formatCategoryAxisTitle", formatCategoryAxisTitlePlaceholder: "formatCategoryAxisTitlePlaceholder", formatCategoryAxisTitleFont: "formatCategoryAxisTitleFont", formatCategoryAxisTitleFontPlaceholder: "formatCategoryAxisTitleFontPlaceholder", formatCategoryAxisTitleSize: "formatCategoryAxisTitleSize", formatCategoryAxisTitleSizePlaceholder: "formatCategoryAxisTitleSizePlaceholder", formatCategoryAxisTitleColor: "formatCategoryAxisTitleColor", formatCategoryAxisLabels: "formatCategoryAxisLabels", formatCategoryAxisLabelsFont: "formatCategoryAxisLabelsFont", formatCategoryAxisLabelsFontPlaceholder: "formatCategoryAxisLabelsFontPlaceholder", formatCategoryAxisLabelsSize: "formatCategoryAxisLabelsSize", formatCategoryAxisLabelsSizePlaceholder: "formatCategoryAxisLabelsSizePlaceholder", formatCategoryAxisLabelsColor: "formatCategoryAxisLabelsColor", formatCategoryAxisLabelsRotation: "formatCategoryAxisLabelsRotation", formatCategoryAxisLabelsRotationAuto: "formatCategoryAxisLabelsRotationAuto", formatCategoryAxisLabelsReverseOrder: "formatCategoryAxisLabelsReverseOrder", formatValueAxis: "formatValueAxis", formatYAxis: "formatYAxis", formatValueAxisTitle: "formatValueAxisTitle", formatValueAxisTitlePlaceholder: "formatValueAxisTitlePlaceholder", formatValueAxisTitleFont: "formatValueAxisTitleFont", formatValueAxisTitleFontPlaceholder: "formatValueAxisTitleFontPlaceholder", formatValueAxisTitleSize: "formatValueAxisTitleSize", formatValueAxisTitleSizePlaceholder: "formatValueAxisTitleSizePlaceholder", formatValueAxisTitleColor: "formatValueAxisTitleColor", formatValueAxisLabels: "formatValueAxisLabels", formatValueAxisLabelsFormat: "formatValueAxisLabelsFormat", formatValueAxisLabelsFormatText: "formatValueAxisLabelsFormatText", formatValueAxisLabelsFormatNumber: "formatValueAxisLabelsFormatNumber", formatValueAxisLabelsFormatCurrency: "formatValueAxisLabelsFormatCurrency", formatValueAxisLabelsFormatPercent: "formatValueAxisLabelsFormatPercent", formatValueAxisLabelsFont: "formatValueAxisLabelsFont", formatValueAxisLabelsFontPlaceholder: "formatValueAxisLabelsFontPlaceholder", formatValueAxisLabelsSize: "formatValueAxisLabelsSize", formatValueAxisLabelsSizePlaceholder: "formatValueAxisLabelsSizePlaceholder", formatValueAxisLabelsColor: "formatValueAxisLabelsColor", formatValueAxisLabelsRotation: "formatValueAxisLabelsRotation", formatValueAxisLabelsRotationAuto: "formatValueAxisLabelsRotationAuto" }, usesInheritance: true, ngImport: i0 });
|
2027
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: Messages, decorators: [{
|
2028
|
-
type: Directive,
|
2029
|
-
args: [{
|
2030
|
-
selector: '[kendoChartWizardMessages]'
|
2031
|
-
}]
|
2032
|
-
}], propDecorators: { windowTitle: [{
|
2033
|
-
type: Input
|
2034
|
-
}], exportButton: [{
|
2035
|
-
type: Input
|
2036
|
-
}], exportPDFButton: [{
|
2037
|
-
type: Input
|
2038
|
-
}], exportSVGButton: [{
|
2039
|
-
type: Input
|
2040
|
-
}], exportPNGButton: [{
|
2041
|
-
type: Input
|
2042
|
-
}], tabChart: [{
|
2043
|
-
type: Input
|
2044
|
-
}], tabData: [{
|
2045
|
-
type: Input
|
2046
|
-
}], tabFormat: [{
|
2047
|
-
type: Input
|
2048
|
-
}], barChart: [{
|
2049
|
-
type: Input
|
2050
|
-
}], barChartBar: [{
|
2051
|
-
type: Input
|
2052
|
-
}], barChartStackedBar: [{
|
2053
|
-
type: Input
|
2054
|
-
}], barChart100StackedBar: [{
|
2055
|
-
type: Input
|
2056
|
-
}], pieChart: [{
|
2057
|
-
type: Input
|
2058
|
-
}], pieChartPie: [{
|
2059
|
-
type: Input
|
2060
|
-
}], columnChart: [{
|
2061
|
-
type: Input
|
2062
|
-
}], columnChartColumn: [{
|
2063
|
-
type: Input
|
2064
|
-
}], columnChartStackedColumn: [{
|
2065
|
-
type: Input
|
2066
|
-
}], columnChart100StackedColumn: [{
|
2067
|
-
type: Input
|
2068
|
-
}], lineChart: [{
|
2069
|
-
type: Input
|
2070
|
-
}], lineChartLine: [{
|
2071
|
-
type: Input
|
2072
|
-
}], lineChartStackedLine: [{
|
2073
|
-
type: Input
|
2074
|
-
}], lineChart100StackedLine: [{
|
2075
|
-
type: Input
|
2076
|
-
}], scatterChart: [{
|
2077
|
-
type: Input
|
2078
|
-
}], scatterChartScatter: [{
|
2079
|
-
type: Input
|
2080
|
-
}], configuration: [{
|
2081
|
-
type: Input
|
2082
|
-
}], configurationCategoryAxis: [{
|
2083
|
-
type: Input
|
2084
|
-
}], configurationXAxis: [{
|
2085
|
-
type: Input
|
2086
|
-
}], configurationValueAxis: [{
|
2087
|
-
type: Input
|
2088
|
-
}], configurationSeries: [{
|
2089
|
-
type: Input
|
2090
|
-
}], configurationSeriesAdd: [{
|
2091
|
-
type: Input
|
2092
|
-
}], formatChartArea: [{
|
2093
|
-
type: Input
|
2094
|
-
}], formatChartAreaMargins: [{
|
2095
|
-
type: Input
|
2096
|
-
}], formatChartAreaMarginsAuto: [{
|
2097
|
-
type: Input
|
2098
|
-
}], formatChartAreaMarginsLeft: [{
|
2099
|
-
type: Input
|
2100
|
-
}], formatChartAreaMarginsRight: [{
|
2101
|
-
type: Input
|
2102
|
-
}], formatChartAreaMarginsTop: [{
|
2103
|
-
type: Input
|
2104
|
-
}], formatChartAreaMarginsBottom: [{
|
2105
|
-
type: Input
|
2106
|
-
}], formatChartAreaBackground: [{
|
2107
|
-
type: Input
|
2108
|
-
}], formatChartAreaBackgroundColor: [{
|
2109
|
-
type: Input
|
2110
|
-
}], formatTitle: [{
|
2111
|
-
type: Input
|
2112
|
-
}], formatTitleApplyTo: [{
|
2113
|
-
type: Input
|
2114
|
-
}], formatTitleChartTitle: [{
|
2115
|
-
type: Input
|
2116
|
-
}], formatTitleChartSubtitle: [{
|
2117
|
-
type: Input
|
2118
|
-
}], formatTitleLabel: [{
|
2119
|
-
type: Input
|
2120
|
-
}], formatTitleFont: [{
|
2121
|
-
type: Input
|
2122
|
-
}], formatTitleFontPlaceholder: [{
|
2123
|
-
type: Input
|
2124
|
-
}], formatTitleSize: [{
|
2125
|
-
type: Input
|
2126
|
-
}], formatTitleSizePlaceholder: [{
|
2127
|
-
type: Input
|
2128
|
-
}], formatTitleColor: [{
|
2129
|
-
type: Input
|
2130
|
-
}], formatSeries: [{
|
2131
|
-
type: Input
|
2132
|
-
}], formatSeriesApplyTo: [{
|
2133
|
-
type: Input
|
2134
|
-
}], formatSeriesAllSeries: [{
|
2135
|
-
type: Input
|
2136
|
-
}], formatSeriesColor: [{
|
2137
|
-
type: Input
|
2138
|
-
}], formatSeriesShowLabels: [{
|
2139
|
-
type: Input
|
2140
|
-
}], formatLegend: [{
|
2141
|
-
type: Input
|
2142
|
-
}], formatLegendShowLegend: [{
|
2143
|
-
type: Input
|
2144
|
-
}], formatLegendFont: [{
|
2145
|
-
type: Input
|
2146
|
-
}], formatLegendFontPlaceholder: [{
|
2147
|
-
type: Input
|
2148
|
-
}], formatLegendSize: [{
|
2149
|
-
type: Input
|
2150
|
-
}], formatLegendSizePlaceholder: [{
|
2151
|
-
type: Input
|
2152
|
-
}], formatLegendColor: [{
|
2153
|
-
type: Input
|
2154
|
-
}], formatLegendPosition: [{
|
2155
|
-
type: Input
|
2156
|
-
}], formatLegendPositionTop: [{
|
2157
|
-
type: Input
|
2158
|
-
}], formatLegendPositionBottom: [{
|
2159
|
-
type: Input
|
2160
|
-
}], formatLegendPositionLeft: [{
|
2161
|
-
type: Input
|
2162
|
-
}], formatLegendPositionRight: [{
|
2163
|
-
type: Input
|
2164
|
-
}], formatCategoryAxis: [{
|
2165
|
-
type: Input
|
2166
|
-
}], formatXAxis: [{
|
2167
|
-
type: Input
|
2168
|
-
}], formatCategoryAxisTitle: [{
|
2169
|
-
type: Input
|
2170
|
-
}], formatCategoryAxisTitlePlaceholder: [{
|
2171
|
-
type: Input
|
2172
|
-
}], formatCategoryAxisTitleFont: [{
|
2173
|
-
type: Input
|
2174
|
-
}], formatCategoryAxisTitleFontPlaceholder: [{
|
2175
|
-
type: Input
|
2176
|
-
}], formatCategoryAxisTitleSize: [{
|
2177
|
-
type: Input
|
2178
|
-
}], formatCategoryAxisTitleSizePlaceholder: [{
|
2179
|
-
type: Input
|
2180
|
-
}], formatCategoryAxisTitleColor: [{
|
2181
|
-
type: Input
|
2182
|
-
}], formatCategoryAxisLabels: [{
|
2183
|
-
type: Input
|
2184
|
-
}], formatCategoryAxisLabelsFont: [{
|
2185
|
-
type: Input
|
2186
|
-
}], formatCategoryAxisLabelsFontPlaceholder: [{
|
2187
|
-
type: Input
|
2188
|
-
}], formatCategoryAxisLabelsSize: [{
|
2189
|
-
type: Input
|
2190
|
-
}], formatCategoryAxisLabelsSizePlaceholder: [{
|
2191
|
-
type: Input
|
2192
|
-
}], formatCategoryAxisLabelsColor: [{
|
2193
|
-
type: Input
|
2194
|
-
}], formatCategoryAxisLabelsRotation: [{
|
2195
|
-
type: Input
|
2196
|
-
}], formatCategoryAxisLabelsRotationAuto: [{
|
2197
|
-
type: Input
|
2198
|
-
}], formatCategoryAxisLabelsReverseOrder: [{
|
2199
|
-
type: Input
|
2200
|
-
}], formatValueAxis: [{
|
2201
|
-
type: Input
|
2202
|
-
}], formatYAxis: [{
|
2203
|
-
type: Input
|
2204
|
-
}], formatValueAxisTitle: [{
|
2205
|
-
type: Input
|
2206
|
-
}], formatValueAxisTitlePlaceholder: [{
|
2207
|
-
type: Input
|
2208
|
-
}], formatValueAxisTitleFont: [{
|
2209
|
-
type: Input
|
2210
|
-
}], formatValueAxisTitleFontPlaceholder: [{
|
2211
|
-
type: Input
|
2212
|
-
}], formatValueAxisTitleSize: [{
|
2213
|
-
type: Input
|
2214
|
-
}], formatValueAxisTitleSizePlaceholder: [{
|
2215
|
-
type: Input
|
2216
|
-
}], formatValueAxisTitleColor: [{
|
2217
|
-
type: Input
|
2218
|
-
}], formatValueAxisLabels: [{
|
2219
|
-
type: Input
|
2220
|
-
}], formatValueAxisLabelsFormat: [{
|
2221
|
-
type: Input
|
2222
|
-
}], formatValueAxisLabelsFormatText: [{
|
2223
|
-
type: Input
|
2224
|
-
}], formatValueAxisLabelsFormatNumber: [{
|
2225
|
-
type: Input
|
2226
|
-
}], formatValueAxisLabelsFormatCurrency: [{
|
2227
|
-
type: Input
|
2228
|
-
}], formatValueAxisLabelsFormatPercent: [{
|
2229
|
-
type: Input
|
2230
|
-
}], formatValueAxisLabelsFont: [{
|
2231
|
-
type: Input
|
2232
|
-
}], formatValueAxisLabelsFontPlaceholder: [{
|
2233
|
-
type: Input
|
2234
|
-
}], formatValueAxisLabelsSize: [{
|
2235
|
-
type: Input
|
2236
|
-
}], formatValueAxisLabelsSizePlaceholder: [{
|
2237
|
-
type: Input
|
2238
|
-
}], formatValueAxisLabelsColor: [{
|
2239
|
-
type: Input
|
2240
|
-
}], formatValueAxisLabelsRotation: [{
|
2241
|
-
type: Input
|
2242
|
-
}], formatValueAxisLabelsRotationAuto: [{
|
2243
|
-
type: Input
|
2244
|
-
}] } });
|
2245
|
-
|
2246
|
-
/**
|
2247
|
-
* @hidden
|
2248
|
-
*/
|
2249
|
-
class LocalizedMessagesDirective extends Messages {
|
2250
|
-
constructor(service) {
|
2251
|
-
super();
|
2252
|
-
this.service = service;
|
2253
|
-
}
|
2254
|
-
}
|
2255
|
-
LocalizedMessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LocalizedMessagesDirective, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
|
2256
|
-
LocalizedMessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: LocalizedMessagesDirective, isStandalone: true, selector: "[kendoChartWizardLocalizedMessages]", providers: [
|
2257
|
-
{
|
2258
|
-
provide: Messages,
|
2259
|
-
useExisting: forwardRef(() => LocalizedMessagesDirective)
|
2260
|
-
}
|
2261
|
-
], usesInheritance: true, ngImport: i0 });
|
2262
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LocalizedMessagesDirective, decorators: [{
|
2263
|
-
type: Directive,
|
2264
|
-
args: [{
|
2265
|
-
providers: [
|
2266
|
-
{
|
2267
|
-
provide: Messages,
|
2268
|
-
useExisting: forwardRef(() => LocalizedMessagesDirective)
|
2269
|
-
}
|
2270
|
-
],
|
2271
|
-
selector: '[kendoChartWizardLocalizedMessages]',
|
2272
|
-
standalone: true
|
2273
|
-
}]
|
2274
|
-
}], ctorParameters: function () { return [{ type: i1.LocalizationService }]; } });
|
2275
|
-
|
2276
|
-
/**
|
2277
|
-
* Represents the Kendo UI for Angular Chart Wizard component.
|
2278
|
-
*
|
2279
|
-
* @example
|
2280
|
-
* ```html
|
2281
|
-
* <kendo-chartwizard [data]="data"></kendo-chartwizard>
|
2282
|
-
* ```
|
2283
|
-
*/
|
2284
|
-
class ChartWizardComponent {
|
2285
|
-
constructor(localization, stateService) {
|
2286
|
-
this.localization = localization;
|
2287
|
-
this.stateService = stateService;
|
2288
|
-
/**
|
2289
|
-
* Specifies if the configuration pane is initially collapsed.
|
2290
|
-
* @default false
|
2291
|
-
*/
|
2292
|
-
this.collapsedConfigurationPane = false;
|
2293
|
-
/**
|
2294
|
-
* The settings of the window.
|
2295
|
-
*/
|
2296
|
-
this.windowSettings = {};
|
2297
|
-
/**
|
2298
|
-
* @hidden
|
2299
|
-
*/
|
2300
|
-
this.showLicenseWatermark = false;
|
2301
|
-
/**
|
2302
|
-
* @hidden
|
2303
|
-
*/
|
2304
|
-
this.exportIcon = exportIcon;
|
2305
|
-
/**
|
2306
|
-
* @hidden
|
2307
|
-
*/
|
2308
|
-
this.exportDropdownItems = [];
|
2309
|
-
/**
|
2310
|
-
* Fires when the Chart Wizard Window is to be close.
|
2311
|
-
*/
|
2312
|
-
this.close = new EventEmitter();
|
2313
|
-
/**
|
2314
|
-
* Fires when the Chart is about to be exported. The event is preventable.
|
2315
|
-
*/
|
2316
|
-
this.export = new EventEmitter();
|
2317
|
-
/**
|
2318
|
-
* @hidden
|
2319
|
-
*/
|
2320
|
-
this.messages = ChartWizardCommon.messages;
|
2321
|
-
this.subscription = new Subscription();
|
2322
|
-
const isValid = validatePackage(packageMetadata);
|
2323
|
-
this.showLicenseWatermark = shouldShowValidationUI(isValid);
|
2324
|
-
this.stateService.direction = this.localization.rtl ? 'rtl' : 'ltr';
|
2325
|
-
}
|
2326
|
-
get dir() {
|
2327
|
-
return this.stateService.direction;
|
2328
|
-
}
|
2329
|
-
ngAfterViewInit() {
|
2330
|
-
this.subscription.add(this.localization.changes.subscribe(({ rtl }) => {
|
2331
|
-
this.stateService.direction = rtl ? 'rtl' : 'ltr';
|
2332
|
-
this.exportDropdownItems = [
|
2333
|
-
{
|
2334
|
-
text: this.messageFor('exportPDFButton'),
|
2335
|
-
svgIcon: filePdfIcon,
|
2336
|
-
},
|
2337
|
-
{
|
2338
|
-
text: this.messageFor('exportSVGButton'),
|
2339
|
-
svgIcon: fileIcon,
|
2340
|
-
},
|
2341
|
-
{
|
2342
|
-
text: this.messageFor('exportPNGButton'),
|
2343
|
-
svgIcon: fileImageIcon,
|
2344
|
-
},
|
2345
|
-
];
|
2346
|
-
}));
|
2347
|
-
this.stateService.dataTab = this.dataTab;
|
2348
|
-
}
|
2349
|
-
ngOnChanges(changes) {
|
2350
|
-
var _a, _b, _c;
|
2351
|
-
if (changes['data'] && ((_a = changes['data'].currentValue) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
2352
|
-
const data = changes['data'].currentValue;
|
2353
|
-
const clonedData = structuredClone(data);
|
2354
|
-
this.stateService.data = clonedData;
|
2355
|
-
this.stateService.state = createState(clonedData, this.stateService.state.seriesType);
|
2356
|
-
}
|
2357
|
-
if (changes['defaultState'] && ((_b = this.data) === null || _b === void 0 ? void 0 : _b.length) > 0) {
|
2358
|
-
const defaultState = changes['defaultState'].currentValue;
|
2359
|
-
if (defaultState.seriesType) {
|
2360
|
-
this.stateService.state.seriesType = defaultState.seriesType;
|
2361
|
-
this.stateService.state = mergeStates(this.stateService.state, createState(this.stateService.data, this.stateService.state.seriesType));
|
2362
|
-
}
|
2363
|
-
this.stateService.currentSeries = defaultAllSeriesItem;
|
2364
|
-
if (typeof defaultState.stack !== 'undefined') {
|
2365
|
-
this.stateService.state = updateState(this.stateService.state, ActionTypes.stacked, defaultState.stack);
|
2366
|
-
}
|
2367
|
-
(_c = this.propertyPane) === null || _c === void 0 ? void 0 : _c.detectChanges();
|
2368
|
-
}
|
2369
|
-
}
|
2370
|
-
ngOnDestroy() {
|
2371
|
-
if (this.subscription) {
|
2372
|
-
this.subscription.unsubscribe();
|
2373
|
-
}
|
2374
|
-
}
|
2375
|
-
/**
|
2376
|
-
* @hidden
|
2377
|
-
*/
|
2378
|
-
messageFor(key) {
|
2379
|
-
return this.localization.get(key);
|
2380
|
-
}
|
2381
|
-
/**
|
2382
|
-
* @hidden
|
2383
|
-
*/
|
2384
|
-
onExport(exportType) {
|
2385
|
-
var _a, _b, _c;
|
2386
|
-
const args = new ExportEvent(this.chart, this.exportOptions);
|
2387
|
-
this.export.emit(args);
|
2388
|
-
if (args.isDefaultPrevented()) {
|
2389
|
-
return;
|
2390
|
-
}
|
2391
|
-
switch (exportType.text) {
|
2392
|
-
case 'PDF File':
|
2393
|
-
exportPDF(this.chart.exportVisual(), (_a = this.exportOptions) === null || _a === void 0 ? void 0 : _a.pdf).then((dataURI) => {
|
2394
|
-
var _a;
|
2395
|
-
saveAs(dataURI, ((_a = this.exportOptions) === null || _a === void 0 ? void 0 : _a.fileName) || 'chart');
|
2396
|
-
});
|
2397
|
-
break;
|
2398
|
-
case 'SVG File':
|
2399
|
-
this.chart.exportSVG((_b = this.exportOptions) === null || _b === void 0 ? void 0 : _b.image).then((dataURI) => {
|
2400
|
-
var _a;
|
2401
|
-
saveAs(dataURI, ((_a = this.exportOptions) === null || _a === void 0 ? void 0 : _a.fileName) || 'chart');
|
2402
|
-
});
|
2403
|
-
break;
|
2404
|
-
case 'PNG File':
|
2405
|
-
this.chart.exportImage((_c = this.exportOptions) === null || _c === void 0 ? void 0 : _c.image).then((dataURI) => {
|
2406
|
-
var _a;
|
2407
|
-
saveAs(dataURI, ((_a = this.exportOptions) === null || _a === void 0 ? void 0 : _a.fileName) || 'chart');
|
2408
|
-
});
|
2409
|
-
break;
|
2410
|
-
}
|
2411
|
-
}
|
2412
|
-
/**
|
2413
|
-
* @hidden
|
2414
|
-
*/
|
2415
|
-
get windowWidth() {
|
2416
|
-
var _a;
|
2417
|
-
return isPresent((_a = this.windowSettings) === null || _a === void 0 ? void 0 : _a.width) ? this.windowSettings.width : this.stateService.windowSize.width;
|
2418
|
-
}
|
2419
|
-
/**
|
2420
|
-
* @hidden
|
2421
|
-
*/
|
2422
|
-
get windowHeight() {
|
2423
|
-
var _a;
|
2424
|
-
return isPresent((_a = this.windowSettings) === null || _a === void 0 ? void 0 : _a.height) ? this.windowSettings.height : this.stateService.windowSize.height;
|
2425
|
-
}
|
2426
|
-
}
|
2427
|
-
ChartWizardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardComponent, deps: [{ token: i1.LocalizationService }, { token: StateService }], target: i0.ɵɵFactoryTarget.Component });
|
2428
|
-
ChartWizardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChartWizardComponent, isStandalone: true, selector: "kendo-chartwizard", inputs: { data: "data", defaultState: "defaultState", exportOptions: "exportOptions", collapsedConfigurationPane: "collapsedConfigurationPane", windowSettings: "windowSettings" }, outputs: { close: "close", export: "export" }, host: { properties: { "attr.dir": "this.dir" } }, providers: [
|
2429
|
-
LocalizationService,
|
2430
|
-
{
|
2431
|
-
provide: L10N_PREFIX,
|
2432
|
-
useValue: 'kendo.chartwizard',
|
2433
|
-
},
|
2434
|
-
ChartWizardLocalizationService,
|
2435
|
-
{
|
2436
|
-
provide: LocalizationService,
|
2437
|
-
useExisting: ChartWizardLocalizationService
|
2438
|
-
},
|
2439
|
-
StateService
|
2440
|
-
], viewQueries: [{ propertyName: "chart", first: true, predicate: ChartComponent, descendants: true }, { propertyName: "propertyPane", first: true, predicate: ChartWizardPropertyPaneChartTabComponent, descendants: true }, { propertyName: "dataTab", first: true, predicate: ChartWizardPropertyPaneDataTabComponent, descendants: true }], exportAs: ["kendoChartWizard"], usesOnChanges: true, ngImport: i0, template: `
|
2441
|
-
<ng-container
|
2442
|
-
kendoChartWizardLocalizedMessages
|
2443
|
-
|
2444
|
-
i18n-windowTitle="kendo.chartwizard.windowTitle|The title of the window."
|
2445
|
-
[windowTitle]="messages.windowTitle"
|
2446
|
-
|
2447
|
-
i18n-exportButton="kendo.chartwizard.exportButton|The text of the Export DropDownButton."
|
2448
|
-
[exportButton]="messages.exportButton"
|
2449
|
-
|
2450
|
-
i18n-exportPDFButton="kendo.chartwizard.exportPDFButton|The text of the Export DropDownButton option that represents PDF."
|
2451
|
-
[exportPDFButton]="messages.exportPDFButton"
|
2452
|
-
|
2453
|
-
i18n-exportSVGButton="kendo.chartwizard.exportSVGButton|The text of the Export DropDownButton option that represents SVG."
|
2454
|
-
[exportSVGButton]="messages.exportSVGButton"
|
2455
|
-
|
2456
|
-
i18n-exportPNGButton="kendo.chartwizard.exportPNGButton|The text of the Export DropDownButton option that represents PNG."
|
2457
|
-
[exportPNGButton]="messages.exportPNGButton"
|
2458
|
-
|
2459
|
-
i18n-tabChart="kendo.chartwizard.tabChart|The text of the Chart tab of the property pane."
|
2460
|
-
[tabChart]="messages.tabChart"
|
2461
|
-
|
2462
|
-
i18n-tabData="kendo.chartwizard.tabData|The text of the Data tab of the property pane."
|
2463
|
-
[tabData]="messages.tabData"
|
2464
|
-
|
2465
|
-
i18n-tabFormat="kendo.chartwizard.tabFormat|The text of the Format tab of the property pane."
|
2466
|
-
[tabFormat]="messages.tabFormat"
|
2467
|
-
|
2468
|
-
i18n-barChart="kendo.chartwizard.barChart|The text of the Chart panel that represents Bar Charts."
|
2469
|
-
[barChart]="messages.barChart"
|
2470
|
-
|
2471
|
-
i18n-barChartBar="kendo.chartwizard.barChartBar|The text of the Bar Chart type."
|
2472
|
-
[barChartBar]="messages.barChartBar"
|
2473
|
-
|
2474
|
-
i18n-barChartStackedBar="kendo.chartwizard.barChartStackedBar|The text of the Stacked Bar Chart type."
|
2475
|
-
[barChartStackedBar]="messages.barChartStackedBar"
|
2476
|
-
|
2477
|
-
i18n-barChart100StackedBar="kendo.chartwizard.barChart100StackedBar|The text of the 100% Stacked Bar Chart type."
|
2478
|
-
[barChart100StackedBar]="messages.barChart100StackedBar"
|
2479
|
-
|
2480
|
-
i18n-pieChart="kendo.chartwizard.pieChart|The text of the Chart panel that represents Pie Charts."
|
2481
|
-
[pieChart]="messages.pieChart"
|
2482
|
-
|
2483
|
-
i18n-pieChartPie="kendo.chartwizard.pieChartPie|The text of the Pie Chart type."
|
2484
|
-
[pieChartPie]="messages.pieChartPie"
|
2485
|
-
|
2486
|
-
i18n-columnChart="kendo.chartwizard.columnChart|The text of the Chart panel that represents Column Charts."
|
2487
|
-
[columnChart]="messages.columnChart"
|
2488
|
-
|
2489
|
-
i18n-columnChartColumn="kendo.chartwizard.columnChartColumn|The text of the Column Chart type."
|
2490
|
-
[columnChartColumn]="messages.columnChartColumn"
|
2491
|
-
|
2492
|
-
i18n-columnChartStackedColumn="kendo.chartwizard.columnChartStackedColumn|The text of the Stacked Column Chart type."
|
2493
|
-
[columnChartStackedColumn]="messages.columnChartStackedColumn"
|
2494
|
-
|
2495
|
-
i18n-columnChart100StackedColumn="kendo.chartwizard.columnChart100StackedColumn|The text of the 100% Stacked Column Chart type."
|
2496
|
-
[columnChart100StackedColumn]="messages.columnChart100StackedColumn"
|
2497
|
-
|
2498
|
-
i18n-lineChart="kendo.chartwizard.lineChart|The text of the Chart panel that represents Line Charts."
|
2499
|
-
[lineChart]="messages.lineChart"
|
2500
|
-
|
2501
|
-
i18n-lineChartLine="kendo.chartwizard.lineChartLine|The text of the Line Chart type."
|
2502
|
-
[lineChartLine]="messages.lineChartLine"
|
2503
|
-
|
2504
|
-
i18n-lineChartStackedLine="kendo.chartwizard.lineChartStackedLine|The text of the Stacked Line Chart type."
|
2505
|
-
[lineChartStackedLine]="messages.lineChartStackedLine"
|
2506
|
-
|
2507
|
-
i18n-lineChart100StackedLine="kendo.chartwizard.lineChart100StackedLine|The text of the 100% Stacked Line Chart type."
|
2508
|
-
[lineChart100StackedLine]="messages.lineChart100StackedLine"
|
2509
|
-
|
2510
|
-
i18n-scatterChart="kendo.chartwizard.scatterChart|The text of the Chart panel that represents Scatter Charts."
|
2511
|
-
[scatterChart]="messages.scatterChart"
|
2512
|
-
|
2513
|
-
i18n-scatterChartScatter="kendo.chartwizard.scatterChartScatter|The text of the Scatter Chart type."
|
2514
|
-
[scatterChartScatter]="messages.scatterChartScatter"
|
2515
|
-
|
2516
|
-
i18n-configuration="kendo.chartwizard.configuration|The text of the Configuration panel of the Data tab."
|
2517
|
-
[configuration]="messages.configuration"
|
2518
|
-
|
2519
|
-
i18n-configurationCategoryAxis="kendo.chartwizard.configurationCategoryAxis|The caption of the Category Axis DropDown in the Configuration panel."
|
2520
|
-
[configurationCategoryAxis]="messages.configurationCategoryAxis"
|
2521
|
-
|
2522
|
-
i18n-configurationXAxis="kendo.chartwizard.configurationXAxis|The caption of the X Axis DropDown in the Configuration panel when a Scatter Chart is selected."
|
2523
|
-
[configurationXAxis]="messages.configurationXAxis"
|
2524
|
-
|
2525
|
-
i18n-configurationValueAxis="kendo.chartwizard.configurationValueAxis|The caption of the Value Axis DropDown in the Configuration panel when a Pie Chart is selected."
|
2526
|
-
[configurationValueAxis]="messages.configurationValueAxis"
|
2527
|
-
|
2528
|
-
i18n-configurationSeries="kendo.chartwizard.configurationSeries|The text of the Series Grid in the Configuration panel when a Categorical Chart is selected."
|
2529
|
-
[configurationSeries]="messages.configurationSeries"
|
2530
|
-
|
2531
|
-
i18n-configurationSeriesAdd="kendo.chartwizard.configurationSeriesAdd|The text of the Add Series button in the Grid of the Configuration panel."
|
2532
|
-
[configurationSeriesAdd]="messages.configurationSeriesAdd"
|
2533
|
-
|
2534
|
-
i18n-formatChartArea="kendo.chartwizard.formatChartArea|The text of the Chart Area panel of the Format tab."
|
2535
|
-
[formatChartArea]="messages.formatChartArea"
|
2536
|
-
|
2537
|
-
i18n-formatChartAreaMargins="kendo.chartwizard.formatChartAreaMargins|The text of the Margins settings of the Chart Area panel."
|
2538
|
-
[formatChartAreaMargins]="messages.formatChartAreaMargins"
|
2539
|
-
|
2540
|
-
i18n-formatChartAreaMarginsAuto="kendo.chartwizard.formatChartAreaMarginsAuto|The placeholder of the Margins settings of the Chart Area panel."
|
2541
|
-
[formatChartAreaMarginsAuto]="messages.formatChartAreaMarginsAuto"
|
2542
|
-
|
2543
|
-
i18n-formatChartAreaMarginsLeft="kendo.chartwizard.formatChartAreaMarginsLeft|The label of the Left margin setting of the Chart Area panel."
|
2544
|
-
[formatChartAreaMarginsLeft]="messages.formatChartAreaMarginsLeft"
|
2545
|
-
|
2546
|
-
i18n-formatChartAreaMarginsRight="kendo.chartwizard.formatChartAreaMarginsRight|The label of the Right margin setting of the Chart Area panel."
|
2547
|
-
[formatChartAreaMarginsRight]="messages.formatChartAreaMarginsRight"
|
2548
|
-
|
2549
|
-
i18n-formatChartAreaMarginsTop="kendo.chartwizard.formatChartAreaMarginsTop|The label of the Top margin setting of the Chart Area panel."
|
2550
|
-
[formatChartAreaMarginsTop]="messages.formatChartAreaMarginsTop"
|
2551
|
-
|
2552
|
-
i18n-formatChartAreaMarginsBottom="kendo.chartwizard.formatChartAreaMarginsBottom|The label of the Bottom margin setting of the Chart Area panel."
|
2553
|
-
[formatChartAreaMarginsBottom]="messages.formatChartAreaMarginsBottom"
|
2554
|
-
|
2555
|
-
i18n-formatChartAreaBackground="kendo.chartwizard.formatChartAreaBackground|The text of the Background settings of the Chart Area panel."
|
2556
|
-
[formatChartAreaBackground]="messages.formatChartAreaBackground"
|
2557
|
-
|
2558
|
-
i18n-formatChartAreaBackgroundColor="kendo.chartwizard.formatChartAreaBackgroundColor|The label of the Color background setting of the Chart Area panel."
|
2559
|
-
[formatChartAreaBackgroundColor]="messages.formatChartAreaBackgroundColor"
|
2560
|
-
|
2561
|
-
i18n-formatTitle="kendo.chartwizard.formatTitle|The text of the Title panel of the Format tab."
|
2562
|
-
[formatTitle]="messages.formatTitle"
|
2563
|
-
|
2564
|
-
i18n-formatTitleApplyTo="kendo.chartwizard.formatTitleApplyTo|The label of the Apply to DropDown of the Title panel."
|
2565
|
-
[formatTitleApplyTo]="messages.formatTitleApplyTo"
|
2566
|
-
|
2567
|
-
i18n-formatTitleChartTitle="kendo.chartwizard.formatTitleChartTitle|The text of the Chart Title option of the Apply to DropDown in the Title panel."
|
2568
|
-
[formatTitleChartTitle]="messages.formatTitleChartTitle"
|
2569
|
-
|
2570
|
-
i18n-formatTitleChartSubtitle="kendo.chartwizard.formatTitleChartSubtitle|The text of the Chart Subtitle option of the Apply to DropDown in the Title panel."
|
2571
|
-
[formatTitleChartSubtitle]="messages.formatTitleChartSubtitle"
|
2572
|
-
|
2573
|
-
i18n-formatTitleLabel="kendo.chartwizard.formatTitleLabel|The label of the Title input of the Title panel."
|
2574
|
-
[formatTitleLabel]="messages.formatTitleLabel"
|
2575
|
-
|
2576
|
-
i18n-formatTitleFont="kendo.chartwizard.formatTitleFont|The label of the Font setting of the Title panel."
|
2577
|
-
[formatTitleFont]="messages.formatTitleFont"
|
2578
|
-
|
2579
|
-
i18n-formatTitleFontPlaceholder="kendo.chartwizard.formatTitleFontPlaceholder|The placeholder of the Font setting of the Title panel."
|
2580
|
-
[formatTitleFontPlaceholder]="messages.formatTitleFontPlaceholder"
|
2581
|
-
|
2582
|
-
i18n-formatTitleSize="kendo.chartwizard.formatTitleSize|The label of the Size setting of the Title panel."
|
2583
|
-
[formatTitleSize]="messages.formatTitleSize"
|
2584
|
-
|
2585
|
-
i18n-formatTitleSizePlaceholder="kendo.chartwizard.formatTitleSizePlaceholder|The placeholder of the Size setting of the Title panel."
|
2586
|
-
[formatTitleSizePlaceholder]="messages.formatTitleSizePlaceholder"
|
2587
|
-
|
2588
|
-
i18n-formatTitleColor="kendo.chartwizard.formatTitleColor|The label of the Color setting of the Title panel."
|
2589
|
-
[formatTitleColor]="messages.formatTitleColor"
|
2590
|
-
|
2591
|
-
i18n-formatSeries="kendo.chartwizard.formatSeries|The text of the Series panel of the Format tab."
|
2592
|
-
[formatSeries]="messages.formatSeries"
|
2593
|
-
|
2594
|
-
i18n-formatSeriesApplyTo="kendo.chartwizard.formatSeriesApplyTo|The label of the Apply to DropDown of the Series panel."
|
2595
|
-
[formatSeriesApplyTo]="messages.formatSeriesApplyTo"
|
2596
|
-
|
2597
|
-
i18n-formatSeriesAllSeries="kendo.chartwizard.formatSeriesAllSeries|The text of the All Series option of the Apply to DropDown in the Series panel."
|
2598
|
-
[formatSeriesAllSeries]="messages.formatSeriesAllSeries"
|
2599
|
-
|
2600
|
-
i18n-formatSeriesColor="kendo.chartwizard.formatSeriesColor|The label of the Color setting of the Series panel."
|
2601
|
-
[formatSeriesColor]="messages.formatSeriesColor"
|
2602
|
-
|
2603
|
-
i18n-formatSeriesShowLabels="kendo.chartwizard.formatSeriesShowLabels|The label of the Show Labels checkbox of the Series panel."
|
2604
|
-
[formatSeriesShowLabels]="messages.formatSeriesShowLabels"
|
2605
|
-
|
2606
|
-
i18n-formatLegend="kendo.chartwizard.formatLegend|The text of the Legend panel of the Format tab."
|
2607
|
-
[formatLegend]="messages.formatLegend"
|
2608
|
-
|
2609
|
-
i18n-formatLegendShowLegend="kendo.chartwizard.formatLegendShowLegend|The label of the Show Legend switch of the Legend panel."
|
2610
|
-
[formatLegendShowLegend]="messages.formatLegendShowLegend"
|
2611
|
-
|
2612
|
-
i18n-formatLegendFont="kendo.chartwizard.formatLegendFont|The label of the Font setting of the Legend panel."
|
2613
|
-
[formatLegendFont]="messages.formatLegendFont"
|
2614
|
-
|
2615
|
-
i18n-formatLegendFontPlaceholder="kendo.chartwizard.formatLegendFontPlaceholder|The placeholder of the Font setting of the Legend panel."
|
2616
|
-
[formatLegendFontPlaceholder]="messages.formatLegendFontPlaceholder"
|
2617
|
-
|
2618
|
-
i18n-formatLegendSize="kendo.chartwizard.formatLegendSize|The label of the Size setting of the Legend panel."
|
2619
|
-
[formatLegendSize]="messages.formatLegendSize"
|
2620
|
-
|
2621
|
-
i18n-formatLegendSizePlaceholder="kendo.chartwizard.formatLegendSizePlaceholder|The placeholder of the Size setting of the Legend panel."
|
2622
|
-
[formatLegendSizePlaceholder]="messages.formatLegendSizePlaceholder"
|
2623
|
-
|
2624
|
-
i18n-formatLegendColor="kendo.chartwizard.formatLegendColor|The label of the Color setting of the Legend panel."
|
2625
|
-
[formatLegendColor]="messages.formatLegendColor"
|
2626
|
-
|
2627
|
-
i18n-formatLegendPosition="kendo.chartwizard.formatLegendPosition|The label of the Posiiton DropDown of the Legend panel."
|
2628
|
-
[formatLegendPosition]="messages.formatLegendPosition"
|
2629
|
-
|
2630
|
-
i18n-formatLegendPositionTop="kendo.chartwizard.formatLegendPositionTop|The text of the Top option of the Position DropDown of the Legend panel."
|
2631
|
-
[formatLegendPositionTop]="messages.formatLegendPositionTop"
|
2632
|
-
|
2633
|
-
i18n-formatLegendPositionBottom="kendo.chartwizard.formatLegendPositionBottom|The text of the Bottom option of the Position DropDown of the Legend panel."
|
2634
|
-
[formatLegendPositionBottom]="messages.formatLegendPositionBottom"
|
2635
|
-
|
2636
|
-
i18n-formatLegendPositionLeft="kendo.chartwizard.formatLegendPositionLeft|The text of the Left option of the Position DropDown of the Legend panel."
|
2637
|
-
[formatLegendPositionLeft]="messages.formatLegendPositionLeft"
|
2638
|
-
|
2639
|
-
i18n-formatLegendPositionRight="kendo.chartwizard.formatLegendPositionRight|The text of the Right option of the Position DropDown of the Legend panel."
|
2640
|
-
[formatLegendPositionRight]="messages.formatLegendPositionRight"
|
2641
|
-
|
2642
|
-
i18n-formatCategoryAxis="kendo.chartwizard.formatCategoryAxis|The text of the Category Axis panel of the Format tab."
|
2643
|
-
[formatCategoryAxis]="messages.formatCategoryAxis"
|
2644
|
-
|
2645
|
-
i18n-formatXAxis="kendo.chartwizard.formatXAxis|The text of the X Axis panel of the Format tab when a Scatter Chart is selected."
|
2646
|
-
[formatXAxis]="messages.formatXAxis"
|
2647
|
-
|
2648
|
-
i18n-formatCategoryAxisTitle="kendo.chartwizard.formatCategoryAxisTitle|The label of the Title settings of the Category Axis panel."
|
2649
|
-
[formatCategoryAxisTitle]="messages.formatCategoryAxisTitle"
|
2650
|
-
|
2651
|
-
i18n-formatCategoryAxisTitlePlaceholder="kendo.chartwizard.formatCategoryAxisTitlePlaceholder|The placeholder of the Title input of the Category Axis panel."
|
2652
|
-
[formatCategoryAxisTitlePlaceholder]="messages.formatCategoryAxisTitlePlaceholder"
|
2653
|
-
|
2654
|
-
i18n-formatCategoryAxisTitleFont="kendo.chartwizard.formatCategoryAxisTitleFont|The label of the Font settings of the Title in the Category Axis panel."
|
2655
|
-
[formatCategoryAxisTitleFont]="messages.formatCategoryAxisTitleFont"
|
2656
|
-
|
2657
|
-
i18n-formatCategoryAxisTitleFontPlaceholder="kendo.chartwizard.formatCategoryAxisTitleFontPlaceholder|The placeholder of the Font settings of the Title in the Category Axis panel."
|
2658
|
-
[formatCategoryAxisTitleFontPlaceholder]="messages.formatCategoryAxisTitleFontPlaceholder"
|
2659
|
-
|
2660
|
-
i18n-formatCategoryAxisTitleSize="kendo.chartwizard.formatCategoryAxisTitleSize|The label of the Size settings of the Title in the Category Axis panel."
|
2661
|
-
[formatCategoryAxisTitleSize]="messages.formatCategoryAxisTitleSize"
|
2662
|
-
|
2663
|
-
i18n-formatCategoryAxisTitleSizePlaceholder="kendo.chartwizard.formatCategoryAxisTitleSizePlaceholder|The placeholder of the Size settings of the Title in the Category Axis panel."
|
2664
|
-
[formatCategoryAxisTitleSizePlaceholder]="messages.formatCategoryAxisTitleSizePlaceholder"
|
2665
|
-
|
2666
|
-
i18n-formatCategoryAxisTitleColor="kendo.chartwizard.formatCategoryAxisTitleColor|The label of the Color settings of the Title in the Category Axis panel."
|
2667
|
-
[formatCategoryAxisTitleColor]="messages.formatCategoryAxisTitleColor"
|
2668
|
-
|
2669
|
-
i18n-formatCategoryAxisLabels="kendo.chartwizard.formatCategoryAxisLabels|The label of the Labels settings of the Category Axis panel."
|
2670
|
-
[formatCategoryAxisLabels]="messages.formatCategoryAxisLabels"
|
2671
|
-
|
2672
|
-
i18n-formatCategoryAxisLabelsFont="kendo.chartwizard.formatCategoryAxisLabelsFont|The label of the Font settings of the Labels in the Category Axis panel."
|
2673
|
-
[formatCategoryAxisLabelsFont]="messages.formatCategoryAxisLabelsFont"
|
2674
|
-
|
2675
|
-
i18n-formatCategoryAxisLabelsFontPlaceholder="kendo.chartwizard.formatCategoryAxisLabelsFontPlaceholder|The placeholder of the Font settings of the Labels in the Category Axis panel."
|
2676
|
-
[formatCategoryAxisLabelsFontPlaceholder]="messages.formatCategoryAxisLabelsFontPlaceholder"
|
2677
|
-
|
2678
|
-
i18n-formatCategoryAxisLabelsSize="kendo.chartwizard.formatCategoryAxisLabelsSize|The label of the Size settings of the Labels in the Category Axis panel."
|
2679
|
-
[formatCategoryAxisLabelsSize]="messages.formatCategoryAxisLabelsSize"
|
2680
|
-
|
2681
|
-
i18n-formatCategoryAxisLabelsSizePlaceholder="kendo.chartwizard.formatCategoryAxisLabelsSizePlaceholder|The placeholder of the Size settings of the Labels in the Category Axis panel."
|
2682
|
-
[formatCategoryAxisLabelsSizePlaceholder]="messages.formatCategoryAxisLabelsSizePlaceholder"
|
2683
|
-
|
2684
|
-
i18n-formatCategoryAxisLabelsColor="kendo.chartwizard.formatCategoryAxisLabelsColor|The label of the Color settings of the Labels in the Category Axis panel."
|
2685
|
-
[formatCategoryAxisLabelsColor]="messages.formatCategoryAxisLabelsColor"
|
2686
|
-
|
2687
|
-
i18n-formatCategoryAxisLabelsRotation="kendo.chartwizard.formatCategoryAxisLabelsRotation|The label of the Rotation settings of the Labels in the Category Axis panel."
|
2688
|
-
[formatCategoryAxisLabelsRotation]="messages.formatCategoryAxisLabelsRotation"
|
2689
|
-
|
2690
|
-
i18n-formatCategoryAxisLabelsRotationAuto="kendo.chartwizard.formatCategoryAxisLabelsRotationAuto|The Auto option of the Rotation settings of the Labels in the Category Axis panel."
|
2691
|
-
[formatCategoryAxisLabelsRotationAuto]="messages.formatCategoryAxisLabelsRotationAuto"
|
2692
|
-
|
2693
|
-
i18n-formatCategoryAxisLabelsReverseOrder="kendo.chartwizard.formatCategoryAxisLabelsReverseOrder|The label of the Reverse Order checkbox of the Labels in the Category Axis panel."
|
2694
|
-
[formatCategoryAxisLabelsReverseOrder]="messages.formatCategoryAxisLabelsReverseOrder"
|
2695
|
-
|
2696
|
-
i18n-formatValueAxis="kendo.chartwizard.formatValueAxis|The text of the Value Axis panel of the Format tab."
|
2697
|
-
[formatValueAxis]="messages.formatValueAxis"
|
2698
|
-
|
2699
|
-
i18n-formatYAxis="kendo.chartwizard.formatYAxis|The text of the Y Axis panel of the Format tab."
|
2700
|
-
[formatYAxis]="messages.formatYAxis"
|
2701
|
-
|
2702
|
-
i18n-formatValueAxisTitle="kendo.chartwizard.formatValueAxisTitle|The label of the Title settings of the Value Axis panel."
|
2703
|
-
[formatValueAxisTitle]="messages.formatValueAxisTitle"
|
2704
|
-
|
2705
|
-
i18n-formatValueAxisTitlePlaceholder="kendo.chartwizard.formatValueAxisTitlePlaceholder|The placeholder of the Title settings of the Value Axis panel."
|
2706
|
-
[formatValueAxisTitlePlaceholder]="messages.formatValueAxisTitlePlaceholder"
|
2707
|
-
|
2708
|
-
i18n-formatValueAxisTitleFont="kendo.chartwizard.formatValueAxisTitleFont|The label of the Font settings of the Value Axis panel."
|
2709
|
-
[formatValueAxisTitleFont]="messages.formatValueAxisTitleFont"
|
2710
|
-
|
2711
|
-
i18n-formatValueAxisTitleFontPlaceholder="kendo.chartwizard.formatValueAxisTitleFontPlaceholder|The placeholder of the Font settings of the Value Axis panel."
|
2712
|
-
[formatYAxis]="messages.formatValueAxisTitleFontPlaceholder"
|
2713
|
-
|
2714
|
-
i18n-formatValueAxisTitleSize="kendo.chartwizard.formatValueAxisTitleSize|The label of the Size settings of the Value Axis panel."
|
2715
|
-
[formatValueAxisTitleSize]="messages.formatValueAxisTitleSize"
|
2716
|
-
|
2717
|
-
i18n-formatValueAxisTitleSizePlaceholder="kendo.chartwizard.formatValueAxisTitleSizePlaceholder|The placeholder of the Size settings of the Value Axis panel."
|
2718
|
-
[formatValueAxisTitleSizePlaceholder]="messages.formatValueAxisTitleSizePlaceholder"
|
2719
|
-
|
2720
|
-
i18n-formatValueAxisTitleColor="kendo.chartwizard.formatValueAxisTitleColor|The label of the Color settings of the Value Axis panel."
|
2721
|
-
[formatValueAxisTitleColor]="messages.formatValueAxisTitleColor"
|
2722
|
-
|
2723
|
-
i18n-formatValueAxisLabels="kendo.chartwizard.formatValueAxisLabels|The label of the Labels settings of the Value Axis panel."
|
2724
|
-
[formatValueAxisLabels]="messages.formatValueAxisLabels"
|
2725
|
-
|
2726
|
-
i18n-formatValueAxisLabelsFormat="kendo.chartwizard.formatValueAxisLabelsFormat|The label of the Format DropDown of the Labels settings of the Value Axis panel."
|
2727
|
-
[formatValueAxisLabelsFormat]="messages.formatValueAxisLabelsFormat"
|
2728
|
-
|
2729
|
-
i18n-formatValueAxisLabelsFormatText="kendo.chartwizard.formatValueAxisLabelsFormatText|The Text option of the Format DropDown of the Labels settings of the Value Axis panel."
|
2730
|
-
[formatValueAxisLabelsFormatText]="messages.formatValueAxisLabelsFormatText"
|
2731
|
-
|
2732
|
-
i18n-formatValueAxisLabelsFormatNumber="kendo.chartwizard.formatValueAxisLabelsFormatNumber|The Number option of the Format DropDown of the Labels settings of the Value Axis panel."
|
2733
|
-
[formatValueAxisLabelsFormatNumber]="messages.formatValueAxisLabelsFormatNumber"
|
2734
|
-
|
2735
|
-
i18n-formatValueAxisLabelsFormatCurrency="kendo.chartwizard.formatValueAxisLabelsFormatCurrency|The Currency option of the Format DropDown of the Labels settings of the Value Axis panel."
|
2736
|
-
[formatValueAxisLabelsFormatCurrency]="messages.formatValueAxisLabelsFormatCurrency"
|
2737
|
-
|
2738
|
-
i18n-formatValueAxisLabelsFormatPercent="kendo.chartwizard.formatValueAxisLabelsFormatPercent|The Percent option of the Format DropDown of the Labels settings of the Value Axis panel."
|
2739
|
-
[formatValueAxisLabelsFormatPercent]="messages.formatValueAxisLabelsFormatPercent"
|
2740
|
-
|
2741
|
-
i18n-formatValueAxisLabelsFont="kendo.chartwizard.formatValueAxisLabelsFont|The label of the Font settings of the Labels in the Value Axis panel."
|
2742
|
-
[formatValueAxisLabelsFont]="messages.formatValueAxisLabelsFont"
|
2743
|
-
|
2744
|
-
i18n-formatValueAxisLabelsFontPlaceholder="kendo.chartwizard.formatValueAxisLabelsFontPlaceholder|The placeholder of the Font settings of the Labels in the Value Axis panel."
|
2745
|
-
[formatValueAxisLabelsFontPlaceholder]="messages.formatValueAxisLabelsFontPlaceholder"
|
2746
|
-
|
2747
|
-
i18n-formatValueAxisLabelsSize="kendo.chartwizard.formatValueAxisLabelsSize|The label of the Size settings of the Labels in the Value Axis panel."
|
2748
|
-
[formatValueAxisLabelsSize]="messages.formatValueAxisLabelsSize"
|
2749
|
-
|
2750
|
-
i18n-formatValueAxisLabelsSizePlaceholder="kendo.chartwizard.formatValueAxisLabelsSizePlaceholder|The placeholder of the Size settings of the Labels in the Value Axis panel."
|
2751
|
-
[formatValueAxisLabelsSizePlaceholder]="messages.formatValueAxisLabelsSizePlaceholder"
|
2752
|
-
|
2753
|
-
i18n-formatValueAxisLabelsColor="kendo.chartwizard.formatValueAxisLabelsColor|The label of the Color settings of the Labels in the Value Axis panel."
|
2754
|
-
[formatValueAxisLabelsColor]="messages.formatValueAxisLabelsColor"
|
2755
|
-
|
2756
|
-
i18n-formatValueAxisLabelsRotation="kendo.chartwizard.formatValueAxisLabelsRotation|The label of the Rotation settings of the Labels in the Value Axis panel."
|
2757
|
-
[formatValueAxisLabelsRotation]="messages.formatValueAxisLabelsRotation"
|
2758
|
-
|
2759
|
-
i18n-formatValueAxisLabelsRotationAuto="kendo.chartwizard.formatValueAxisLabelsRotationAuto|The Auto option of the Rotation settings of the Labels in the Value Axis panel."
|
2760
|
-
[formatValueAxisLabelsRotationAuto]="messages.formatValueAxisLabelsRotationAuto"
|
2761
|
-
|
2762
|
-
></ng-container>
|
2763
|
-
<div *ngIf="windowSettings?.modal" @overlayAppear class="k-overlay"> </div>
|
2764
|
-
<kendo-window
|
2765
|
-
class="k-chart-wizard"
|
2766
|
-
[title]="messageFor('windowTitle')"
|
2767
|
-
[width]="windowWidth"
|
2768
|
-
[height]="windowHeight"
|
2769
|
-
[minWidth]="windowSettings?.minWidth"
|
2770
|
-
[minHeight]="windowSettings?.minHeight"
|
2771
|
-
[state]="windowSettings?.state"
|
2772
|
-
[resizable]="true"
|
2773
|
-
(close)="close.emit()"
|
2774
|
-
>
|
2775
|
-
<kendo-splitter class="k-chart-wizard-splitter">
|
2776
|
-
<kendo-splitter-pane class="k-chart-wizard-preview-pane">
|
2777
|
-
<div class="k-preview-pane-header">
|
2778
|
-
<kendo-dropdownbutton
|
2779
|
-
[svgIcon]="exportIcon"
|
2780
|
-
[data]="exportDropdownItems"
|
2781
|
-
textField="text"
|
2782
|
-
fillMode="flat"
|
2783
|
-
(itemClick)="onExport($event)"
|
2784
|
-
>
|
2785
|
-
{{ messageFor('exportButton') }}
|
2786
|
-
</kendo-dropdownbutton>
|
2787
|
-
</div>
|
2788
|
-
<div class="k-preview-pane-content" [style.height]="'calc(100% - 50px)'">
|
2789
|
-
<kendo-chart [transitions]="false" [style.width.%]="100" [style.height.%]="100">
|
2790
|
-
<kendo-chart-title
|
2791
|
-
[text]="stateService.state.title?.text"
|
2792
|
-
[font]="stateService.state.title?.font"
|
2793
|
-
[color]="stateService.state.title?.color"
|
2794
|
-
></kendo-chart-title>
|
2795
|
-
<kendo-chart-subtitle
|
2796
|
-
[text]="stateService.state.subtitle?.text"
|
2797
|
-
[font]="stateService.state.subtitle?.font"
|
2798
|
-
[color]="stateService.state.subtitle?.color"
|
2799
|
-
></kendo-chart-subtitle>
|
2800
|
-
<kendo-chart-area
|
2801
|
-
[background]="stateService.state.area?.background"
|
2802
|
-
[margin]="stateService.state.area?.margin"
|
2803
|
-
>
|
2804
|
-
</kendo-chart-area>
|
2805
|
-
<kendo-chart-category-axis *ngIf="stateService.state.categoryAxis">
|
2806
|
-
<kendo-chart-category-axis-item
|
2807
|
-
*ngFor="let axis of stateService.state.categoryAxis"
|
2808
|
-
[categories]="axis.categories"
|
2809
|
-
[title]="{
|
2810
|
-
text: axis.title?.text,
|
2811
|
-
font: axis.title?.font,
|
2812
|
-
color: axis.title?.color
|
2813
|
-
}"
|
2814
|
-
[labels]="{
|
2815
|
-
rotation: axis.labels?.rotation,
|
2816
|
-
font: axis.labels?.font,
|
2817
|
-
color: axis.labels?.color
|
2818
|
-
}"
|
2819
|
-
[reverse]="axis.reverse"
|
2820
|
-
>
|
2821
|
-
</kendo-chart-category-axis-item>
|
2822
|
-
<kendo-chart-value-axis *ngIf="stateService.state.valueAxis">
|
2823
|
-
<kendo-chart-value-axis-item
|
2824
|
-
*ngFor="let axis of stateService.state.valueAxis"
|
2825
|
-
[title]="{
|
2826
|
-
text: axis.title?.text,
|
2827
|
-
font: axis.title?.font,
|
2828
|
-
color: axis.title?.color
|
2829
|
-
}"
|
2830
|
-
[labels]="{
|
2831
|
-
rotation: axis.labels?.rotation,
|
2832
|
-
font: axis.labels?.font,
|
2833
|
-
color: axis.labels?.color,
|
2834
|
-
format: axis.labels?.format
|
2835
|
-
}"
|
2836
|
-
>
|
2837
|
-
</kendo-chart-value-axis-item>
|
2838
|
-
</kendo-chart-value-axis>
|
2839
|
-
</kendo-chart-category-axis>
|
2840
|
-
<kendo-chart-series>
|
2841
|
-
<kendo-chart-series-item
|
2842
|
-
*ngFor="let series of stateService.state.series"
|
2843
|
-
[type]="series.type"
|
2844
|
-
[data]="series.data"
|
2845
|
-
[stack]="series.stack"
|
2846
|
-
[field]="series.field"
|
2847
|
-
[categoryField]="series.categoryField"
|
2848
|
-
[name]="series.name"
|
2849
|
-
[color]="series.color"
|
2850
|
-
[labels]="{ visible: series.labels?.visible }"
|
2851
|
-
[width]="series.width"
|
2852
|
-
>
|
2853
|
-
</kendo-chart-series-item>
|
2854
|
-
</kendo-chart-series>
|
2855
|
-
<kendo-chart-legend
|
2856
|
-
[visible]="stateService.state.legend?.visible"
|
2857
|
-
[position]="stateService.state.legend?.position"
|
2858
|
-
[labels]="stateService.state.legend?.labels"
|
2859
|
-
>
|
2860
|
-
</kendo-chart-legend>
|
2861
|
-
</kendo-chart>
|
2862
|
-
</div>
|
2863
|
-
</kendo-splitter-pane>
|
2864
|
-
<kendo-splitter-pane class="k-chart-wizard-property-pane" [collapsible]="true" [collapsed]="collapsedConfigurationPane" [size]="stateService.splitterPaneSize">
|
2865
|
-
<kendo-tabstrip [keepTabContent]="true">
|
2866
|
-
<kendo-tabstrip-tab [title]="messageFor('tabChart')" [selected]="true">
|
2867
|
-
<ng-template kendoTabContent>
|
2868
|
-
<kendo-chartwizard-property-pane-chart-tab>
|
2869
|
-
</kendo-chartwizard-property-pane-chart-tab>
|
2870
|
-
</ng-template>
|
2871
|
-
</kendo-tabstrip-tab>
|
2872
|
-
<kendo-tabstrip-tab [title]="messageFor('tabData')">
|
2873
|
-
<ng-template kendoTabContent>
|
2874
|
-
<kendo-chartwizard-property-pane-data-tab> </kendo-chartwizard-property-pane-data-tab>
|
2875
|
-
</ng-template>
|
2876
|
-
</kendo-tabstrip-tab>
|
2877
|
-
<kendo-tabstrip-tab [title]="messageFor('tabFormat')">
|
2878
|
-
<ng-template kendoTabContent>
|
2879
|
-
<kendo-chartwizard-property-pane-format-tab>
|
2880
|
-
</kendo-chartwizard-property-pane-format-tab>
|
2881
|
-
</ng-template>
|
2882
|
-
</kendo-tabstrip-tab>
|
2883
|
-
</kendo-tabstrip>
|
2884
|
-
</kendo-splitter-pane>
|
2885
|
-
</kendo-splitter>
|
2886
|
-
<div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
|
2887
|
-
</kendo-window>
|
2888
|
-
`, isInline: true, dependencies: [{ kind: "component", type: WindowComponent, selector: "kendo-window", inputs: ["autoFocusedElement", "title", "draggable", "resizable", "themeColor", "keepContent", "state", "minWidth", "minHeight", "width", "height", "top", "left"], outputs: ["dragStart", "dragEnd", "resizeStart", "resizeEnd", "close", "widthChange", "heightChange", "topChange", "leftChange", "stateChange"], exportAs: ["kendoWindow"] }, { kind: "component", type: SplitterComponent, selector: "kendo-splitter", inputs: ["orientation", "splitbarWidth", "resizeStep", "splitterBarClass"], outputs: ["layoutChange"], exportAs: ["kendoSplitter"] }, { kind: "component", type: SplitterPaneComponent, selector: "kendo-splitter-pane", inputs: ["order", "size", "splitterBarAttributes", "splitterBarClass", "min", "max", "resizable", "collapsible", "scrollable", "collapsed", "orientation", "containsSplitter", "overlayContent"], outputs: ["sizeChange", "collapsedChange"], exportAs: ["kendoSplitterPane"] }, { kind: "component", type: DropDownButtonComponent, selector: "kendo-dropdownbutton", inputs: ["arrowIcon", "icon", "svgIcon", "iconClass", "imageUrl", "textField", "data", "size", "rounded", "fillMode", "themeColor", "buttonAttributes"], outputs: ["itemClick", "focus", "blur"], exportAs: ["kendoDropDownButton"] }, { kind: "component", type: ChartComponent, selector: "kendo-chart", inputs: ["pannable", "renderAs", "seriesColors", "subtitle", "title", "transitions", "zoomable", "axisDefaults", "categoryAxis", "chartArea", "legend", "panes", "paneDefaults", "plotArea", "series", "seriesDefaults", "tooltip", "valueAxis", "xAxis", "yAxis", "resizeRateLimit", "popupSettings", "drilldownLevel"], outputs: ["axisLabelClick", "drag", "dragEnd", "dragStart", "legendItemHover", "legendItemLeave", "noteClick", "noteHover", "noteLeave", "paneRender", "plotAreaClick", "plotAreaHover", "plotAreaLeave", "render", "select", "selectEnd", "selectStart", "seriesClick", "drilldown", "seriesHover", "seriesOver", "seriesLeave", "zoom", "zoomEnd", "zoomStart", "legendItemClick", "drilldownLevelChange"], exportAs: ["kendoChart"] }, { kind: "component", type: TitleComponent, selector: "kendo-chart-title", inputs: ["align", "background", "border", "color", "font", "margin", "padding", "position", "text", "description", "visible"] }, { kind: "component", type: SubtitleComponent, selector: "kendo-chart-subtitle", inputs: ["align", "background", "border", "color", "font", "margin", "padding", "position", "text", "visible"] }, { kind: "component", type: ChartAreaComponent, selector: "kendo-chart-area", inputs: ["background", "border", "height", "margin", "opacity", "width"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CategoryAxisComponent, selector: "kendo-chart-category-axis" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: CategoryAxisItemComponent, selector: "kendo-chart-category-axis-item", inputs: ["autoBaseUnitSteps", "axisCrossingValue", "background", "baseUnit", "baseUnitStep", "categories", "color", "justified", "line", "majorGridLines", "majorTicks", "max", "maxDateGroups", "maxDivisions", "min", "minorGridLines", "minorTicks", "name", "pane", "plotBands", "reverse", "roundToBaseUnit", "startAngle", "type", "visible", "weekStartDay", "crosshair", "labels", "notes", "select", "title", "rangeLabels"] }, { kind: "component", type: ValueAxisComponent, selector: "kendo-chart-value-axis" }, { kind: "component", type: ValueAxisItemComponent, selector: "kendo-chart-value-axis-item", inputs: ["axisCrossingValue", "background", "color", "line", "majorGridLines", "majorTicks", "majorUnit", "max", "min", "minorGridLines", "minorTicks", "minorUnit", "name", "narrowRange", "pane", "plotBands", "reverse", "type", "visible", "crosshair", "labels", "notes", "title"] }, { kind: "component", type: SeriesComponent, selector: "kendo-chart-series" }, { kind: "component", type: SeriesItemComponent, selector: "kendo-chart-series-item", inputs: ["aggregate", "autoFit", "axis", "border", "categoryAxis", "categoryField", "closeField", "color", "colorField", "connectors", "currentField", "dashType", "data", "downColor", "downColorField", "drilldownField", "dynamicHeight", "dynamicSlope", "errorHighField", "errorLowField", "explodeField", "field", "fromField", "gap", "highField", "holeSize", "line", "lowField", "lowerField", "margin", "maxSize", "mean", "meanField", "median", "medianField", "minSize", "missingValues", "name", "neckRatio", "negativeColor", "negativeValues", "noteTextField", "opacity", "openField", "outliersField", "overlay", "padding", "q1Field", "q3Field", "segmentSpacing", "size", "sizeField", "spacing", "stack", "startAngle", "style", "summaryField", "target", "toField", "type", "upperField", "visible", "visibleInLegend", "visibleInLegendField", "visual", "width", "whiskers", "xAxis", "xErrorHighField", "xErrorLowField", "xField", "yAxis", "yErrorHighField", "yErrorLowField", "yField", "zIndex", "trendline", "for", "legendItem", "errorBars", "extremes", "highlight", "labels", "markers", "notes", "outliers", "tooltip"] }, { kind: "component", type: LegendComponent, selector: "kendo-chart-legend", inputs: ["align", "background", "border", "height", "labels", "margin", "offsetX", "offsetY", "orientation", "padding", "position", "reverse", "visible", "width", "markers", "spacing", "inactiveItems", "item", "title"] }, { kind: "component", type: TabStripComponent, selector: "kendo-tabstrip", inputs: ["height", "animate", "tabAlignment", "tabPosition", "keepTabContent", "closable", "scrollable", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { kind: "component", type: TabStripTabComponent, selector: "kendo-tabstrip-tab", inputs: ["title", "disabled", "cssClass", "cssStyle", "selected", "closable", "closeIcon", "closeIconClass", "closeSVGIcon"], exportAs: ["kendoTabStripTab"] }, { kind: "directive", type: TabContentDirective, selector: "[kendoTabContent]" }, { kind: "component", type: ChartWizardPropertyPaneChartTabComponent, selector: "kendo-chartwizard-property-pane-chart-tab" }, { kind: "component", type: ChartWizardPropertyPaneFormatTabComponent, selector: "kendo-chartwizard-property-pane-format-tab" }, { kind: "component", type: ChartWizardPropertyPaneDataTabComponent, selector: "kendo-chartwizard-property-pane-data-tab" }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }, { kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoChartWizardLocalizedMessages]" }], animations: [
|
2889
|
-
trigger('overlayAppear', [
|
2890
|
-
state('in', style({ opacity: 1 })),
|
2891
|
-
transition('void => *', [style({ opacity: 0.1 }), animate('.3s cubic-bezier(.2, .6, .4, 1)')])
|
2892
|
-
])
|
2893
|
-
], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
2894
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardComponent, decorators: [{
|
2895
|
-
type: Component,
|
2896
|
-
args: [{
|
2897
|
-
animations: [
|
2898
|
-
trigger('overlayAppear', [
|
2899
|
-
state('in', style({ opacity: 1 })),
|
2900
|
-
transition('void => *', [style({ opacity: 0.1 }), animate('.3s cubic-bezier(.2, .6, .4, 1)')])
|
2901
|
-
])
|
2902
|
-
],
|
2903
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
2904
|
-
exportAs: 'kendoChartWizard',
|
2905
|
-
providers: [
|
2906
|
-
LocalizationService,
|
2907
|
-
{
|
2908
|
-
provide: L10N_PREFIX,
|
2909
|
-
useValue: 'kendo.chartwizard',
|
2910
|
-
},
|
2911
|
-
ChartWizardLocalizationService,
|
2912
|
-
{
|
2913
|
-
provide: LocalizationService,
|
2914
|
-
useExisting: ChartWizardLocalizationService
|
2915
|
-
},
|
2916
|
-
StateService
|
2917
|
-
],
|
2918
|
-
selector: 'kendo-chartwizard',
|
2919
|
-
template: `
|
2920
|
-
<ng-container
|
2921
|
-
kendoChartWizardLocalizedMessages
|
2922
|
-
|
2923
|
-
i18n-windowTitle="kendo.chartwizard.windowTitle|The title of the window."
|
2924
|
-
[windowTitle]="messages.windowTitle"
|
2925
|
-
|
2926
|
-
i18n-exportButton="kendo.chartwizard.exportButton|The text of the Export DropDownButton."
|
2927
|
-
[exportButton]="messages.exportButton"
|
2928
|
-
|
2929
|
-
i18n-exportPDFButton="kendo.chartwizard.exportPDFButton|The text of the Export DropDownButton option that represents PDF."
|
2930
|
-
[exportPDFButton]="messages.exportPDFButton"
|
2931
|
-
|
2932
|
-
i18n-exportSVGButton="kendo.chartwizard.exportSVGButton|The text of the Export DropDownButton option that represents SVG."
|
2933
|
-
[exportSVGButton]="messages.exportSVGButton"
|
2934
|
-
|
2935
|
-
i18n-exportPNGButton="kendo.chartwizard.exportPNGButton|The text of the Export DropDownButton option that represents PNG."
|
2936
|
-
[exportPNGButton]="messages.exportPNGButton"
|
2937
|
-
|
2938
|
-
i18n-tabChart="kendo.chartwizard.tabChart|The text of the Chart tab of the property pane."
|
2939
|
-
[tabChart]="messages.tabChart"
|
2940
|
-
|
2941
|
-
i18n-tabData="kendo.chartwizard.tabData|The text of the Data tab of the property pane."
|
2942
|
-
[tabData]="messages.tabData"
|
2943
|
-
|
2944
|
-
i18n-tabFormat="kendo.chartwizard.tabFormat|The text of the Format tab of the property pane."
|
2945
|
-
[tabFormat]="messages.tabFormat"
|
2946
|
-
|
2947
|
-
i18n-barChart="kendo.chartwizard.barChart|The text of the Chart panel that represents Bar Charts."
|
2948
|
-
[barChart]="messages.barChart"
|
2949
|
-
|
2950
|
-
i18n-barChartBar="kendo.chartwizard.barChartBar|The text of the Bar Chart type."
|
2951
|
-
[barChartBar]="messages.barChartBar"
|
2952
|
-
|
2953
|
-
i18n-barChartStackedBar="kendo.chartwizard.barChartStackedBar|The text of the Stacked Bar Chart type."
|
2954
|
-
[barChartStackedBar]="messages.barChartStackedBar"
|
2955
|
-
|
2956
|
-
i18n-barChart100StackedBar="kendo.chartwizard.barChart100StackedBar|The text of the 100% Stacked Bar Chart type."
|
2957
|
-
[barChart100StackedBar]="messages.barChart100StackedBar"
|
2958
|
-
|
2959
|
-
i18n-pieChart="kendo.chartwizard.pieChart|The text of the Chart panel that represents Pie Charts."
|
2960
|
-
[pieChart]="messages.pieChart"
|
2961
|
-
|
2962
|
-
i18n-pieChartPie="kendo.chartwizard.pieChartPie|The text of the Pie Chart type."
|
2963
|
-
[pieChartPie]="messages.pieChartPie"
|
2964
|
-
|
2965
|
-
i18n-columnChart="kendo.chartwizard.columnChart|The text of the Chart panel that represents Column Charts."
|
2966
|
-
[columnChart]="messages.columnChart"
|
2967
|
-
|
2968
|
-
i18n-columnChartColumn="kendo.chartwizard.columnChartColumn|The text of the Column Chart type."
|
2969
|
-
[columnChartColumn]="messages.columnChartColumn"
|
2970
|
-
|
2971
|
-
i18n-columnChartStackedColumn="kendo.chartwizard.columnChartStackedColumn|The text of the Stacked Column Chart type."
|
2972
|
-
[columnChartStackedColumn]="messages.columnChartStackedColumn"
|
2973
|
-
|
2974
|
-
i18n-columnChart100StackedColumn="kendo.chartwizard.columnChart100StackedColumn|The text of the 100% Stacked Column Chart type."
|
2975
|
-
[columnChart100StackedColumn]="messages.columnChart100StackedColumn"
|
2976
|
-
|
2977
|
-
i18n-lineChart="kendo.chartwizard.lineChart|The text of the Chart panel that represents Line Charts."
|
2978
|
-
[lineChart]="messages.lineChart"
|
2979
|
-
|
2980
|
-
i18n-lineChartLine="kendo.chartwizard.lineChartLine|The text of the Line Chart type."
|
2981
|
-
[lineChartLine]="messages.lineChartLine"
|
2982
|
-
|
2983
|
-
i18n-lineChartStackedLine="kendo.chartwizard.lineChartStackedLine|The text of the Stacked Line Chart type."
|
2984
|
-
[lineChartStackedLine]="messages.lineChartStackedLine"
|
2985
|
-
|
2986
|
-
i18n-lineChart100StackedLine="kendo.chartwizard.lineChart100StackedLine|The text of the 100% Stacked Line Chart type."
|
2987
|
-
[lineChart100StackedLine]="messages.lineChart100StackedLine"
|
2988
|
-
|
2989
|
-
i18n-scatterChart="kendo.chartwizard.scatterChart|The text of the Chart panel that represents Scatter Charts."
|
2990
|
-
[scatterChart]="messages.scatterChart"
|
2991
|
-
|
2992
|
-
i18n-scatterChartScatter="kendo.chartwizard.scatterChartScatter|The text of the Scatter Chart type."
|
2993
|
-
[scatterChartScatter]="messages.scatterChartScatter"
|
2994
|
-
|
2995
|
-
i18n-configuration="kendo.chartwizard.configuration|The text of the Configuration panel of the Data tab."
|
2996
|
-
[configuration]="messages.configuration"
|
2997
|
-
|
2998
|
-
i18n-configurationCategoryAxis="kendo.chartwizard.configurationCategoryAxis|The caption of the Category Axis DropDown in the Configuration panel."
|
2999
|
-
[configurationCategoryAxis]="messages.configurationCategoryAxis"
|
3000
|
-
|
3001
|
-
i18n-configurationXAxis="kendo.chartwizard.configurationXAxis|The caption of the X Axis DropDown in the Configuration panel when a Scatter Chart is selected."
|
3002
|
-
[configurationXAxis]="messages.configurationXAxis"
|
3003
|
-
|
3004
|
-
i18n-configurationValueAxis="kendo.chartwizard.configurationValueAxis|The caption of the Value Axis DropDown in the Configuration panel when a Pie Chart is selected."
|
3005
|
-
[configurationValueAxis]="messages.configurationValueAxis"
|
3006
|
-
|
3007
|
-
i18n-configurationSeries="kendo.chartwizard.configurationSeries|The text of the Series Grid in the Configuration panel when a Categorical Chart is selected."
|
3008
|
-
[configurationSeries]="messages.configurationSeries"
|
3009
|
-
|
3010
|
-
i18n-configurationSeriesAdd="kendo.chartwizard.configurationSeriesAdd|The text of the Add Series button in the Grid of the Configuration panel."
|
3011
|
-
[configurationSeriesAdd]="messages.configurationSeriesAdd"
|
3012
|
-
|
3013
|
-
i18n-formatChartArea="kendo.chartwizard.formatChartArea|The text of the Chart Area panel of the Format tab."
|
3014
|
-
[formatChartArea]="messages.formatChartArea"
|
3015
|
-
|
3016
|
-
i18n-formatChartAreaMargins="kendo.chartwizard.formatChartAreaMargins|The text of the Margins settings of the Chart Area panel."
|
3017
|
-
[formatChartAreaMargins]="messages.formatChartAreaMargins"
|
3018
|
-
|
3019
|
-
i18n-formatChartAreaMarginsAuto="kendo.chartwizard.formatChartAreaMarginsAuto|The placeholder of the Margins settings of the Chart Area panel."
|
3020
|
-
[formatChartAreaMarginsAuto]="messages.formatChartAreaMarginsAuto"
|
3021
|
-
|
3022
|
-
i18n-formatChartAreaMarginsLeft="kendo.chartwizard.formatChartAreaMarginsLeft|The label of the Left margin setting of the Chart Area panel."
|
3023
|
-
[formatChartAreaMarginsLeft]="messages.formatChartAreaMarginsLeft"
|
3024
|
-
|
3025
|
-
i18n-formatChartAreaMarginsRight="kendo.chartwizard.formatChartAreaMarginsRight|The label of the Right margin setting of the Chart Area panel."
|
3026
|
-
[formatChartAreaMarginsRight]="messages.formatChartAreaMarginsRight"
|
3027
|
-
|
3028
|
-
i18n-formatChartAreaMarginsTop="kendo.chartwizard.formatChartAreaMarginsTop|The label of the Top margin setting of the Chart Area panel."
|
3029
|
-
[formatChartAreaMarginsTop]="messages.formatChartAreaMarginsTop"
|
3030
|
-
|
3031
|
-
i18n-formatChartAreaMarginsBottom="kendo.chartwizard.formatChartAreaMarginsBottom|The label of the Bottom margin setting of the Chart Area panel."
|
3032
|
-
[formatChartAreaMarginsBottom]="messages.formatChartAreaMarginsBottom"
|
3033
|
-
|
3034
|
-
i18n-formatChartAreaBackground="kendo.chartwizard.formatChartAreaBackground|The text of the Background settings of the Chart Area panel."
|
3035
|
-
[formatChartAreaBackground]="messages.formatChartAreaBackground"
|
3036
|
-
|
3037
|
-
i18n-formatChartAreaBackgroundColor="kendo.chartwizard.formatChartAreaBackgroundColor|The label of the Color background setting of the Chart Area panel."
|
3038
|
-
[formatChartAreaBackgroundColor]="messages.formatChartAreaBackgroundColor"
|
3039
|
-
|
3040
|
-
i18n-formatTitle="kendo.chartwizard.formatTitle|The text of the Title panel of the Format tab."
|
3041
|
-
[formatTitle]="messages.formatTitle"
|
3042
|
-
|
3043
|
-
i18n-formatTitleApplyTo="kendo.chartwizard.formatTitleApplyTo|The label of the Apply to DropDown of the Title panel."
|
3044
|
-
[formatTitleApplyTo]="messages.formatTitleApplyTo"
|
3045
|
-
|
3046
|
-
i18n-formatTitleChartTitle="kendo.chartwizard.formatTitleChartTitle|The text of the Chart Title option of the Apply to DropDown in the Title panel."
|
3047
|
-
[formatTitleChartTitle]="messages.formatTitleChartTitle"
|
3048
|
-
|
3049
|
-
i18n-formatTitleChartSubtitle="kendo.chartwizard.formatTitleChartSubtitle|The text of the Chart Subtitle option of the Apply to DropDown in the Title panel."
|
3050
|
-
[formatTitleChartSubtitle]="messages.formatTitleChartSubtitle"
|
3051
|
-
|
3052
|
-
i18n-formatTitleLabel="kendo.chartwizard.formatTitleLabel|The label of the Title input of the Title panel."
|
3053
|
-
[formatTitleLabel]="messages.formatTitleLabel"
|
3054
|
-
|
3055
|
-
i18n-formatTitleFont="kendo.chartwizard.formatTitleFont|The label of the Font setting of the Title panel."
|
3056
|
-
[formatTitleFont]="messages.formatTitleFont"
|
3057
|
-
|
3058
|
-
i18n-formatTitleFontPlaceholder="kendo.chartwizard.formatTitleFontPlaceholder|The placeholder of the Font setting of the Title panel."
|
3059
|
-
[formatTitleFontPlaceholder]="messages.formatTitleFontPlaceholder"
|
3060
|
-
|
3061
|
-
i18n-formatTitleSize="kendo.chartwizard.formatTitleSize|The label of the Size setting of the Title panel."
|
3062
|
-
[formatTitleSize]="messages.formatTitleSize"
|
3063
|
-
|
3064
|
-
i18n-formatTitleSizePlaceholder="kendo.chartwizard.formatTitleSizePlaceholder|The placeholder of the Size setting of the Title panel."
|
3065
|
-
[formatTitleSizePlaceholder]="messages.formatTitleSizePlaceholder"
|
3066
|
-
|
3067
|
-
i18n-formatTitleColor="kendo.chartwizard.formatTitleColor|The label of the Color setting of the Title panel."
|
3068
|
-
[formatTitleColor]="messages.formatTitleColor"
|
3069
|
-
|
3070
|
-
i18n-formatSeries="kendo.chartwizard.formatSeries|The text of the Series panel of the Format tab."
|
3071
|
-
[formatSeries]="messages.formatSeries"
|
3072
|
-
|
3073
|
-
i18n-formatSeriesApplyTo="kendo.chartwizard.formatSeriesApplyTo|The label of the Apply to DropDown of the Series panel."
|
3074
|
-
[formatSeriesApplyTo]="messages.formatSeriesApplyTo"
|
3075
|
-
|
3076
|
-
i18n-formatSeriesAllSeries="kendo.chartwizard.formatSeriesAllSeries|The text of the All Series option of the Apply to DropDown in the Series panel."
|
3077
|
-
[formatSeriesAllSeries]="messages.formatSeriesAllSeries"
|
3078
|
-
|
3079
|
-
i18n-formatSeriesColor="kendo.chartwizard.formatSeriesColor|The label of the Color setting of the Series panel."
|
3080
|
-
[formatSeriesColor]="messages.formatSeriesColor"
|
3081
|
-
|
3082
|
-
i18n-formatSeriesShowLabels="kendo.chartwizard.formatSeriesShowLabels|The label of the Show Labels checkbox of the Series panel."
|
3083
|
-
[formatSeriesShowLabels]="messages.formatSeriesShowLabels"
|
3084
|
-
|
3085
|
-
i18n-formatLegend="kendo.chartwizard.formatLegend|The text of the Legend panel of the Format tab."
|
3086
|
-
[formatLegend]="messages.formatLegend"
|
3087
|
-
|
3088
|
-
i18n-formatLegendShowLegend="kendo.chartwizard.formatLegendShowLegend|The label of the Show Legend switch of the Legend panel."
|
3089
|
-
[formatLegendShowLegend]="messages.formatLegendShowLegend"
|
3090
|
-
|
3091
|
-
i18n-formatLegendFont="kendo.chartwizard.formatLegendFont|The label of the Font setting of the Legend panel."
|
3092
|
-
[formatLegendFont]="messages.formatLegendFont"
|
3093
|
-
|
3094
|
-
i18n-formatLegendFontPlaceholder="kendo.chartwizard.formatLegendFontPlaceholder|The placeholder of the Font setting of the Legend panel."
|
3095
|
-
[formatLegendFontPlaceholder]="messages.formatLegendFontPlaceholder"
|
3096
|
-
|
3097
|
-
i18n-formatLegendSize="kendo.chartwizard.formatLegendSize|The label of the Size setting of the Legend panel."
|
3098
|
-
[formatLegendSize]="messages.formatLegendSize"
|
3099
|
-
|
3100
|
-
i18n-formatLegendSizePlaceholder="kendo.chartwizard.formatLegendSizePlaceholder|The placeholder of the Size setting of the Legend panel."
|
3101
|
-
[formatLegendSizePlaceholder]="messages.formatLegendSizePlaceholder"
|
3102
|
-
|
3103
|
-
i18n-formatLegendColor="kendo.chartwizard.formatLegendColor|The label of the Color setting of the Legend panel."
|
3104
|
-
[formatLegendColor]="messages.formatLegendColor"
|
3105
|
-
|
3106
|
-
i18n-formatLegendPosition="kendo.chartwizard.formatLegendPosition|The label of the Posiiton DropDown of the Legend panel."
|
3107
|
-
[formatLegendPosition]="messages.formatLegendPosition"
|
3108
|
-
|
3109
|
-
i18n-formatLegendPositionTop="kendo.chartwizard.formatLegendPositionTop|The text of the Top option of the Position DropDown of the Legend panel."
|
3110
|
-
[formatLegendPositionTop]="messages.formatLegendPositionTop"
|
3111
|
-
|
3112
|
-
i18n-formatLegendPositionBottom="kendo.chartwizard.formatLegendPositionBottom|The text of the Bottom option of the Position DropDown of the Legend panel."
|
3113
|
-
[formatLegendPositionBottom]="messages.formatLegendPositionBottom"
|
3114
|
-
|
3115
|
-
i18n-formatLegendPositionLeft="kendo.chartwizard.formatLegendPositionLeft|The text of the Left option of the Position DropDown of the Legend panel."
|
3116
|
-
[formatLegendPositionLeft]="messages.formatLegendPositionLeft"
|
3117
|
-
|
3118
|
-
i18n-formatLegendPositionRight="kendo.chartwizard.formatLegendPositionRight|The text of the Right option of the Position DropDown of the Legend panel."
|
3119
|
-
[formatLegendPositionRight]="messages.formatLegendPositionRight"
|
3120
|
-
|
3121
|
-
i18n-formatCategoryAxis="kendo.chartwizard.formatCategoryAxis|The text of the Category Axis panel of the Format tab."
|
3122
|
-
[formatCategoryAxis]="messages.formatCategoryAxis"
|
3123
|
-
|
3124
|
-
i18n-formatXAxis="kendo.chartwizard.formatXAxis|The text of the X Axis panel of the Format tab when a Scatter Chart is selected."
|
3125
|
-
[formatXAxis]="messages.formatXAxis"
|
3126
|
-
|
3127
|
-
i18n-formatCategoryAxisTitle="kendo.chartwizard.formatCategoryAxisTitle|The label of the Title settings of the Category Axis panel."
|
3128
|
-
[formatCategoryAxisTitle]="messages.formatCategoryAxisTitle"
|
3129
|
-
|
3130
|
-
i18n-formatCategoryAxisTitlePlaceholder="kendo.chartwizard.formatCategoryAxisTitlePlaceholder|The placeholder of the Title input of the Category Axis panel."
|
3131
|
-
[formatCategoryAxisTitlePlaceholder]="messages.formatCategoryAxisTitlePlaceholder"
|
3132
|
-
|
3133
|
-
i18n-formatCategoryAxisTitleFont="kendo.chartwizard.formatCategoryAxisTitleFont|The label of the Font settings of the Title in the Category Axis panel."
|
3134
|
-
[formatCategoryAxisTitleFont]="messages.formatCategoryAxisTitleFont"
|
3135
|
-
|
3136
|
-
i18n-formatCategoryAxisTitleFontPlaceholder="kendo.chartwizard.formatCategoryAxisTitleFontPlaceholder|The placeholder of the Font settings of the Title in the Category Axis panel."
|
3137
|
-
[formatCategoryAxisTitleFontPlaceholder]="messages.formatCategoryAxisTitleFontPlaceholder"
|
3138
|
-
|
3139
|
-
i18n-formatCategoryAxisTitleSize="kendo.chartwizard.formatCategoryAxisTitleSize|The label of the Size settings of the Title in the Category Axis panel."
|
3140
|
-
[formatCategoryAxisTitleSize]="messages.formatCategoryAxisTitleSize"
|
3141
|
-
|
3142
|
-
i18n-formatCategoryAxisTitleSizePlaceholder="kendo.chartwizard.formatCategoryAxisTitleSizePlaceholder|The placeholder of the Size settings of the Title in the Category Axis panel."
|
3143
|
-
[formatCategoryAxisTitleSizePlaceholder]="messages.formatCategoryAxisTitleSizePlaceholder"
|
3144
|
-
|
3145
|
-
i18n-formatCategoryAxisTitleColor="kendo.chartwizard.formatCategoryAxisTitleColor|The label of the Color settings of the Title in the Category Axis panel."
|
3146
|
-
[formatCategoryAxisTitleColor]="messages.formatCategoryAxisTitleColor"
|
3147
|
-
|
3148
|
-
i18n-formatCategoryAxisLabels="kendo.chartwizard.formatCategoryAxisLabels|The label of the Labels settings of the Category Axis panel."
|
3149
|
-
[formatCategoryAxisLabels]="messages.formatCategoryAxisLabels"
|
3150
|
-
|
3151
|
-
i18n-formatCategoryAxisLabelsFont="kendo.chartwizard.formatCategoryAxisLabelsFont|The label of the Font settings of the Labels in the Category Axis panel."
|
3152
|
-
[formatCategoryAxisLabelsFont]="messages.formatCategoryAxisLabelsFont"
|
3153
|
-
|
3154
|
-
i18n-formatCategoryAxisLabelsFontPlaceholder="kendo.chartwizard.formatCategoryAxisLabelsFontPlaceholder|The placeholder of the Font settings of the Labels in the Category Axis panel."
|
3155
|
-
[formatCategoryAxisLabelsFontPlaceholder]="messages.formatCategoryAxisLabelsFontPlaceholder"
|
3156
|
-
|
3157
|
-
i18n-formatCategoryAxisLabelsSize="kendo.chartwizard.formatCategoryAxisLabelsSize|The label of the Size settings of the Labels in the Category Axis panel."
|
3158
|
-
[formatCategoryAxisLabelsSize]="messages.formatCategoryAxisLabelsSize"
|
3159
|
-
|
3160
|
-
i18n-formatCategoryAxisLabelsSizePlaceholder="kendo.chartwizard.formatCategoryAxisLabelsSizePlaceholder|The placeholder of the Size settings of the Labels in the Category Axis panel."
|
3161
|
-
[formatCategoryAxisLabelsSizePlaceholder]="messages.formatCategoryAxisLabelsSizePlaceholder"
|
3162
|
-
|
3163
|
-
i18n-formatCategoryAxisLabelsColor="kendo.chartwizard.formatCategoryAxisLabelsColor|The label of the Color settings of the Labels in the Category Axis panel."
|
3164
|
-
[formatCategoryAxisLabelsColor]="messages.formatCategoryAxisLabelsColor"
|
3165
|
-
|
3166
|
-
i18n-formatCategoryAxisLabelsRotation="kendo.chartwizard.formatCategoryAxisLabelsRotation|The label of the Rotation settings of the Labels in the Category Axis panel."
|
3167
|
-
[formatCategoryAxisLabelsRotation]="messages.formatCategoryAxisLabelsRotation"
|
3168
|
-
|
3169
|
-
i18n-formatCategoryAxisLabelsRotationAuto="kendo.chartwizard.formatCategoryAxisLabelsRotationAuto|The Auto option of the Rotation settings of the Labels in the Category Axis panel."
|
3170
|
-
[formatCategoryAxisLabelsRotationAuto]="messages.formatCategoryAxisLabelsRotationAuto"
|
3171
|
-
|
3172
|
-
i18n-formatCategoryAxisLabelsReverseOrder="kendo.chartwizard.formatCategoryAxisLabelsReverseOrder|The label of the Reverse Order checkbox of the Labels in the Category Axis panel."
|
3173
|
-
[formatCategoryAxisLabelsReverseOrder]="messages.formatCategoryAxisLabelsReverseOrder"
|
3174
|
-
|
3175
|
-
i18n-formatValueAxis="kendo.chartwizard.formatValueAxis|The text of the Value Axis panel of the Format tab."
|
3176
|
-
[formatValueAxis]="messages.formatValueAxis"
|
3177
|
-
|
3178
|
-
i18n-formatYAxis="kendo.chartwizard.formatYAxis|The text of the Y Axis panel of the Format tab."
|
3179
|
-
[formatYAxis]="messages.formatYAxis"
|
3180
|
-
|
3181
|
-
i18n-formatValueAxisTitle="kendo.chartwizard.formatValueAxisTitle|The label of the Title settings of the Value Axis panel."
|
3182
|
-
[formatValueAxisTitle]="messages.formatValueAxisTitle"
|
3183
|
-
|
3184
|
-
i18n-formatValueAxisTitlePlaceholder="kendo.chartwizard.formatValueAxisTitlePlaceholder|The placeholder of the Title settings of the Value Axis panel."
|
3185
|
-
[formatValueAxisTitlePlaceholder]="messages.formatValueAxisTitlePlaceholder"
|
3186
|
-
|
3187
|
-
i18n-formatValueAxisTitleFont="kendo.chartwizard.formatValueAxisTitleFont|The label of the Font settings of the Value Axis panel."
|
3188
|
-
[formatValueAxisTitleFont]="messages.formatValueAxisTitleFont"
|
3189
|
-
|
3190
|
-
i18n-formatValueAxisTitleFontPlaceholder="kendo.chartwizard.formatValueAxisTitleFontPlaceholder|The placeholder of the Font settings of the Value Axis panel."
|
3191
|
-
[formatYAxis]="messages.formatValueAxisTitleFontPlaceholder"
|
3192
|
-
|
3193
|
-
i18n-formatValueAxisTitleSize="kendo.chartwizard.formatValueAxisTitleSize|The label of the Size settings of the Value Axis panel."
|
3194
|
-
[formatValueAxisTitleSize]="messages.formatValueAxisTitleSize"
|
3195
|
-
|
3196
|
-
i18n-formatValueAxisTitleSizePlaceholder="kendo.chartwizard.formatValueAxisTitleSizePlaceholder|The placeholder of the Size settings of the Value Axis panel."
|
3197
|
-
[formatValueAxisTitleSizePlaceholder]="messages.formatValueAxisTitleSizePlaceholder"
|
3198
|
-
|
3199
|
-
i18n-formatValueAxisTitleColor="kendo.chartwizard.formatValueAxisTitleColor|The label of the Color settings of the Value Axis panel."
|
3200
|
-
[formatValueAxisTitleColor]="messages.formatValueAxisTitleColor"
|
3201
|
-
|
3202
|
-
i18n-formatValueAxisLabels="kendo.chartwizard.formatValueAxisLabels|The label of the Labels settings of the Value Axis panel."
|
3203
|
-
[formatValueAxisLabels]="messages.formatValueAxisLabels"
|
3204
|
-
|
3205
|
-
i18n-formatValueAxisLabelsFormat="kendo.chartwizard.formatValueAxisLabelsFormat|The label of the Format DropDown of the Labels settings of the Value Axis panel."
|
3206
|
-
[formatValueAxisLabelsFormat]="messages.formatValueAxisLabelsFormat"
|
3207
|
-
|
3208
|
-
i18n-formatValueAxisLabelsFormatText="kendo.chartwizard.formatValueAxisLabelsFormatText|The Text option of the Format DropDown of the Labels settings of the Value Axis panel."
|
3209
|
-
[formatValueAxisLabelsFormatText]="messages.formatValueAxisLabelsFormatText"
|
3210
|
-
|
3211
|
-
i18n-formatValueAxisLabelsFormatNumber="kendo.chartwizard.formatValueAxisLabelsFormatNumber|The Number option of the Format DropDown of the Labels settings of the Value Axis panel."
|
3212
|
-
[formatValueAxisLabelsFormatNumber]="messages.formatValueAxisLabelsFormatNumber"
|
3213
|
-
|
3214
|
-
i18n-formatValueAxisLabelsFormatCurrency="kendo.chartwizard.formatValueAxisLabelsFormatCurrency|The Currency option of the Format DropDown of the Labels settings of the Value Axis panel."
|
3215
|
-
[formatValueAxisLabelsFormatCurrency]="messages.formatValueAxisLabelsFormatCurrency"
|
3216
|
-
|
3217
|
-
i18n-formatValueAxisLabelsFormatPercent="kendo.chartwizard.formatValueAxisLabelsFormatPercent|The Percent option of the Format DropDown of the Labels settings of the Value Axis panel."
|
3218
|
-
[formatValueAxisLabelsFormatPercent]="messages.formatValueAxisLabelsFormatPercent"
|
3219
|
-
|
3220
|
-
i18n-formatValueAxisLabelsFont="kendo.chartwizard.formatValueAxisLabelsFont|The label of the Font settings of the Labels in the Value Axis panel."
|
3221
|
-
[formatValueAxisLabelsFont]="messages.formatValueAxisLabelsFont"
|
3222
|
-
|
3223
|
-
i18n-formatValueAxisLabelsFontPlaceholder="kendo.chartwizard.formatValueAxisLabelsFontPlaceholder|The placeholder of the Font settings of the Labels in the Value Axis panel."
|
3224
|
-
[formatValueAxisLabelsFontPlaceholder]="messages.formatValueAxisLabelsFontPlaceholder"
|
3225
|
-
|
3226
|
-
i18n-formatValueAxisLabelsSize="kendo.chartwizard.formatValueAxisLabelsSize|The label of the Size settings of the Labels in the Value Axis panel."
|
3227
|
-
[formatValueAxisLabelsSize]="messages.formatValueAxisLabelsSize"
|
3228
|
-
|
3229
|
-
i18n-formatValueAxisLabelsSizePlaceholder="kendo.chartwizard.formatValueAxisLabelsSizePlaceholder|The placeholder of the Size settings of the Labels in the Value Axis panel."
|
3230
|
-
[formatValueAxisLabelsSizePlaceholder]="messages.formatValueAxisLabelsSizePlaceholder"
|
3231
|
-
|
3232
|
-
i18n-formatValueAxisLabelsColor="kendo.chartwizard.formatValueAxisLabelsColor|The label of the Color settings of the Labels in the Value Axis panel."
|
3233
|
-
[formatValueAxisLabelsColor]="messages.formatValueAxisLabelsColor"
|
3234
|
-
|
3235
|
-
i18n-formatValueAxisLabelsRotation="kendo.chartwizard.formatValueAxisLabelsRotation|The label of the Rotation settings of the Labels in the Value Axis panel."
|
3236
|
-
[formatValueAxisLabelsRotation]="messages.formatValueAxisLabelsRotation"
|
3237
|
-
|
3238
|
-
i18n-formatValueAxisLabelsRotationAuto="kendo.chartwizard.formatValueAxisLabelsRotationAuto|The Auto option of the Rotation settings of the Labels in the Value Axis panel."
|
3239
|
-
[formatValueAxisLabelsRotationAuto]="messages.formatValueAxisLabelsRotationAuto"
|
3240
|
-
|
3241
|
-
></ng-container>
|
3242
|
-
<div *ngIf="windowSettings?.modal" @overlayAppear class="k-overlay"> </div>
|
3243
|
-
<kendo-window
|
3244
|
-
class="k-chart-wizard"
|
3245
|
-
[title]="messageFor('windowTitle')"
|
3246
|
-
[width]="windowWidth"
|
3247
|
-
[height]="windowHeight"
|
3248
|
-
[minWidth]="windowSettings?.minWidth"
|
3249
|
-
[minHeight]="windowSettings?.minHeight"
|
3250
|
-
[state]="windowSettings?.state"
|
3251
|
-
[resizable]="true"
|
3252
|
-
(close)="close.emit()"
|
3253
|
-
>
|
3254
|
-
<kendo-splitter class="k-chart-wizard-splitter">
|
3255
|
-
<kendo-splitter-pane class="k-chart-wizard-preview-pane">
|
3256
|
-
<div class="k-preview-pane-header">
|
3257
|
-
<kendo-dropdownbutton
|
3258
|
-
[svgIcon]="exportIcon"
|
3259
|
-
[data]="exportDropdownItems"
|
3260
|
-
textField="text"
|
3261
|
-
fillMode="flat"
|
3262
|
-
(itemClick)="onExport($event)"
|
3263
|
-
>
|
3264
|
-
{{ messageFor('exportButton') }}
|
3265
|
-
</kendo-dropdownbutton>
|
3266
|
-
</div>
|
3267
|
-
<div class="k-preview-pane-content" [style.height]="'calc(100% - 50px)'">
|
3268
|
-
<kendo-chart [transitions]="false" [style.width.%]="100" [style.height.%]="100">
|
3269
|
-
<kendo-chart-title
|
3270
|
-
[text]="stateService.state.title?.text"
|
3271
|
-
[font]="stateService.state.title?.font"
|
3272
|
-
[color]="stateService.state.title?.color"
|
3273
|
-
></kendo-chart-title>
|
3274
|
-
<kendo-chart-subtitle
|
3275
|
-
[text]="stateService.state.subtitle?.text"
|
3276
|
-
[font]="stateService.state.subtitle?.font"
|
3277
|
-
[color]="stateService.state.subtitle?.color"
|
3278
|
-
></kendo-chart-subtitle>
|
3279
|
-
<kendo-chart-area
|
3280
|
-
[background]="stateService.state.area?.background"
|
3281
|
-
[margin]="stateService.state.area?.margin"
|
3282
|
-
>
|
3283
|
-
</kendo-chart-area>
|
3284
|
-
<kendo-chart-category-axis *ngIf="stateService.state.categoryAxis">
|
3285
|
-
<kendo-chart-category-axis-item
|
3286
|
-
*ngFor="let axis of stateService.state.categoryAxis"
|
3287
|
-
[categories]="axis.categories"
|
3288
|
-
[title]="{
|
3289
|
-
text: axis.title?.text,
|
3290
|
-
font: axis.title?.font,
|
3291
|
-
color: axis.title?.color
|
3292
|
-
}"
|
3293
|
-
[labels]="{
|
3294
|
-
rotation: axis.labels?.rotation,
|
3295
|
-
font: axis.labels?.font,
|
3296
|
-
color: axis.labels?.color
|
3297
|
-
}"
|
3298
|
-
[reverse]="axis.reverse"
|
3299
|
-
>
|
3300
|
-
</kendo-chart-category-axis-item>
|
3301
|
-
<kendo-chart-value-axis *ngIf="stateService.state.valueAxis">
|
3302
|
-
<kendo-chart-value-axis-item
|
3303
|
-
*ngFor="let axis of stateService.state.valueAxis"
|
3304
|
-
[title]="{
|
3305
|
-
text: axis.title?.text,
|
3306
|
-
font: axis.title?.font,
|
3307
|
-
color: axis.title?.color
|
3308
|
-
}"
|
3309
|
-
[labels]="{
|
3310
|
-
rotation: axis.labels?.rotation,
|
3311
|
-
font: axis.labels?.font,
|
3312
|
-
color: axis.labels?.color,
|
3313
|
-
format: axis.labels?.format
|
3314
|
-
}"
|
3315
|
-
>
|
3316
|
-
</kendo-chart-value-axis-item>
|
3317
|
-
</kendo-chart-value-axis>
|
3318
|
-
</kendo-chart-category-axis>
|
3319
|
-
<kendo-chart-series>
|
3320
|
-
<kendo-chart-series-item
|
3321
|
-
*ngFor="let series of stateService.state.series"
|
3322
|
-
[type]="series.type"
|
3323
|
-
[data]="series.data"
|
3324
|
-
[stack]="series.stack"
|
3325
|
-
[field]="series.field"
|
3326
|
-
[categoryField]="series.categoryField"
|
3327
|
-
[name]="series.name"
|
3328
|
-
[color]="series.color"
|
3329
|
-
[labels]="{ visible: series.labels?.visible }"
|
3330
|
-
[width]="series.width"
|
3331
|
-
>
|
3332
|
-
</kendo-chart-series-item>
|
3333
|
-
</kendo-chart-series>
|
3334
|
-
<kendo-chart-legend
|
3335
|
-
[visible]="stateService.state.legend?.visible"
|
3336
|
-
[position]="stateService.state.legend?.position"
|
3337
|
-
[labels]="stateService.state.legend?.labels"
|
3338
|
-
>
|
3339
|
-
</kendo-chart-legend>
|
3340
|
-
</kendo-chart>
|
3341
|
-
</div>
|
3342
|
-
</kendo-splitter-pane>
|
3343
|
-
<kendo-splitter-pane class="k-chart-wizard-property-pane" [collapsible]="true" [collapsed]="collapsedConfigurationPane" [size]="stateService.splitterPaneSize">
|
3344
|
-
<kendo-tabstrip [keepTabContent]="true">
|
3345
|
-
<kendo-tabstrip-tab [title]="messageFor('tabChart')" [selected]="true">
|
3346
|
-
<ng-template kendoTabContent>
|
3347
|
-
<kendo-chartwizard-property-pane-chart-tab>
|
3348
|
-
</kendo-chartwizard-property-pane-chart-tab>
|
3349
|
-
</ng-template>
|
3350
|
-
</kendo-tabstrip-tab>
|
3351
|
-
<kendo-tabstrip-tab [title]="messageFor('tabData')">
|
3352
|
-
<ng-template kendoTabContent>
|
3353
|
-
<kendo-chartwizard-property-pane-data-tab> </kendo-chartwizard-property-pane-data-tab>
|
3354
|
-
</ng-template>
|
3355
|
-
</kendo-tabstrip-tab>
|
3356
|
-
<kendo-tabstrip-tab [title]="messageFor('tabFormat')">
|
3357
|
-
<ng-template kendoTabContent>
|
3358
|
-
<kendo-chartwizard-property-pane-format-tab>
|
3359
|
-
</kendo-chartwizard-property-pane-format-tab>
|
3360
|
-
</ng-template>
|
3361
|
-
</kendo-tabstrip-tab>
|
3362
|
-
</kendo-tabstrip>
|
3363
|
-
</kendo-splitter-pane>
|
3364
|
-
</kendo-splitter>
|
3365
|
-
<div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
|
3366
|
-
</kendo-window>
|
3367
|
-
`,
|
3368
|
-
standalone: true,
|
3369
|
-
imports: [
|
3370
|
-
WindowComponent,
|
3371
|
-
SplitterComponent,
|
3372
|
-
SplitterPaneComponent,
|
3373
|
-
DropDownButtonComponent,
|
3374
|
-
ChartComponent,
|
3375
|
-
TitleComponent,
|
3376
|
-
SubtitleComponent,
|
3377
|
-
ChartAreaComponent,
|
3378
|
-
NgIf,
|
3379
|
-
CategoryAxisComponent,
|
3380
|
-
NgFor,
|
3381
|
-
CategoryAxisItemComponent,
|
3382
|
-
ValueAxisComponent,
|
3383
|
-
ValueAxisItemComponent,
|
3384
|
-
SeriesComponent,
|
3385
|
-
SeriesItemComponent,
|
3386
|
-
XAxisComponent,
|
3387
|
-
XAxisItemComponent,
|
3388
|
-
YAxisComponent,
|
3389
|
-
YAxisItemComponent,
|
3390
|
-
LegendComponent,
|
3391
|
-
TabStripComponent,
|
3392
|
-
TabStripTabComponent,
|
3393
|
-
TabContentDirective,
|
3394
|
-
ChartWizardPropertyPaneChartTabComponent,
|
3395
|
-
ChartWizardPropertyPaneFormatTabComponent,
|
3396
|
-
ChartWizardPropertyPaneDataTabComponent,
|
3397
|
-
WatermarkOverlayComponent,
|
3398
|
-
LocalizedMessagesDirective
|
3399
|
-
]
|
3400
|
-
}]
|
3401
|
-
}], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: StateService }]; }, propDecorators: { data: [{
|
3402
|
-
type: Input
|
3403
|
-
}], defaultState: [{
|
3404
|
-
type: Input
|
3405
|
-
}], exportOptions: [{
|
3406
|
-
type: Input
|
3407
|
-
}], collapsedConfigurationPane: [{
|
3408
|
-
type: Input
|
3409
|
-
}], windowSettings: [{
|
3410
|
-
type: Input
|
3411
|
-
}], close: [{
|
3412
|
-
type: Output
|
3413
|
-
}], export: [{
|
3414
|
-
type: Output
|
3415
|
-
}], dir: [{
|
3416
|
-
type: HostBinding,
|
3417
|
-
args: ['attr.dir']
|
3418
|
-
}], chart: [{
|
3419
|
-
type: ViewChild,
|
3420
|
-
args: [ChartComponent]
|
3421
|
-
}], propertyPane: [{
|
3422
|
-
type: ViewChild,
|
3423
|
-
args: [ChartWizardPropertyPaneChartTabComponent]
|
3424
|
-
}], dataTab: [{
|
3425
|
-
type: ViewChild,
|
3426
|
-
args: [ChartWizardPropertyPaneDataTabComponent]
|
3427
|
-
}] } });
|
3428
|
-
|
3429
|
-
const getWizardDataFromDataRows = ChartWizardCommon.getWizardDataFromDataRows;
|
3430
|
-
|
3431
|
-
/**
|
3432
|
-
* Maps the Grid selectedKeys to a more general DataRows type to be displayed in the Chart Wizard.
|
3433
|
-
*
|
3434
|
-
* The selectedKeys can be either row keys or cell keys.
|
3435
|
-
*
|
3436
|
-
* @returns DataRow array that can be passed to getWizardDataFromDataRows in order to bind the Chart Wizard.
|
3437
|
-
*/
|
3438
|
-
function getGridSelectedRows(args) {
|
3439
|
-
const { grid, data, selectedKeys, selectionKey, columnKey } = args;
|
3440
|
-
const columns = [...grid.leafColumns];
|
3441
|
-
const allColumns = columns.map((column) => ({ field: column.field, title: column.title }));
|
3442
|
-
const selectedColumns = new Map();
|
3443
|
-
let getItemByKey;
|
3444
|
-
if (selectionKey) {
|
3445
|
-
const idGetter = getter(selectionKey);
|
3446
|
-
const dataMap = new Map(data.map((item) => [idGetter(item), item]));
|
3447
|
-
getItemByKey = itemKey => dataMap.get(itemKey);
|
3448
|
-
}
|
3449
|
-
else {
|
3450
|
-
getItemByKey = itemIndex => data[itemIndex];
|
3451
|
-
}
|
3452
|
-
let getColumnByColumnKey = key => columns[key];
|
3453
|
-
if (typeof columnKey === "function") {
|
3454
|
-
const columnMap = new Map(columns.map((col, colIndex) => [columnKey(col, colIndex), col]));
|
3455
|
-
getColumnByColumnKey = key => columnMap.get(key);
|
3456
|
-
}
|
3457
|
-
selectedKeys.forEach(item => {
|
3458
|
-
if (isPresent(item.columnKey)) {
|
3459
|
-
const itemColumns = selectedColumns.get(item.itemKey) || [];
|
3460
|
-
const column = getColumnByColumnKey(item.columnKey);
|
3461
|
-
const columnIndex = columns.indexOf(column);
|
3462
|
-
const dataColumn = { field: column.field, title: column.title };
|
3463
|
-
itemColumns.splice(columnIndex, 0, dataColumn);
|
3464
|
-
selectedColumns.set(item.itemKey, itemColumns);
|
3465
|
-
}
|
3466
|
-
else {
|
3467
|
-
selectedColumns.set(item, allColumns);
|
3468
|
-
}
|
3469
|
-
});
|
3470
|
-
return [...selectedColumns.entries()].map(([itemKey, dataColumns]) => ({
|
3471
|
-
dataItem: getItemByKey(itemKey),
|
3472
|
-
dataColumns
|
3473
|
-
}));
|
3474
|
-
}
|
3475
|
-
|
3476
|
-
/**
|
3477
|
-
* Maps the Grid selectedKeys to data to be displayed in the Chart Wizard.
|
3478
|
-
*
|
3479
|
-
* Supports both row and cell selection.
|
3480
|
-
* @returns collection that can be used as Chart Wizard.
|
3481
|
-
*/
|
3482
|
-
const getWizardDataFromGridSelection = (args) => getWizardDataFromDataRows(getGridSelectedRows(args));
|
3483
|
-
|
3484
|
-
/**
|
3485
|
-
* A directive which binds the Chart Wizard from the selection state of the Grid
|
3486
|
-
* ([see example](slug:grid_integration_with_chart).
|
3487
|
-
*/
|
3488
|
-
class ChartWizardGridBindingDirective {
|
3489
|
-
constructor(grid) {
|
3490
|
-
this.grid = grid;
|
3491
|
-
/**
|
3492
|
-
* Defines the collection that will store the Chart Wizard data.
|
3493
|
-
*
|
3494
|
-
* @default []
|
3495
|
-
*/
|
3496
|
-
this.chartWizardData = [];
|
3497
|
-
/**
|
3498
|
-
* Fires when the `chartWizardData` collection has been updated.
|
3499
|
-
*/
|
3500
|
-
this.chartWizardDataChange = new EventEmitter();
|
3501
|
-
}
|
3502
|
-
ngOnInit() {
|
3503
|
-
if (!this.selectionKey || !this.data) {
|
3504
|
-
throw new Error('The [kendoChartWizardGridBinding] directive requires that [kendoGridBinding] and [kendoGridSelectBy] are set. ' +
|
3505
|
-
'See the Grid documentation for an example on how to use the Chart Wizard without the directive.');
|
3506
|
-
}
|
3507
|
-
if (typeof this.selectionKey === 'function') {
|
3508
|
-
throw new Error('The [kendoChartWizardGridBinding] directive supports only strings as [kendoGridSelectBy] selection key.');
|
3509
|
-
}
|
3510
|
-
}
|
3511
|
-
onSelectionChange(selectedKeys) {
|
3512
|
-
this.chartWizardData = getWizardDataFromGridSelection({
|
3513
|
-
grid: this.grid,
|
3514
|
-
data: this.data,
|
3515
|
-
selectedKeys,
|
3516
|
-
selectionKey: this.selectionKey
|
3517
|
-
});
|
3518
|
-
this.chartWizardDataChange.emit(this.chartWizardData);
|
3519
|
-
}
|
3520
|
-
}
|
3521
|
-
ChartWizardGridBindingDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardGridBindingDirective, deps: [{ token: i1$1.GridComponent }], target: i0.ɵɵFactoryTarget.Directive });
|
3522
|
-
ChartWizardGridBindingDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: ChartWizardGridBindingDirective, isStandalone: true, selector: "[kendoChartWizardGridBinding]", inputs: { chartWizardData: "chartWizardData", data: ["kendoGridBinding", "data"], selectionKey: ["kendoGridSelectBy", "selectionKey"], columnKey: "columnKey" }, outputs: { chartWizardDataChange: "chartWizardDataChange" }, host: { listeners: { "selectedKeysChange": "onSelectionChange($event)" } }, exportAs: ["kendoChartWizardGridBinding"], ngImport: i0 });
|
3523
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardGridBindingDirective, decorators: [{
|
3524
|
-
type: Directive,
|
3525
|
-
args: [{
|
3526
|
-
selector: '[kendoChartWizardGridBinding]',
|
3527
|
-
exportAs: 'kendoChartWizardGridBinding',
|
3528
|
-
standalone: true
|
3529
|
-
}]
|
3530
|
-
}], ctorParameters: function () { return [{ type: i1$1.GridComponent }]; }, propDecorators: { chartWizardData: [{
|
3531
|
-
type: Input
|
3532
|
-
}], chartWizardDataChange: [{
|
3533
|
-
type: Output
|
3534
|
-
}], data: [{
|
3535
|
-
type: Input,
|
3536
|
-
args: ['kendoGridBinding']
|
3537
|
-
}], selectionKey: [{
|
3538
|
-
type: Input,
|
3539
|
-
args: ['kendoGridSelectBy']
|
3540
|
-
}], columnKey: [{
|
3541
|
-
type: Input
|
3542
|
-
}], onSelectionChange: [{
|
3543
|
-
type: HostListener,
|
3544
|
-
args: ['selectedKeysChange', ['$event']]
|
3545
|
-
}] } });
|
3546
|
-
|
3547
|
-
/**
|
3548
|
-
* Custom component messages override default component messages.
|
3549
|
-
* @example
|
3550
|
-
* ```html
|
3551
|
-
* <kendo-chartwizard [data]="data">
|
3552
|
-
* <kendo-chartwizard-messages
|
3553
|
-
* windowTitle="Title"
|
3554
|
-
* ></kendo-chartwizard-messages>
|
3555
|
-
* </kendo-chartwizard>
|
3556
|
-
* ```
|
3557
|
-
*/
|
3558
|
-
class CustomMessagesComponent extends Messages {
|
3559
|
-
constructor(service) {
|
3560
|
-
super();
|
3561
|
-
this.service = service;
|
3562
|
-
}
|
3563
|
-
get override() {
|
3564
|
-
return true;
|
3565
|
-
}
|
3566
|
-
}
|
3567
|
-
CustomMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CustomMessagesComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
|
3568
|
-
CustomMessagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CustomMessagesComponent, isStandalone: true, selector: "kendo-chartwizard-messages", providers: [
|
3569
|
-
{
|
3570
|
-
provide: Messages,
|
3571
|
-
useExisting: forwardRef(() => CustomMessagesComponent)
|
3572
|
-
}
|
3573
|
-
], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
|
3574
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CustomMessagesComponent, decorators: [{
|
3575
|
-
type: Component,
|
3576
|
-
args: [{
|
3577
|
-
providers: [
|
3578
|
-
{
|
3579
|
-
provide: Messages,
|
3580
|
-
useExisting: forwardRef(() => CustomMessagesComponent)
|
3581
|
-
}
|
3582
|
-
],
|
3583
|
-
selector: 'kendo-chartwizard-messages',
|
3584
|
-
template: ``,
|
3585
|
-
standalone: true
|
3586
|
-
}]
|
3587
|
-
}], ctorParameters: function () { return [{ type: i1.LocalizationService }]; } });
|
3588
|
-
|
3589
|
-
/**
|
3590
|
-
* Utility array that contains all `@progress/kendo-angular-chart-wizard` related components and directives.
|
3591
|
-
*/
|
3592
|
-
const KENDO_CHARTWIZARD = [
|
3593
|
-
ChartWizardComponent,
|
3594
|
-
ChartWizardGridBindingDirective,
|
3595
|
-
CustomMessagesComponent
|
3596
|
-
];
|
3597
|
-
|
3598
|
-
//IMPORTANT: NgModule export kept for backwards compatibility
|
3599
|
-
/**
|
3600
|
-
* A [module](link:site.data.urls.angular['ngmoduleapi']) that includes the Chart Wizard component and directives.
|
3601
|
-
*
|
3602
|
-
* Imports the ChartWizardModule into your application
|
3603
|
-
* [root module](link:site.data.urls.angular['ngmodules']#angular-modularity) or any other sub-module
|
3604
|
-
* that will use the Chart Wizard component.
|
3605
|
-
*/
|
3606
|
-
class ChartWizardModule {
|
3607
|
-
}
|
3608
|
-
ChartWizardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
3609
|
-
ChartWizardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardModule, imports: [ChartWizardComponent, ChartWizardGridBindingDirective, CustomMessagesComponent], exports: [ChartWizardComponent, ChartWizardGridBindingDirective, CustomMessagesComponent] });
|
3610
|
-
ChartWizardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardModule, providers: [
|
3611
|
-
ThemeService,
|
3612
|
-
PopupService,
|
3613
|
-
ResizeBatchService,
|
3614
|
-
IconsService,
|
3615
|
-
DialogContainerService,
|
3616
|
-
DialogService,
|
3617
|
-
WindowService,
|
3618
|
-
WindowContainerService
|
3619
|
-
], imports: [ChartWizardComponent, CustomMessagesComponent] });
|
3620
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardModule, decorators: [{
|
3621
|
-
type: NgModule,
|
3622
|
-
args: [{
|
3623
|
-
imports: [...KENDO_CHARTWIZARD],
|
3624
|
-
exports: [...KENDO_CHARTWIZARD],
|
3625
|
-
providers: [
|
3626
|
-
ThemeService,
|
3627
|
-
PopupService,
|
3628
|
-
ResizeBatchService,
|
3629
|
-
IconsService,
|
3630
|
-
DialogContainerService,
|
3631
|
-
DialogService,
|
3632
|
-
WindowService,
|
3633
|
-
WindowContainerService
|
3634
|
-
]
|
3635
|
-
}]
|
3636
|
-
}] });
|
3637
|
-
|
3638
|
-
/**
|
3639
|
-
* Generated bundle index. Do not edit.
|
3640
|
-
*/
|
3641
|
-
|
3642
|
-
export { ChartWizardComponent, ChartWizardGridBindingDirective, ChartWizardModule, CustomMessagesComponent, ExportEvent, KENDO_CHARTWIZARD, getGridSelectedRows, getWizardDataFromDataRows, getWizardDataFromGridSelection };
|
3643
|
-
|