# Wijmo_Angular2_Chart_Analytics.Wjflexchartwaterfall ## Content

WjFlexChartWaterfall Class

Angular 2 component for the wijmo.chart.analytics.Waterfall class.

The wj-flex-chart-waterfall component must be contained in one of the following components: wijmo.angular2.chart.WjFlexChart or wijmo.angular2.chart.finance.WjFinancialChart.

Use the wj-flex-chart-waterfall component to add Waterfall controls to your Angular 2 applications. For details about Angular 2 markup syntax, see Angular 2 Markup.

The WjFlexChartWaterfall component is derived from the Waterfall class and inherits all its properties, events and methods.

Type parameters

Heirarchy

Properties

Methods

Events

Properties

altStyle

altStyle: any

Gets or sets the alternate style for the series.

The alternate style is used for negative values in Bar, Column, and Scatter charts; and for rising values in financial chart types like Candlestick, LineBreak, EquiVolume etc.

The default value for this property is null, which causes the series to use the default style.

asyncBindings

asyncBindings: boolean

Allows you to override the global WjOptions.asyncBindings setting for this specific component. See the WjOptions.WjOptions.asyncBindings property description for details.

axisX

axisX: Axis

Gets or sets the X-axis for the series.

axisY

axisY: Axis

Gets or sets the Y-axis for the series.

binding

binding: string

Gets or sets the name of the property that contains Y values for the series.

bindingX

bindingX: string

Gets or sets the name of the property that contains X values for the series.

chart

chart: FlexChartCore

Gets the FlexChart object that owns this series.

collectionView

collectionView: ICollectionView<T>

Gets the ICollectionView object that contains the data for this series.

connectorLines

connectorLines: boolean

Gets or sets a value that determines whether to show connector lines.

cssClass

cssClass: string

Gets or sets the series CSS class.

hostElement

hostElement: SVGGElement

Gets the series host element.

initialized

initialized: EventEmitter<any>

This event is triggered after the component has been initialized by Angular, that is all bound properties have been assigned and child components (if any) have been initialized.

intermediateTotalLabels

intermediateTotalLabels: any

Gets or sets the name of the property that contains labels for the intermediate total bars. This should be an array or a string.

This property works with the showIntermediateTotal and intermediateTotalPositions properties.

intermediateTotalPositions

intermediateTotalPositions: number[]

Gets or sets a value of the property that contains the index for positions of the intermediate total bars.

This property works with the showIntermediateTotal and intermediateTotalLabels properties.

interpolateNulls

interpolateNulls: boolean

Gets or sets a value that determines whether to interpolate null values in the data.

If true, the series interpolates the value of any missing data based on neighboring points. If false, it leaves a break in lines and areas at the points with null values.

The default value for this property is false.

isInitialized

isInitialized: boolean

Indicates whether the component has been initialized by Angular. Changes its value from false to true right before triggering the initialized event.

itemFormatter

itemFormatter: Function

Gets or sets the item formatter function that allows you to customize the appearance of the series.

The property overrides the chart's itemFormatter wijmo.chart.FlexChart.itemFormatter.

itemsSource

itemsSource: any

Gets or sets the array or ICollectionView object that contains the series data.

legendElement

legendElement: SVGGElement

Gets the series element in the legend.

name

name: string

Gets or sets the series name.

The series name is displayed in the chart legend. Any series without a name does not appear in the legend.

relativeData

relativeData: boolean

Gets or sets a value that determines whether the given data represents absolute or relative values (differences).

renderedNg

renderedNg: EventEmitter<any>

Angular (EventEmitter) version of the Wijmo rendered event for programmatic access. Use this event name if you want to subscribe to the Angular version of the event in code. In template bindings use the conventional rendered Wijmo event name.

renderingNg

renderingNg: EventEmitter<any>

Angular (EventEmitter) version of the Wijmo rendering event for programmatic access. Use this event name if you want to subscribe to the Angular version of the event in code. In template bindings use the conventional rendering Wijmo event name.

showIntermediateTotal

showIntermediateTotal: boolean

Gets or sets a value that determines whether to show intermediate total bars.

This property works with intermediateTotalPositions and intermediateTotalLabels properties.

showTotal

showTotal: boolean

Gets or sets a value that determines whether to show the total bar at the end of the chart.

start

start: number

Gets or sets a value that determines the value of the start bar. If start is null, the start bar will not be shown.

startLabel

startLabel: string

Gets or sets the label of the start bar.

style

style: any

Gets or sets the series style.

styles

styles: any

Gets or sets the Waterfall styles.

The following styles are supported:

  1. start: Specifies the style of the start column.
  2. total: Specifies the style of the total column.
  3. intermediateTotal: Specifies the style of the intermediate total column.
  4. falling: Specifies the style of the falling columns.
  5. rising: Specifies the style of the rising columns.
  6. connectorLines: Specifies the style of the connectorLines.
waterfall.styles = {
  start: { fill: 'blue', stroke: 'blue' },
  total: { fill: 'yellow', stroke: 'yellow' },
  falling: { fill: 'red', stroke: 'red' },
  rising: { fill: 'green', stroke: 'green' },
  connectorLines: { stroke: 'blue', 'stroke-dasharray': '10, 10' }
}

symbolMarker

symbolMarker: Marker

Gets or sets the shape of marker to use for each data point in the series. Applies to Scatter, LineSymbols, and SplineSymbols chart types.

The default value for this property is Marker.Dot.

symbolSize

symbolSize: number

Gets or sets the size (in pixels) of the symbols used to render this Series. Applies to Scatter, LineSymbols, and SplineSymbols chart types.

The default value for this property is 10 pixels.

symbolStyle

symbolStyle: any

Gets or sets the series symbol style.

Applies to Bar, Column, Scatter, LineSymbols, and SplineSymbols chart types.

tooltipContent

tooltipContent: any

Gets or sets the series specific tooltip content.

The property overrides the content of chart tooltip content.

totalLabel

totalLabel: string

Gets or sets the label of the total bar.

visibility

visibility: SeriesVisibility

Gets or sets an enumerated value indicating whether and where the series appears.

The default value for this property is SeriesVisibility.Visible.

visibilityChangePC

visibilityChangePC: EventEmitter<any>

This event is used to implement two-way binding to the visibility property. It's triggered when the property value changes, with the event argument holding the new property value. You can bind handlers to this event in templates using the visibilityChange event name.

wjProperty

wjProperty: string

Gets or sets a name of a property that this component is assigned to. Default value is 'series'.

Methods

created

  • created(): void

  • If you create a custom component inherited from a Wijmo component, you can override this method and perform necessary initializations that you usually do in a class constructor. This method is called in the last line of a Wijmo component constructor and allows you to not declare your custom component's constructor at all, thus preventing you from a necessity to maintain constructor parameters and keep them in synch with Wijmo component's constructor parameters.

    Returns void

dataToPoint

getDataRect

  • getDataRect(currentRect?: Rect, calculatedRect?: Rect): Rect

  • Returns the series bounding rectangle in data coordinates.

    If getDataRect() returns null, the limits are calculated automatically based on the data values.

    Parameters

    • Optional currentRect: Rect

      The current rectangle of chart. This parameter is optional.

    • Optional calculatedRect: Rect

      The calculated rectangle of chart. This parameter is optional.

    Returns Rect

getPlotElement

  • getPlotElement(pointIndex: number): any

  • Gets the plot element that corresponds to the specified point index.

    Parameters

    • pointIndex: number

      The index of the data point.

    Returns any

hitTest

  • Gets a HitTestInfo object with information about the specified point.

    Parameters

    • pt: any

      The point to investigate, in window coordinates.

    • Optional y: number

      The Y coordinate of the point (if the first parameter is a number).

    Returns HitTestInfo

initialize

  • initialize(options: any): void

  • Initializes the series by copying the properties from a given object.

    Parameters

    • options: any

      JavaScript object containing initialization data for the series.

    Returns void

onRendered

onRendering

  • onRendering(engine: IRenderEngine, index: number, count: number): boolean

pointToData

  • Converts a Point from control coordinates to series data coordinates.

    Parameters

    • pt: Point

      The point to convert, in control coordinates.

    Returns Point

    The point in series data coordinates.

Events

rendered

rendered: Event<SeriesBase<any>, RenderEventArgs>

Occurs when series is rendered.

rendering

rendering: Event<SeriesBase<any>, SeriesRenderingEventArgs>

Occurs when series is rendering.