/*! * devextreme-angular-test * Version: 17.2.8 * Build date: Mon Feb 05 2018 * * Copyright (c) 2012 - 2018 Developer Express Inc. ALL RIGHTS RESERVED * * This software may be modified and distributed under the terms * of the MIT license. See the LICENSE file in the root of the project for details. * * https://github.com/DevExpress/devextreme-angular */ import { Component, NgModule, ElementRef, NgZone, Input, Output, OnDestroy, Injector, EventEmitter, OnChanges, DoCheck, SimpleChanges, ContentChildren, QueryList } from '@angular/core'; import DevExpress from 'devextreme/bundles/dx.all'; import DxPieChart from 'devextreme/viz/pie_chart'; import { DxComponent } from '../core/component'; import { DxTemplateHost } from '../core/template-host'; import { DxTemplateModule } from '../core/template'; import { EventsRegistrator } from '../core/events-strategy'; import { NestedOptionHost } from '../core/nested-option'; import { WatcherHelper } from '../core/watcher-helper'; import { IterableDifferHelper } from '../core/iterable-differ-helper'; import { DxoAdaptiveLayoutModule } from './nested/adaptive-layout'; import { DxoAnimationModule } from './nested/animation'; import { DxoCommonSeriesSettingsModule } from './nested/common-series-settings'; import { DxoBorderModule } from './nested/border'; import { DxoHoverStyleModule } from './nested/hover-style'; import { DxoHatchingModule } from './nested/hatching'; import { DxoLabelModule } from './nested/label'; import { DxoArgumentFormatModule } from './nested/argument-format'; import { DxoConnectorModule } from './nested/connector'; import { DxoFontModule } from './nested/font'; import { DxoFormatModule } from './nested/format'; import { DxoSelectionStyleModule } from './nested/selection-style'; import { DxoSmallValuesGroupingModule } from './nested/small-values-grouping'; import { DxoExportModule } from './nested/export'; import { DxoLegendModule } from './nested/legend'; import { DxoMarginModule } from './nested/margin'; import { DxoLoadingIndicatorModule } from './nested/loading-indicator'; import { DxiSeriesModule } from './nested/series-dxi'; import { DxoSeriesTemplateModule } from './nested/series-template'; import { DxoSizeModule } from './nested/size'; import { DxoTitleModule } from './nested/title'; import { DxoSubtitleModule } from './nested/subtitle'; import { DxoTooltipModule } from './nested/tooltip'; import { DxoShadowModule } from './nested/shadow'; import { DxiSeriesComponent } from './nested/series-dxi'; /** * The PieChart is a widget that visualizes data as a circle divided into sectors that each represents a portion of the whole. */ @Component({ selector: 'dx-pie-chart', template: '', styles: [ ' :host { display: block; }'], providers: [ DxTemplateHost, WatcherHelper, NestedOptionHost, IterableDifferHelper ] }) export class DxPieChartComponent extends DxComponent implements OnDestroy, OnChanges, DoCheck { instance: DxPieChart; /** * Specifies adaptive layout options. */ @Input() get adaptiveLayout(): any { return this._getOption('adaptiveLayout'); } set adaptiveLayout(value: any) { this._setOption('adaptiveLayout', value); } /** * Specifies animation options. */ @Input() get animation(): boolean| { duration?: number, easing?: string, enabled?: boolean, maxPointCountSupported?: number } { return this._getOption('animation'); } set animation(value: boolean| { duration?: number, easing?: string, enabled?: boolean, maxPointCountSupported?: number }) { this._setOption('animation', value); } /** * An object defining the configuration options that are common for all series of the PieChart widget. */ @Input() get commonSeriesSettings(): any { return this._getOption('commonSeriesSettings'); } set commonSeriesSettings(value: any) { this._setOption('commonSeriesSettings', value); } /** * Customizes the appearance of an individual point label. */ @Input() get customizeLabel(): Function { return this._getOption('customizeLabel'); } set customizeLabel(value: Function) { this._setOption('customizeLabel', value); } /** * Customizes the appearance of an individual series point. */ @Input() get customizePoint(): Function { return this._getOption('customizePoint'); } set customizePoint(value: Function) { this._setOption('customizePoint', value); } /** * Specifies the widget's data origin. */ @Input() get dataSource(): DevExpress.data.DataSource| DevExpress.data.DataSourceOptions| string| Array { return this._getOption('dataSource'); } set dataSource(value: DevExpress.data.DataSource| DevExpress.data.DataSourceOptions| string| Array) { this._setOption('dataSource', value); } /** * Specifies the diameter of the pie. */ @Input() get diameter(): number { return this._getOption('diameter'); } set diameter(value: number) { this._setOption('diameter', value); } /** * Specifies the attributes to be attached to the widget's root element. */ @Input() get elementAttr(): any { return this._getOption('elementAttr'); } set elementAttr(value: any) { this._setOption('elementAttr', value); } /** * Configures the exporting and printing features. */ @Input() get export(): any { return this._getOption('export'); } set export(value: any) { this._setOption('export', value); } /** * Specifies the fraction of the inner radius relative to the total radius in the series of the 'doughnut' type. The value should be between 0 and 1. */ @Input() get innerRadius(): number { return this._getOption('innerRadius'); } set innerRadius(value: number) { this._setOption('innerRadius', value); } /** * Specifies PieChart legend options. */ @Input() get legend(): any { return this._getOption('legend'); } set legend(value: any) { this._setOption('legend', value); } /** * Configures the loading indicator. */ @Input() get loadingIndicator(): any { return this._getOption('loadingIndicator'); } set loadingIndicator(value: any) { this._setOption('loadingIndicator', value); } /** * Generates space around the widget. */ @Input() get margin(): any { return this._getOption('margin'); } set margin(value: any) { this._setOption('margin', value); } /** * Specifies the minimum diameter of the pie. */ @Input() get minDiameter(): number { return this._getOption('minDiameter'); } set minDiameter(value: number) { this._setOption('minDiameter', value); } /** * Sets the name of the palette to be used in the chart. Alternatively, an array of colors can be set as a custom palette to be used within this chart. */ @Input() get palette(): string| Array { return this._getOption('palette'); } set palette(value: string| Array) { this._setOption('palette', value); } /** * Notifies the widget that it is embedded into an HTML page that uses a tag modifying the path. */ @Input() get pathModified(): boolean { return this._getOption('pathModified'); } set pathModified(value: boolean) { this._setOption('pathModified', value); } /** * Specifies whether a single point or multiple points can be selected in the chart. */ @Input() get pointSelectionMode(): string { return this._getOption('pointSelectionMode'); } set pointSelectionMode(value: string) { this._setOption('pointSelectionMode', value); } /** * Specifies whether to redraw the widget when the size of the parent browser window changes or a mobile device rotates. */ @Input() get redrawOnResize(): boolean { return this._getOption('redrawOnResize'); } set redrawOnResize(value: boolean) { this._setOption('redrawOnResize', value); } /** * Specifies how a chart must behave when point labels overlap. */ @Input() get resolveLabelOverlapping(): string { return this._getOption('resolveLabelOverlapping'); } set resolveLabelOverlapping(value: string) { this._setOption('resolveLabelOverlapping', value); } /** * Switches the widget to a right-to-left representation. */ @Input() get rtlEnabled(): boolean { return this._getOption('rtlEnabled'); } set rtlEnabled(value: boolean) { this._setOption('rtlEnabled', value); } /** * Specifies the direction that the pie chart segments will occupy. */ @Input() get segmentsDirection(): string { return this._getOption('segmentsDirection'); } set segmentsDirection(value: string) { this._setOption('segmentsDirection', value); } /** * Specifies options for the series of the PieChart widget. */ @Input() get series(): any| Array { return this._getOption('series'); } set series(value: any| Array) { this._setOption('series', value); } /** * Defines options for the series template. */ @Input() get seriesTemplate(): any { return this._getOption('seriesTemplate'); } set seriesTemplate(value: any) { this._setOption('seriesTemplate', value); } /** * Specifies the widget's size in pixels. */ @Input() get size(): any { return this._getOption('size'); } set size(value: any) { this._setOption('size', value); } /** * Allows you to display several adjoining pies in the same size. */ @Input() get sizeGroup(): string { return this._getOption('sizeGroup'); } set sizeGroup(value: string) { this._setOption('sizeGroup', value); } /** * Specifies the angle in arc degrees from which the first segment of a pie chart should start. */ @Input() get startAngle(): number { return this._getOption('startAngle'); } set startAngle(value: number) { this._setOption('startAngle', value); } /** * Sets the name of the theme the widget uses. */ @Input() get theme(): string { return this._getOption('theme'); } set theme(value: string) { this._setOption('theme', value); } /** * Configures the widget's title. */ @Input() get title(): string| { font?: DevExpress.viz.Font, horizontalAlignment?: string, margin?: number| { bottom?: number, left?: number, right?: number, top?: number }, placeholderSize?: number, subtitle?: string| { font?: DevExpress.viz.Font, text?: string }, text?: string, verticalAlignment?: string } { return this._getOption('title'); } set title(value: string| { font?: DevExpress.viz.Font, horizontalAlignment?: string, margin?: number| { bottom?: number, left?: number, right?: number, top?: number }, placeholderSize?: number, subtitle?: string| { font?: DevExpress.viz.Font, text?: string }, text?: string, verticalAlignment?: string }) { this._setOption('title', value); } /** * Configures tooltips. */ @Input() get tooltip(): any { return this._getOption('tooltip'); } set tooltip(value: any) { this._setOption('tooltip', value); } /** * Specifies the type of the pie chart series. */ @Input() get type(): string { return this._getOption('type'); } set type(value: string) { this._setOption('type', value); } /** * A handler for the disposing event. Executed when the widget is removed from the DOM using the remove(), empty(), or html() jQuery methods only. */ @Output() onDisposing: EventEmitter; /** * A handler for the done event. */ @Output() onDone: EventEmitter; /** * A handler for the drawn event. Executed when the widget has finished drawing itself. */ @Output() onDrawn: EventEmitter; /** * A handler for the exported event. Executed after data from the widget is exported. */ @Output() onExported: EventEmitter; /** * A handler for the exporting event. Executed before data from the widget is exported. */ @Output() onExporting: EventEmitter; /** * A handler for the fileSaving event. Executed before a file with exported data is saved on the user's local storage. */ @Output() onFileSaving: EventEmitter; /** * A handler for the incidentOccurred event. Executed when an error or warning appears in the widget. */ @Output() onIncidentOccurred: EventEmitter; /** * A handler for the initialized event. Executed only once, after the widget is initialized. */ @Output() onInitialized: EventEmitter; /** * A handler for the legendClick event. */ @Output() onLegendClick: EventEmitter; /** * A handler for the optionChanged event. Executed after an option of the widget is changed. */ @Output() onOptionChanged: EventEmitter; /** * A handler for the pointClick event. */ @Output() onPointClick: EventEmitter; /** * A handler for the pointHoverChanged event. */ @Output() onPointHoverChanged: EventEmitter; /** * A handler for the pointSelectionChanged event. */ @Output() onPointSelectionChanged: EventEmitter; /** * A handler for the tooltipHidden event. */ @Output() onTooltipHidden: EventEmitter; /** * A handler for the tooltipShown event. */ @Output() onTooltipShown: EventEmitter; /** * A handler for the adaptiveLayoutChange event. */ @Output() adaptiveLayoutChange: EventEmitter; /** * A handler for the animationChange event. */ @Output() animationChange: EventEmitter; /** * A handler for the commonSeriesSettingsChange event. */ @Output() commonSeriesSettingsChange: EventEmitter; /** * A handler for the customizeLabelChange event. */ @Output() customizeLabelChange: EventEmitter; /** * A handler for the customizePointChange event. */ @Output() customizePointChange: EventEmitter; /** * A handler for the dataSourceChange event. */ @Output() dataSourceChange: EventEmitter>; /** * A handler for the diameterChange event. */ @Output() diameterChange: EventEmitter; /** * A handler for the elementAttrChange event. */ @Output() elementAttrChange: EventEmitter; /** * A handler for the exportChange event. */ @Output() exportChange: EventEmitter; /** * A handler for the innerRadiusChange event. */ @Output() innerRadiusChange: EventEmitter; /** * A handler for the legendChange event. */ @Output() legendChange: EventEmitter; /** * A handler for the loadingIndicatorChange event. */ @Output() loadingIndicatorChange: EventEmitter; /** * A handler for the marginChange event. */ @Output() marginChange: EventEmitter; /** * A handler for the minDiameterChange event. */ @Output() minDiameterChange: EventEmitter; /** * A handler for the paletteChange event. */ @Output() paletteChange: EventEmitter>; /** * A handler for the pathModifiedChange event. */ @Output() pathModifiedChange: EventEmitter; /** * A handler for the pointSelectionModeChange event. */ @Output() pointSelectionModeChange: EventEmitter; /** * A handler for the redrawOnResizeChange event. */ @Output() redrawOnResizeChange: EventEmitter; /** * A handler for the resolveLabelOverlappingChange event. */ @Output() resolveLabelOverlappingChange: EventEmitter; /** * A handler for the rtlEnabledChange event. */ @Output() rtlEnabledChange: EventEmitter; /** * A handler for the segmentsDirectionChange event. */ @Output() segmentsDirectionChange: EventEmitter; /** * A handler for the seriesChange event. */ @Output() seriesChange: EventEmitter>; /** * A handler for the seriesTemplateChange event. */ @Output() seriesTemplateChange: EventEmitter; /** * A handler for the sizeChange event. */ @Output() sizeChange: EventEmitter; /** * A handler for the sizeGroupChange event. */ @Output() sizeGroupChange: EventEmitter; /** * A handler for the startAngleChange event. */ @Output() startAngleChange: EventEmitter; /** * A handler for the themeChange event. */ @Output() themeChange: EventEmitter; /** * A handler for the titleChange event. */ @Output() titleChange: EventEmitter; /** * A handler for the tooltipChange event. */ @Output() tooltipChange: EventEmitter; /** * A handler for the typeChange event. */ @Output() typeChange: EventEmitter; @ContentChildren(DxiSeriesComponent) get seriesChildren(): QueryList { return this._getOption('series'); } set seriesChildren(value) { this.setChildren('series', value); } constructor(elementRef: ElementRef, ngZone: NgZone, templateHost: DxTemplateHost, injector: Injector, private _watcherHelper: WatcherHelper, private _idh: IterableDifferHelper, optionHost: NestedOptionHost) { super(elementRef, ngZone, templateHost, _watcherHelper); injector.get(EventsRegistrator); this._createEventEmitters([ { subscribe: 'disposing', emit: 'onDisposing' }, { subscribe: 'done', emit: 'onDone' }, { subscribe: 'drawn', emit: 'onDrawn' }, { subscribe: 'exported', emit: 'onExported' }, { subscribe: 'exporting', emit: 'onExporting' }, { subscribe: 'fileSaving', emit: 'onFileSaving' }, { subscribe: 'incidentOccurred', emit: 'onIncidentOccurred' }, { subscribe: 'initialized', emit: 'onInitialized' }, { subscribe: 'legendClick', emit: 'onLegendClick' }, { subscribe: 'optionChanged', emit: 'onOptionChanged' }, { subscribe: 'pointClick', emit: 'onPointClick' }, { subscribe: 'pointHoverChanged', emit: 'onPointHoverChanged' }, { subscribe: 'pointSelectionChanged', emit: 'onPointSelectionChanged' }, { subscribe: 'tooltipHidden', emit: 'onTooltipHidden' }, { subscribe: 'tooltipShown', emit: 'onTooltipShown' }, { emit: 'adaptiveLayoutChange' }, { emit: 'animationChange' }, { emit: 'commonSeriesSettingsChange' }, { emit: 'customizeLabelChange' }, { emit: 'customizePointChange' }, { emit: 'dataSourceChange' }, { emit: 'diameterChange' }, { emit: 'elementAttrChange' }, { emit: 'exportChange' }, { emit: 'innerRadiusChange' }, { emit: 'legendChange' }, { emit: 'loadingIndicatorChange' }, { emit: 'marginChange' }, { emit: 'minDiameterChange' }, { emit: 'paletteChange' }, { emit: 'pathModifiedChange' }, { emit: 'pointSelectionModeChange' }, { emit: 'redrawOnResizeChange' }, { emit: 'resolveLabelOverlappingChange' }, { emit: 'rtlEnabledChange' }, { emit: 'segmentsDirectionChange' }, { emit: 'seriesChange' }, { emit: 'seriesTemplateChange' }, { emit: 'sizeChange' }, { emit: 'sizeGroupChange' }, { emit: 'startAngleChange' }, { emit: 'themeChange' }, { emit: 'titleChange' }, { emit: 'tooltipChange' }, { emit: 'typeChange' } ]); this._idh.setHost(this); optionHost.setHost(this); } protected _createInstance(element, options) { return new DxPieChart(element, options); } ngOnDestroy() { this._destroyWidget(); } ngOnChanges(changes: SimpleChanges) { super.ngOnChanges(changes); this.setupChanges('dataSource', changes); this.setupChanges('palette', changes); this.setupChanges('series', changes); } setupChanges(prop: string, changes: SimpleChanges) { if (!(prop in this._optionsToUpdate)) { this._idh.setup(prop, changes); } } ngDoCheck() { this._idh.doCheck('dataSource'); this._idh.doCheck('palette'); this._idh.doCheck('series'); this._watcherHelper.checkWatchers(); super.ngDoCheck(); } _setOption(name: string, value: any) { let isSetup = this._idh.setupSingle(name, value); let isChanged = this._idh.getChanges(name, value) !== null; if (isSetup || isChanged) { super._setOption(name, value); } } } @NgModule({ imports: [ DxoAdaptiveLayoutModule, DxoAnimationModule, DxoCommonSeriesSettingsModule, DxoBorderModule, DxoHoverStyleModule, DxoHatchingModule, DxoLabelModule, DxoArgumentFormatModule, DxoConnectorModule, DxoFontModule, DxoFormatModule, DxoSelectionStyleModule, DxoSmallValuesGroupingModule, DxoExportModule, DxoLegendModule, DxoMarginModule, DxoLoadingIndicatorModule, DxiSeriesModule, DxoSeriesTemplateModule, DxoSizeModule, DxoTitleModule, DxoSubtitleModule, DxoTooltipModule, DxoShadowModule, DxTemplateModule ], declarations: [ DxPieChartComponent ], exports: [ DxPieChartComponent, DxoAdaptiveLayoutModule, DxoAnimationModule, DxoCommonSeriesSettingsModule, DxoBorderModule, DxoHoverStyleModule, DxoHatchingModule, DxoLabelModule, DxoArgumentFormatModule, DxoConnectorModule, DxoFontModule, DxoFormatModule, DxoSelectionStyleModule, DxoSmallValuesGroupingModule, DxoExportModule, DxoLegendModule, DxoMarginModule, DxoLoadingIndicatorModule, DxiSeriesModule, DxoSeriesTemplateModule, DxoSizeModule, DxoTitleModule, DxoSubtitleModule, DxoTooltipModule, DxoShadowModule, DxTemplateModule ], providers: [EventsRegistrator] }) export class DxPieChartModule { }