UNPKG

igniteui-angular-charts

Version:

Ignite UI Angular charting components for building rich data visualizations for modern web apps.

1,377 lines 151 kB
import { EventEmitter, Output, Component, Input } from '@angular/core'; import { delegateCombine } from "igniteui-angular-core"; import { MarkerAutomaticBehavior_$type } from "./MarkerAutomaticBehavior"; import { SeriesHighlightingMode_$type } from "./SeriesHighlightingMode"; import { SeriesSelectionMode_$type } from "./SeriesSelectionMode"; import { SeriesSelectionBehavior_$type } from "./SeriesSelectionBehavior"; import { SeriesViewerScrollbarMode_$type } from "./SeriesViewerScrollbarMode"; import { SeriesViewerHorizontalScrollbarPosition_$type } from "./SeriesViewerHorizontalScrollbarPosition"; import { SeriesViewerVerticalScrollbarPosition_$type } from "./SeriesViewerVerticalScrollbarPosition"; import { SeriesHighlightingBehavior_$type } from "./SeriesHighlightingBehavior"; import { LegendHighlightingMode_$type } from "./LegendHighlightingMode"; import { LegendItemBadgeShape_$type } from "igniteui-angular-core"; import { LegendItemBadgeMode_$type } from "igniteui-angular-core"; import { ChartHitTestMode_$type } from "./ChartHitTestMode"; import { WindowResponse_$type } from "./WindowResponse"; import { Visibility_$type } from "igniteui-angular-core"; import { ZoomCoercionMode_$type } from "./ZoomCoercionMode"; import { InteractionState_$type } from "igniteui-angular-core"; import { ModifierKeys_$type } from "igniteui-angular-core"; import { SeriesHighlightedValuesDisplayMode_$type } from "igniteui-angular-core"; import { IgxChartSelectedItemCollection } from "./igx-chart-selected-item-collection"; import { HorizontalAlignment_$type } from "igniteui-angular-core"; import { IgxPlotAreaMouseButtonEventArgs } from "./igx-plot-area-mouse-button-event-args"; import { IgxPlotAreaMouseEventArgs } from "./igx-plot-area-mouse-event-args"; import { IgxChartCursorEventArgs } from "./igx-chart-cursor-event-args"; import { IgxDataChartMouseButtonEventArgs } from "./igx-data-chart-mouse-button-event-args"; import { IgxChartMouseEventArgs } from "./igx-chart-mouse-event-args"; import { IgxSeriesViewerManipulationEventArgs } from "./igx-series-viewer-manipulation-event-args"; import { IgxRectChangedEventArgs } from "igniteui-angular-core"; import { IgxSeriesViewerSelectedSeriesItemsChangedEventArgs } from "./igx-series-viewer-selected-series-items-changed-event-args"; import { IgxRefreshCompletedEventArgs } from "./igx-refresh-completed-event-args"; import { IgxImageCapturedEventArgs } from "igniteui-angular-core"; import { TypeRegistrar } from "igniteui-angular-core"; import { NamePatcher, toBrushCollection, fromBrushCollection, ensureEnum, fromPoint, toPoint, ensureBool, brushToString, stringToBrush, fromRect, toRect, toSpinal, initializePropertiesFromCss } from "igniteui-angular-core"; import { ChartSelectedItemCollection as ChartSelectedItemCollection_internal } from "./ChartSelectedItemCollection"; import { ChartSelection } from "./ChartSelection"; import { SyncableObservableCollection$1 } from "igniteui-angular-core"; import * as i0 from "@angular/core"; /** * Represents a control for viewing series objects. */ var IgxSeriesViewerComponent = /** @class */ /*@__PURE__*/ (function () { function IgxSeriesViewerComponent() { this._selectedSeriesItems = null; this._focusedSeriesItems = null; this.__p = null; this._hasUserValues = new Set(); this._stylingContainer = null; this._stylingParent = null; this._inStyling = false; this._plotAreaMouseLeftButtonDown = null; this._plotAreaMouseLeftButtonUp = null; this._plotAreaClicked = null; this._plotAreaMouseEnter = null; this._plotAreaMouseLeave = null; this._plotAreaMouseOver = null; this._seriesCursorMouseMove = null; this._seriesMouseLeftButtonDown = null; this._seriesMouseLeftButtonUp = null; this._seriesClick = null; this._seriesMouseMove = null; this._seriesMouseEnter = null; this._seriesMouseLeave = null; this._viewerManipulationStarting = null; this._viewerManipulationEnding = null; this._windowRectChanged = null; this._sizeChanged = null; this._actualWindowRectChanged = null; this._gridAreaRectChanged = null; this._selectedSeriesItemsChanged = null; this._focusedSeriesItemsChanged = null; this._refreshCompleted = null; this._imageCaptured = null; this._zoneRunner = null; if (this._styling) { NamePatcher.ensureStylablePatched(Object.getPrototypeOf(this)); } this._implementation = this.createImplementation(); this._implementation.externalObject = this; this.onImplementationCreated(); if (this._initializeAdapters) { this._initializeAdapters(); } } IgxSeriesViewerComponent.prototype.createImplementation = function () { return null; }; IgxSeriesViewerComponent.prototype.ngOnInit = function () { }; Object.defineProperty(IgxSeriesViewerComponent.prototype, "i", { /** * @hidden */ get: function () { return this._implementation; } /** * @hidden */, enumerable: false, configurable: true }); IgxSeriesViewerComponent._createFromInternal = function (internal) { if (!internal) { return null; } if (!internal.$type) { return null; } var name = internal.$type.name; var externalName = "Igx" + name + "Component"; if (!TypeRegistrar.isRegistered(externalName)) { return null; } return TypeRegistrar.create(externalName); }; IgxSeriesViewerComponent.prototype.onImplementationCreated = function () { }; Object.defineProperty(IgxSeriesViewerComponent.prototype, "brushes", { /** * Gets or sets the palette of brushes used for fill of plotted series. * These brushes are automatically assigned to series based on the index of series. */ get: function () { return fromBrushCollection(this.i.ag); }, set: function (v) { this.i.ag = toBrushCollection(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "outlines", { /** * Gets or sets the palette of brushes used for outlines of plotted series. * These outlines are automatically assigned to series based on the index of series. */ get: function () { return fromBrushCollection(this.i.aj); }, set: function (v) { this.i.aj = toBrushCollection(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "markerBrushes", { /** * Gets or sets the palette of brushes used for fill of marker series. * These brushes are automatically assigned to markers based on the index of series. */ get: function () { return fromBrushCollection(this.i.ah); }, set: function (v) { this.i.ah = toBrushCollection(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "markerOutlines", { /** * Gets or sets the palette of brushes used for outlines of plotted markers. * These outlines are automatically assigned to markers based on the index of series. */ get: function () { return fromBrushCollection(this.i.ai); }, set: function (v) { this.i.ai = toBrushCollection(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "markerAutomaticBehavior", { /** * Gets or sets the marker mode used for assigning a marker type to series when the marker type is automatic. */ get: function () { return this.i.bg; }, set: function (v) { this.i.bg = ensureEnum(MarkerAutomaticBehavior_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "crosshairPoint", { /** * Gets or sets the cross hair point (in world coordinates) * Either or both of the crosshair point's X and Y may be set to double.NaN, in which * case the relevant crosshair line is hidden. * * The `CrosshairPoint` property is used to gets/sets the cross hair point (in world coordinates). * * ```html * <igx-data-chart * [dataSource]="data" * crosshairVisibility="visible" * crosshairPoint={x:.8,y:.2}> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis * #yAxis> * </igx-numeric-y-axis> * <igx-line-series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value"> * </igx-line-series> * </igx-data-chart> * ``` * * ```ts * this.chart.crosshairPoint = {x:.8,y:.2}; * ``` */ get: function () { return fromPoint(this.i.vv); }, set: function (v) { this.i.vv = toPoint(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "animateSeriesWhenAxisRangeChanges", { /** * Gets or sets whether the series animations should be allowed when a range change has been detected on an axis. * * `AnimateSeriesWhenAxisRangeChanges` is a Boolean property to override the default behavior in which series do not animate if an axis range changes. * * ```html * <igx-data-chart * [dataSource]="data" * animateSeriesWhenAxisRangeChanges=true> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis * #yAxis> * </igx-numeric-y-axis> * <igx-column-series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value" * transitionInMode="accordionFromBottom" * isTransitionInEnabled=true * transitionInSpeedType="indexScaled" * transitionDuration=1000> * </igx-column-series> * </igx-data-chart> * ``` * * ```ts * this.chart.animateSeriesWhenAxisRangeChanges = true; * ``` */ get: function () { return this.i.ek; }, set: function (v) { this.i.ek = ensureBool(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "seriesValueLayerUseLegend", { /** * Gets or sets whether the series animations should be allowed when a range change has been detected on an axis. */ get: function () { return this.i.f2; }, set: function (v) { this.i.f2 = ensureBool(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "isWindowSyncedToVisibleRange", { /** * Gets or sets whether to sync the vertical aspect of the window with the contained series content. This is only supported for a subset of the available series. */ get: function () { return this.i.fj; }, set: function (v) { this.i.fj = ensureBool(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "shouldSimulateHoverMoveCrosshairPoint", { /** * Gets or sets whether calling SimulateHover should shift the crosshair point. */ get: function () { return this.i.f7; }, set: function (v) { this.i.f7 = ensureBool(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "highlightingMode", { /** * Gets or sets the highlighting mode to use for the series in the component, when supported. This takes precedence over the series level IsHighlightingEnabled. */ get: function () { return this.i.by; }, set: function (v) { this.i.by = ensureEnum(SeriesHighlightingMode_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "selectionMode", { /** * Gets or sets the selection mode to use for the series in the component, when supported. */ get: function () { return this.i.cb; }, set: function (v) { this.i.cb = ensureEnum(SeriesSelectionMode_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "selectionBehavior", { /** * Gets or sets the selection behavior to use for the series in the component, when supported. */ get: function () { return this.i.b6; }, set: function (v) { this.i.b6 = ensureEnum(SeriesSelectionBehavior_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "focusMode", { /** * Gets or sets the focus mode to use for the series in the component, when supported. */ get: function () { return this.i.b9; }, set: function (v) { this.i.b9 = ensureEnum(SeriesSelectionMode_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "horizontalViewScrollbarMode", { /** * Gets or sets the horizontal scrollbar mode to use for the series viewer. */ get: function () { return this.i.ch; }, set: function (v) { this.i.ch = ensureEnum(SeriesViewerScrollbarMode_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "verticalViewScrollbarMode", { /** * Gets or sets the vertical scrollbar mode to use for the series viewer. */ get: function () { return this.i.ci; }, set: function (v) { this.i.ci = ensureEnum(SeriesViewerScrollbarMode_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "horizontalViewScrollbarPosition", { /** * Gets or sets the position to use for the horizontal scrollbar in the component, when enabled. */ get: function () { return this.i.ce; }, set: function (v) { this.i.ce = ensureEnum(SeriesViewerHorizontalScrollbarPosition_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "verticalViewScrollbarPosition", { /** * Gets or sets the position to use for the vertical scrollbar in the component, when enabled. */ get: function () { return this.i.cl; }, set: function (v) { this.i.cl = ensureEnum(SeriesViewerVerticalScrollbarPosition_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "horizontalViewScrollbarFill", { /** * Gets or sets the fill to use for the horizontal scrollbar in the component, when enabled. */ get: function () { return brushToString(this.i.vi); }, set: function (v) { this.i.vi = stringToBrush(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "horizontalViewScrollbarOutline", { /** * Gets or sets the outline to use for the horizontal scrollbar in the component, when enabled. */ get: function () { return brushToString(this.i.vj); }, set: function (v) { this.i.vj = stringToBrush(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "horizontalViewScrollbarStrokeThickness", { /** * Gets or sets the stroke thickness to use for the horizontal scrollbar in the component, when enabled. */ get: function () { return this.i.hy; }, set: function (v) { this.i.hy = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "horizontalViewScrollbarMaxOpacity", { /** * Gets or sets the max opacity to use for the horizontal scrollbar in the component, when enabled. */ get: function () { return this.i.hx; }, set: function (v) { this.i.hx = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "horizontalViewScrollbarCornerRadius", { /** * Gets or sets the corner radius to use for the horizontal scrollbar in the component, when enabled. */ get: function () { return this.i.hu; }, set: function (v) { this.i.hu = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "horizontalViewScrollbarHeight", { /** * Gets or sets the height to use for the horizontal scrollbar in the component, when enabled. */ get: function () { return this.i.hv; }, set: function (v) { this.i.hv = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "horizontalViewScrollbarInset", { /** * Gets or sets the inset distance to use for the horizontal scrollbar in the component, when enabled. */ get: function () { return this.i.hw; }, set: function (v) { this.i.hw = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "horizontalViewScrollbarTrackStartInset", { /** * Gets or sets the track start inset to use for the horizontal scrollbar in the component, when enabled. */ get: function () { return this.i.h0; }, set: function (v) { this.i.h0 = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "horizontalViewScrollbarTrackEndInset", { /** * Gets or sets the track end inset to use for the horizontal scrollbar in the component, when enabled. */ get: function () { return this.i.hz; }, set: function (v) { this.i.hz = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "horizontalViewScrollbarShouldAddAutoTrackInsets", { /** * Gets or sets whether to use automatic track insets for the horizontal scrollbar in the component, when enabled. */ get: function () { return this.i.ey; }, set: function (v) { this.i.ey = ensureBool(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "verticalViewScrollbarFill", { /** * Gets or sets the fill to use for the vertical scrollbar in the component, when enabled. */ get: function () { return brushToString(this.i.vs); }, set: function (v) { this.i.vs = stringToBrush(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "verticalViewScrollbarOutline", { /** * Gets or sets the outline to use for the vertical scrollbar in the component, when enabled. */ get: function () { return brushToString(this.i.vt); }, set: function (v) { this.i.vt = stringToBrush(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "verticalViewScrollbarStrokeThickness", { /** * Gets or sets the stroke thickness to use for the vertical scrollbar in the component, when enabled. */ get: function () { return this.i.il; }, set: function (v) { this.i.il = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "verticalViewScrollbarMaxOpacity", { /** * Gets or sets the max opacity to use for the vertical scrollbar in the component, when enabled. */ get: function () { return this.i.ik; }, set: function (v) { this.i.ik = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "verticalViewScrollbarCornerRadius", { /** * Gets or sets the corner radius to use for the vertical scrollbar in the component, when enabled. */ get: function () { return this.i.ii; }, set: function (v) { this.i.ii = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "verticalViewScrollbarWidth", { /** * Gets or sets the width to use for the vertical scrollbar in the component, when enabled. */ get: function () { return this.i.ip; }, set: function (v) { this.i.ip = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "verticalViewScrollbarInset", { /** * Gets or sets the inset distance to use for the vertical scrollbar in the component, when enabled. */ get: function () { return this.i.ij; }, set: function (v) { this.i.ij = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "verticalViewScrollbarTrackStartInset", { /** * Gets or sets the track start inset to use for the vertical scrollbar in the component, when enabled. */ get: function () { return this.i.io; }, set: function (v) { this.i.io = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "verticalViewScrollbarTrackEndInset", { /** * Gets or sets the track end inset to use for the vertical scrollbar in the component, when enabled. */ get: function () { return this.i.im; }, set: function (v) { this.i.im = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "verticalViewScrollbarShouldAddAutoTrackInsets", { /** * Gets or sets whether to use automatic track insets for the vertical scrollbar in the component, when enabled. */ get: function () { return this.i.gj; }, set: function (v) { this.i.gj = ensureBool(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "highlightingBehavior", { /** * Gets or sets the highlighting Behavior to use for the series in the component, when supported. This takes precedence over the series level IsHighlightingEnabled. */ get: function () { return this.i.bw; }, set: function (v) { this.i.bw = ensureEnum(SeriesHighlightingBehavior_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "legendHighlightingMode", { /** * Gets or sets the highlighting mode to use for the legend linked to the component, when supported. */ get: function () { return this.i.bd; }, set: function (v) { this.i.bd = ensureEnum(LegendHighlightingMode_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "legendItemBadgeShape", { /** * Gets or sets type of legend badges representing all series displayed in a legend linked to this component * This property will be ignored when the LegendItemTemplate or LegendItemBadgeTemplate property is set on a series */ get: function () { return this.i.bf; }, set: function (v) { this.i.bf = ensureEnum(LegendItemBadgeShape_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "legendItemBadgeMode", { /** * Gets or sets the mode of legend badges representing all series in this chart. * This property will be ignored when the LegendItemTemplate or LegendItemBadgeTemplate property is set on a series */ get: function () { return this.i.be; }, set: function (v) { this.i.be = ensureEnum(LegendItemBadgeMode_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "viewportRect", { /** * Gets the viewport rectangle associated with the SeriesViewer, the physical dimensions of the plot area. * * ```ts * let viewPortRect: IgxRect = this.chart.viewportRect; * ``` */ get: function () { return fromRect(this.i.wk); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "effectiveViewport", { /** * Gets the EffectiveViewport rectangle, representing the effective viewport area after margins have been subtracted. * * ``ts * let viewport: IgxRect = this.chart.effectiveViewport; * * ``` * * ``` */ get: function () { return fromRect(this.i.v8); }, set: function (v) { this.i.v8 = toRect(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "contentViewport", { /** * Represents the subset area within the viewport into which content should be mapped. * This is the projection of the current EffectiveViewport into the viewport at current zoom level. * * ```ts * let contentViewport: IgxRect = this.chart.contentViewport; * ``` */ get: function () { return fromRect(this.i.v7); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "windowRect", { /** * A rectangle representing the portion of the SeriesViewer currently in view. * A rectangle at X=0, Y=0 with a Height and Width of 1 implies the entire plotting area is in view. A Height and Width of .5 would imply that the view is halfway zoomed in. * * You can set the `WindowRect` to zoom in on an area of interest in the chart. * * ```ts * this.chart.windowRect = {left:0, top:1, width: .5, height: .5}; * ``` */ get: function () { return fromRect(this.i.wl); }, set: function (v) { this.i.wl = toRect(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "useTiledZooming", { /** * Gets or sets whether the series viewer should use cached tiles during zooms rather than the default live content. */ get: function () { return this.i.gi; }, set: function (v) { this.i.gi = ensureBool(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "preferHigherResolutionTiles", { /** * Gets or sets whether the series viewer should prefer selecting higher resolution tiles over lower resolution tiles when performing tile zooming. Setting this to true will lower performance but increase quality. */ get: function () { return this.i.fz; }, set: function (v) { this.i.fz = ensureBool(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "zoomTileCacheSize", { /** * Gets or sets the maximum number of zoom tiles that the series viewer should cache while in tiled zooming mode. */ get: function () { return this.i.i8; }, set: function (v) { this.i.i8 = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "highlightingTransitionDuration", { /** * Gets or sets the duration the highlighting/de-highlighting effects. * * The `HighlightingTransitionDuration` property is used to set the time for highlighting transition in milliseconds . * * ```html * <igx-data-chart * [dataSource]="data" * HighlightingTransitionDuration=500 > * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis * #yAxis> * </igx-numeric-y-axis> * <igx-column-series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value" > * </igx-column-series> * </igx-data-chart> * ``` * * ```ts * chart.HighlightingTransitionDuration=500; * ``` */ get: function () { return this.i.i5; }, set: function (v) { this.i.i5 = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "selectionTransitionDuration", { /** * Gets or sets the duration the selection/de-Selection effects. */ get: function () { return this.i.i7; }, set: function (v) { this.i.i7 = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "focusTransitionDuration", { /** * Gets or sets the duration the Focus/de-Focus effects. */ get: function () { return this.i.i3; }, set: function (v) { this.i.i3 = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "scrollbarsAnimationDuration", { /** * Gets or sets the duration of the scrollbar effects. */ get: function () { return this.i.i6; }, set: function (v) { this.i.i6 = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "isPagePanningAllowed", { /** * Gets or sets the whether the series viewer can allow the page to pan if a control pan is not possible in the requested direction. */ get: function () { return this.i.fe; }, set: function (v) { this.i.fe = ensureBool(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "contentHitTestMode", { /** * Determines the method of hit testing used when mousing over elements in the chart. * * ```ts * this.chart.contentHitTestMode = ChartHitTestMode.Computational; * ``` */ get: function () { return this.i.av; }, set: function (v) { this.i.av = ensureEnum(ChartHitTestMode_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "actualContentHitTestMode", { /** * Resolved method of hit testing used when the pointer is over elements in the chart. * * ```ts * let actualContentHitTestMode: ChartHitTestMode =this.chart.actualContentHitTestMode; * ``` */ get: function () { return this.i.au; }, set: function (v) { this.i.au = ensureEnum(ChartHitTestMode_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "isSurfaceInteractionDisabled", { /** * Gets or sets whether all surface interactions with the plot area should be disabled. * * The `IsSurfaceInteractionDisabled` property is used to enable/disable interactions with the plot surface. * * ```html * <igx-data-chart * [dataSource]="data" * isSurfaceInteractionDisabled=true> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis * #yAxis> * </igx-numeric-y-axis> * <igx-line-series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value"> * </igx-line-series> * </igx-data-chart> * ``` * * ```ts * chart.isSurfaceInteractionDisabled=true; * ``` */ get: function () { return this.i.ff; }, set: function (v) { this.i.ff = ensureBool(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "isMap", { /** * Indicates if this SeriesViewer is a map. */ get: function () { return this.i.fd; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "windowResponse", { /** * The response to user panning and zooming: whether to update the view immediately while the user action is happening, or to defer the update to after the user action is complete. The user action will be an action such as a mouse drag which causes panning and/or zooming to occur. * * The `WindowResponse` property is used to set the response to user panning and zooming: whether to update the view immediately while the user action is happening, or to defer the update to after the user action is complete. * The user action will be an action such as a mouse drag which causes panning and/or zooming to occur. * * ```html * <igx-data-chart * [dataSource]="data" * isHorizontalZoomEnabled=true * windowResponse="deferred"> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis * #yAxis> * </igx-numeric-y-axis> * <igx-line-series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value"> * </igx-line-series> * </igx-data-chart> * ``` * * ```ts * this.chart.windowResponse="deferred"; * ``` */ get: function () { return this.i.cp; }, set: function (v) { this.i.cp = ensureEnum(WindowResponse_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "windowRectMinWidth", { /** * Sets or gets the minimum width that the window rect is allowed to reach before being clamped. * Decrease this value if you want to allow for further zooming into the viewer. * If this value is lowered too much it can cause graphical corruption due to floating point arithmetic inaccuracy. * This property accepts values between 0.0 (max zooming) and 1.0 (no zooming) * * The `WindowRectMinWidth` property is used to set or get the minimum width that the window rect is allowed to reach before being clamped. * * ```html * <igx-data-chart * [dataSource]="data" * isHorizontalZoomEnabled=true * windowRectMinWidth=.2> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis * #yAxis> * </igx-numeric-y-axis> * <igx-line-series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value"> * </igx-line-series> * </igx-data-chart> * ``` * * ```ts * this.chart.WindowRectMinWidth=".2"; * ``` */ get: function () { return this.i.it; }, set: function (v) { this.i.it = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "windowRectMinHeight", { /** * Sets or gets the minimum height that the window rect is allowed to reach before being clamped. * Decrease this value if you want to allow for further zooming into the viewer. * If this value is lowered too much it can cause graphical corruption due to floating point arithmetic inaccuracy. * This property accepts values between 0.0 (max zooming) and 1.0 (no zooming) */ get: function () { return this.i.is; }, set: function (v) { this.i.is = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "actualWindowRectMinWidth", { /** * Gets the actual minimum width that the window rect is allowed to reach before being clamped. */ get: function () { return this.i.hm; }, set: function (v) { this.i.hm = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "actualWindowRectMinHeight", { /** * Gets the actual minimum height that the window rect is allowed to reach before being clamped. */ get: function () { return this.i.hl; }, set: function (v) { this.i.hl = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "windowSizeMinWidth", { /** * Sets or gets minimum pixel width that the window is allowed to reach before being clamped. * Decrease this value if you want to allow for further zooming into the viewer. * If this value is lowered too much it can cause graphical corruption due to floating point arithmetic inaccuracy. * This property is overridden by the WindowRectMinWidth property */ get: function () { return this.i.iv; }, set: function (v) { this.i.iv = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "windowSizeMinHeight", { /** * Sets or gets minimum pixel height that the window is allowed to reach before being clamped. * Decrease this value if you want to allow for further zooming into the viewer. * If this value is lowered too much it can cause graphical corruption due to floating point arithmetic inaccuracy. * This property is overridden by the WindowRectMinHeight property */ get: function () { return this.i.iu; }, set: function (v) { this.i.iu = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "crosshairVisibility", { /** * Gets or sets the current SeriesViewer's crosshair visibility override. * * The `CrosshairVisibility` property is used to gets or sets the current Chart's crosshair visibility override. Note: setting this property does not affect the mobile browser version of the chart. * * ```html * <igx-data-chart * [dataSource]="data" * crosshairVisibility="visible"> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis * #yAxis> * </igx-numeric-y-axis> * <igx-line-series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value"> * </igx-line-series> * </igx-data-chart> * ``` * * ```ts * this.chart.crosshairVisibility = Visibility.Visible; * ``` */ get: function () { return this.i.wp; }, set: function (v) { this.i.wp = ensureEnum(Visibility_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "horizontalCrosshairBrush", { /** * Gets or sets the current SeriesViewer's crosshair horizontal brush override. */ get: function () { return brushToString(this.i.vh); }, set: function (v) { this.i.vh = stringToBrush(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "verticalCrosshairBrush", { /** * Gets or sets the current SeriesViewer's crosshair vertical brush override. */ get: function () { return brushToString(this.i.vr); }, set: function (v) { this.i.vr = stringToBrush(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "zoomCoercionMode", { /** * Gets or sets zoom is constrained to within the axes. Setting this to false is a preview feature at the present time. */ get: function () { return this.i.ct; }, set: function (v) { this.i.ct = ensureEnum(ZoomCoercionMode_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "plotAreaBackground", { /** * Gets or sets the brush used as the background for the current SeriesViewer object's plot area. * * `PlotAreaBackground` property set the background brush to the current Chart object's plot area. * * ```html * <igx-data-chart * [dataSource]="data" * plotAreaBackground="#F0F8FF"> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis * #yAxis> * </igx-numeric-y-axis> * <igx-line-series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value"> * </igx-line-series> * </igx-data-chart> * ``` * * ```ts * this.chart.plotAreaBackground="#F0F8FF"; * ``` */ get: function () { return brushToString(this.i.vk); }, set: function (v) { this.i.vk = stringToBrush(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "shouldMatchZOrderToSeriesOrder", { /** * Gets or sets whether to match the z order of the series to their positional order in the series collection, regardless of mutation. */ get: function () { return this.i.f5; }, set: function (v) { this.i.f5 = ensureBool(v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "defaultInteraction", { /** * Gets or sets the DefaultInteraction property. * The default interaction state defines the SeriesViewer's response to mouse events. * * The default interaction state defines the chart's response to mouse events. * * ```html * <igx-data-chart * [dataSource]="data" * isHorizontalZoomEnabled=true * defaultInteraction="dragPan"> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis * #yAxis> * </igx-numeric-y-axis> * <igx-line-series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value"> * </igx-line-series> * </igx-data-chart> * ``` * * ```ts * this.chart.defaultInteraction = InteractionState.DragPan; * ``` */ get: function () { return this.i.cw; }, set: function (v) { this.i.cw = ensureEnum(InteractionState_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "interactionOverride", { /** * Gets or sets the InteractionOverride property. * The interaction override overrides the default interaction and modifiers keys and defines the SeriesViewer's response to mouse events. */ get: function () { return this.i.cx; }, set: function (v) { this.i.cx = ensureEnum(InteractionState_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "rightButtonDefaultInteraction", { /** * Gets or sets the RightButtonDefaultInteraction property. * The default interaction state defines the SeriesViewer's response to right button mouse events. */ get: function () { return this.i.cz; }, set: function (v) { this.i.cz = ensureEnum(InteractionState_$type, v); }, enumerable: false, configurable: true }); Object.defineProperty(IgxSeriesViewerComponent.prototype, "dragModifier", { /** * Gets or sets the current SeriesViewer's DragModifier property. * * `DragModifier` is useful to enable zooming when zooming is not the default interaction. * * ```html * <igx-data-chart * [dataSource]="data" * isHorizontalZoomEnabled=true * defaultInteraction="dragPan" * dragModifier="alt"> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis * #yAxis> * </i