@progress/kendo-angular-charts
Version:
Kendo UI Charts for Angular - A comprehensive package for creating beautiful and interactive data visualization. Every chart type, stock charts, and sparklines are included.
92 lines (91 loc) • 4.44 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
import { ConfigurationService } from '../common/configuration.service';
import { PrefixConfigurationService, PREFIX } from '../common/prefix-configuration.service';
import { SettingsComponent } from '../common/settings.component';
import * as i0 from "@angular/core";
import * as i1 from "../common/configuration.service";
/**
* The configuration options of the navigator
* ([see runnable example](slug:overview_stockchart_charts)).
*
* @example
* ```ts-no-run
* _@Component({
* selector: 'my-app',
* template: `
* <kendo-stockchart (navigatorFilter)="onNavigatorFilter($event)">
* <kendo-chart-series>
* <kendo-chart-series-item
* type="candlestick"
* [data]="seriesData"
* openField="Open"
* closeField="Close"
* lowField="Low"
* highField="High"
* categoryField="Date">
* </kendo-chart-series-item>
* </kendo-chart-series>
* <kendo-chart-navigator
* [categoryAxis]="categoryAxisOptions"
* [hint]="hintOptions"
* [pane]="paneOptions"
* [visible]="isVisible">
* <kendo-chart-navigator-select [from]="from" [to]="to">
* </kendo-chart-navigator-select>
* <kendo-chart-navigator-series>
* <kendo-chart-navigator-series-item type="area" [data]="navigatorData" field="Close" categoryField="Date">
* </kendo-chart-navigator-series-item>
* </kendo-chart-navigator-series>
* </kendo-chart-navigator>
* </kendo-stockchart>
* <br /><br />
* <button kendoButton (click)="isVisible = !isVisible">Toggle Navigator</button>
* `
* })
* ```
*/
export class NavigatorComponent extends SettingsComponent {
configurationService;
position;
visible;
// These options are also available as child components
categoryAxis;
hint;
pane;
select;
series;
constructor(configurationService) {
super('', configurationService);
this.configurationService = configurationService;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NavigatorComponent, deps: [{ token: i1.ConfigurationService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: NavigatorComponent, isStandalone: true, selector: "kendo-chart-navigator", inputs: { position: "position", visible: "visible", categoryAxis: "categoryAxis", hint: "hint", pane: "pane", select: "select", series: "series" }, providers: [{ provide: PREFIX, useValue: 'navigator' }, { provide: ConfigurationService, useClass: PrefixConfigurationService }], usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NavigatorComponent, decorators: [{
type: Component,
args: [{
changeDetection: ChangeDetectionStrategy.OnPush,
providers: [{ provide: PREFIX, useValue: 'navigator' }, { provide: ConfigurationService, useClass: PrefixConfigurationService }],
selector: 'kendo-chart-navigator',
template: '',
standalone: true
}]
}], ctorParameters: function () { return [{ type: i1.ConfigurationService }]; }, propDecorators: { position: [{
type: Input
}], visible: [{
type: Input
}], categoryAxis: [{
type: Input
}], hint: [{
type: Input
}], pane: [{
type: Input
}], select: [{
type: Input
}], series: [{
type: Input
}] } });