/*! * * Wijmo Library 5.20251.40 * https://developer.mescius.com/wijmo * * Copyright(c) MESCIUS inc. All rights reserved. * * Licensed under the End-User License Agreement For MESCIUS Wijmo Software. * us.sales@mescius.com * https://developer.mescius.com/wijmo/licensing * */ /** * {@module wijmo.angular.chart} * AngularJS directives for wijmo.chart module */ /** * */ export declare var ___keepComment: any; import { WjDirective } from 'wijmo/wijmo.angular.base'; import * as wjcChart from 'wijmo/wijmo.chart'; /** * Angular module name, which can be used in the angular.module(moduleName) * function to obtain a reference to the module . */ export declare const ngModuleName = "wj.chart"; export declare class WjFlexChartBase extends WjDirective { constructor(); readonly _controlConstructor: typeof wjcChart.FlexChartBase; _initProps(): void; } export declare class WjFlexChartCore extends WjFlexChartBase { readonly _controlConstructor: typeof wjcChart.FlexChartCore; _initProps(): void; } /** * AngularJS directive for the {@link FlexChart} control. * * Use the wj-flex-chart directive to add charts to your AngularJS applications. * Note that directive and parameter names must be formatted using lower-case letters * with dashes instead of camel case. For example: * *
<p>Here is a FlexChart control:</p>
 * <wj-flex-chart
 *   style="height:300px"
 *   items-source="data"
 *   binding-x="country">
 *   <wj-flex-chart-axis
 *     wj-property="axisY"
 *     major-unit="5000">
 *   </wj-flex-chart-axis>
 *   <wj-flex-chart-series
 *     binding="sales"
 *     name="Sales">
 *   </wj-flex-chart-series>
 *   <wj-flex-chart-series
 *     binding="expenses"
 *     name="Expenses">
 *   </wj-flex-chart-series>
 *   <wj-flex-chart-series
 *     binding="downloads"
 *     name="Downloads"
 *     chart-type="LineSymbols">
 *   </wj-flex-chart-series>
 * </wj-flex-chart>
* * The example below creates a {@link FlexChart} control and binds it to a 'data' array * exposed by the controller. The chart has three series objects, each corresponding to * a property in the objects contained in the source array. The last series in the * example uses the 'chart-type' attribute to override the default chart type used * for the other series objects. * * Example * * The wj-flex-chart directive supports the following attributes: * *
*
binding
@ The name of the property that contains Y * values for the chart. You can override this at the series level.
*
binding-x
@ The name of the property that contains X * values for the chart. You can override this at the series level.
*
chart-type
@ The default chart type to use in rendering series * objects. You can override this at the series level. See {@link ChartType}.
*
control
= A reference to the {@link FlexChart} control * that this directive creates.
*
footer
@ The text to display in the chart footer (plain * text).
*
footer-style
= The style to apply to the chart footer.
*
header
@ The text to display in the chart header (plain * text).
*
header-style
= The style to apply to the chart header.
*
initialized
& This event occurs after the binding has finished * initializing the control with attribute values.
*
is-initialized
= A value indicating whether the binding has finished * initializing the control with attribute values.
*
interpolate-nulls
@ The value indicating whether to interpolate or * leave gaps when there are null values in the data.
*
item-formatter
= The formatter function that customizes the * appearance of data points.
*
items-source
= An array or {@link ICollectionView} object that contains * the data used to create the chart.
*
legend-toggle
@ The value indicating whether clicking legend items * toggles series visibility.
*
options
= Chart options that only apply to certain chart types. * See options under {@link FlexChart} for details.
*
palette
= An array that contains the default colors used for * displaying each series.
*
plot-margin
= The number of pixels of space to leave between the * edges of the control and the plot area, or CSS-style margins.
*
rotated
@ The value indicating whether to flip the axes so that * X is vertical and Y is horizontal.
*
selection
= The series object that is selected.
*
selection-mode
@ The {@link SelectionMode} value indicating whether or what is * selected when the user clicks a series.
*
stacking
@ The {@link Stacking} value indicating whether or how series * objects are stacked or plotted independently.
*
symbol-size
@ The size of the symbols used to render data points in Scatter, * LineSymbols, and SplineSymbols charts, in pixels. You can override * this at the series level.
*
tooltip-content
@ The value to display in the * {@link ChartTooltip} content property.
*
got-focus
& The {@link FlexChart.gotFocus} event handler.
*
lost-focus
& The {@link FlexChart.lostFocus} event handler.
*
rendering
& The {@link FlexChart.rendering} event handler.
*
rendered
& The {@link FlexChart.rendered} event handler.
*
series-visibility-changed
*
& The {@link FlexChart.seriesVisibilityChanged} event handler.
*
selection-changed
& The {@link FlexChart.selectionChanged} event handler.
*
* * The wj-flex-chart directive may contain the following child directives: * {@link wijmo.angular.chart.WjFlexChartAxis}, {@link wijmo.angular.chart.WjFlexChartSeries}, {@link wijmo.angular.chart.WjFlexChartLegend} and {@link wijmo.angular.chart.WjFlexChartDataLabel}. */ export declare class WjFlexChart extends WjFlexChartCore { readonly _controlConstructor: typeof wjcChart.FlexChart; } /** * AngularJS directive for the {@link FlexChart} {@link Axis} object. * * The wj-flex-chart-axis directive must be contained in a {@link wijmo.angular.chart.WjFlexChart} directive or {@link wijmo.angular.chart.finance.WjFinancialChart} directive. * It supports the following attributes: * *
*
wj-property
@ Defines the {@link FlexChart} property name, * axis-x or axis-y, to initialize with the directive.
*
axis-line
@ The value indicating whether the axis line is visible.
*
binding
@ Gets or sets the comma-separated property names for * the {@link wijmo.chart.Axis.itemsSource} property to use in axis labels. * The first name specifies the value on the axis, the second represents * the corresponding axis label. The default value is 'value,text'.
*
format
@ The format string used for the axis labels * (see {@link Globalize}).
*
item-formatter
= The formatter function that customizes the * appearance of axis labels.
*
items-source
= The items source for the axis labels.
*
labels
@ The value indicating whether the axis labels are visible.
*
label-angle
@ The rotation angle of axis labels in degrees.
*
label-align
@ The alignment of axis labels.
*
label-padding
@ The padding of axis labels.
*
major-grid
@ The value indicating whether the axis includes grid lines.
*
major-tick-marks
@ Defines the appearance of tick marks on the axis * (see {@link TickMark}).
*
major-unit
@ The number of units between axis labels.
*
max
@ The minimum value shown on the axis.
*
min
@ The maximum value shown on the axis.
*
minor-grid
@ The value indicating whether the axis includes minor grid lines.
*
minor-tick-marks
@ Defines the appearance of minor tick marks on the axis * (see {@link TickMark}).
*
minor-unit
@ The number of units between minor axis ticks.
*
origin
@ The axis origin.
*
overlappingLabels
@ The {@link OverlappingLabels} value indicating how to handle the overlapping axis labels.
*
position
@ The {@link Position} value indicating the position of the axis.
*
reversed
@ The value indicating whether the axis is reversed (top to * bottom or right to left).
*
title
@ The title text shown next to the axis.
*
*/ export declare class WjFlexChartAxis extends WjDirective { constructor(); readonly _controlConstructor: typeof wjcChart.Axis; _initControl(element: any): any; } /** * AngularJS directive for the {@link FlexChart} {@link Legend} object. * * The wj-flex-chart-legend directive must be contained in a {@link wijmo.angular.chart.WjFlexChart} directive, {@link wijmo.angular.chart.WjFlexPie} directive or {@link wijmo.angular.chart.finance.WjFinancialChart} directive. * It supports the following attributes: * *
*
position
@ The {@link Position} value indicating the position of the * legend.
*
reverse
@ The {@link Reverse} value indicating whether to reverse the order of the * legends. leave it undefined if to let chart decide automatically
*
* * The example below shows how you can use the wj-flex-chart-legend directive * to change the position of the chart legend: * *
<wj-flex-chart
 *   items-source="data"
 *   binding-x="country">
 *   <wj-flex-chart-axis
 *       wj-property="axisY"
 *       major-unit="5000">
 *     </wj-flex-chart-axis>
 *     <wj-flex-chart-series
 *       binding="sales"
 *       name="Sales">
 *     </wj-flex-chart-series>
 *   <wj-flex-chart-legend
 *     position="Bottom">
 *   </wj-flex-chart-legend>
 * </wj-flex-chart>
*/ export declare class WjFlexChartLegend extends WjDirective { constructor(); readonly _controlConstructor: typeof wjcChart.Legend; } export declare class WjFlexChartDataLabelBase extends WjDirective { constructor(); readonly _controlConstructor: typeof wjcChart.DataLabelBase; } /** * AngularJS directive for the {@link FlexChart} {@link DataLabel} object. * * The wj-flex-chart-data-label directive must be contained in a {@link wijmo.angular.chart.WjFlexChart} directive. * It supports the following attributes: * *
*
content
= A string or function that gets or sets the content of the data labels.
*
border
@ Gets or sets a value indicating whether the data labels have borders.
*
position
@ The {@link LabelPosition} value indicating the position of the data labels.
*
*/ export declare class WjFlexChartDataLabel extends WjFlexChartDataLabelBase { constructor(); readonly _controlConstructor: typeof wjcChart.DataLabel; } /** * AngularJS directive for the {@link FlexPie} {@link PieDataLabel} object. * * The wj-flex-pie-data-label directive must be contained in a {@link wijmo.angular.chart.WjFlexPie} directive. * It supports the following attributes: * *
*
content
= A string or function that gets or sets the content of the data labels.
*
border
@ Gets or sets a value indicating whether the data labels have borders.
*
position
@ The {@link PieLabelPosition} value indicating the position of the data labels.
*
*/ export declare class WjFlexPieDataLabel extends WjFlexChartDataLabelBase { constructor(); readonly _controlConstructor: typeof wjcChart.PieDataLabel; } export declare class WjSeriesBase extends WjDirective { constructor(); readonly _controlConstructor: any; _initControl(element: any): any; _getId(): string; } /** * AngularJS directive for the {@link FlexChart} {@link Series} object. * * The wj-flex-chart-series directive must be contained in a {@link wijmo.angular.chart.WjFlexChart} directive. * It supports the following attributes: * *
*
axis-x
@ X-axis for the series.
*
axis-y
@ Y-axis for the series.
*
binding
@ The name of the property that contains Y values for the * series. This value overrides any binding set for the chart.
*
binding-x
@ The name of the property that contains X values for the * series. This value overrides any binding set for the chart.
*
chart-type
@ The chart type to use in rendering objects for this series * objects. This value overrides the default chart type set on the chart. See * {@link ChartType}.
*
css-class
@ The CSS class to use for the series.
*
items-source
= An array or {@link ICollectionView} object that contains * data for this series.
*
name
@ The name of the series to show in the legend.
*
style
= The series style. Use ng-attr-style to specify the series * style object as an object. See the section on ngAttr attribute bindings in * * AngularJS Creating Custom Directives and the * FlexChart 101 Styling Series sample for more information.
*
altStyle
= The series alternative style.
*
symbol-marker
@ The shape of marker to use for the series. This value * overrides the default marker set on the chart. See {@link Marker}.
*
symbol-size
@ The size of the symbols used to render data points in this series * for Scatter, LineSymbols, and SplineSymbols charts, in pixels. * This value overrides any settings at the chart level.
*
symbol-style
= The style of the symbols used to render data * points in this series for Scatter, LineSymbols, and SplineSymbols charts. * This value overrides any settings at the chart level.
*
visibility
= The {@link SeriesVisibility} value indicating whether and where to * display the series.
*
* * In most cases, the wj-flex-chart-series specifies only the name and binding properties. * The remaining values are inherited from the parent wj-flex-chart directive. */ export declare class WjFlexChartSeries extends WjSeriesBase { constructor(); readonly _controlConstructor: any; } /** * AngularJS directive for the {@link FlexChart} {@link LineMarker} object. * * The wj-flex-line-marker directive must be contained in a {@link wijmo.angular.chart.WjFlexChart} directive or {@link wijmo.angular.chart.finance.WjFinancialChart} directive. * It supports the following attributes: * *
*
is-visible
@ The value indicating whether the LineMarker is visible.
*
series-index
@ The index of the series in the chart in which the LineMarker appears.
*
horizontal-position
@ The horizontal position of the LineMarker relative to the plot area.
*
content
@ The function that allows you to customize the text content of the LineMarker.
*
vertical-position
@ The vertical position of the LineMarker relative to the plot area.
*
alignment
@ The {@link LineMarkerAlignment} value indicating the alignment of the LineMarker content.
*
lines
@ The {@link LineMarkerLines} value indicating the appearance of the LineMarker's lines.
*
interaction
@ The {@link LineMarkerInteraction} value indicating the interaction mode of the LineMarker.
*
drag-threshold
@ The maximum distance from the horizontal or vertical line that you can drag the marker.
*
drag-content
@ The value indicating whether you can drag the content of the marker when the interaction mode is "Drag".
*
drag-lines
@ The value indicating whether the lines are linked when you drag the horizontal or vertical line when the interaction mode is "Drag".
*
*/ export declare class WjFlexChartLineMarker extends WjDirective { constructor(); readonly _controlConstructor: any; } /** * AngularJS directive for the {@link FlexChart} {@link DataPoint} object. * * The wj-flex-chart-data-point directive must be contained in a * {@link wijmo.angular.chart.annotation.WjFlexChartAnnotation} directive. * The property of the parent directive's object * where wj-flex-data-point should assign a value is specified in the * wj-property attribute. * * The directive supports the following attributes: * *
* *
wj-property
@ The name of the parent directive object's property where the * DataPoint will be assigned.
*
x
@ x coordinate, can be a numeric or date value.
*
y
@ y coordinate, can be a numeric or date value.
*
*/ export declare class WjFlexChartDataPoint extends WjDirective { constructor(); readonly _controlConstructor: any; } /** * AngularJS directive for the {@link FlexPie} control. * *
*
items-source
= An array or {@link ICollectionView} * object that contains data for the chart.
*
binding
@ The name of the property that * contains item values.
*
binding-name
@ The name of the property that * contains item names.
*
footer
@ The text to display in the chart footer (plain * text).
*
footer-style
= The style to apply to the chart footer.
*
header
@ The text to display in the chart header (plain * text).
*
header-style
= The style to apply to the chart header.
*
initialized
& This event occurs after the binding has finished * initializing the control with attribute values.
*
is-initialized
= A value indicating whether the binding has finished * initializing the control with attribute values.
*
inner-radius
@ The size of the hole inside the * pie, measured as a fraction of the pie radius.
*
is-animated
@ A value indicating whether to use animation * to move selected items to the selectedItemPosition.
*
item-formatter
= The formatter function that customizes the * appearance of data points.
*
offset
@ The extent to which pie slices are pulled * out from the center, as a fraction of the pie radius.
*
palette
= An array that contains the default colors used for * displaying pie slices.
*
plot-margin
= The number of pixels of space to leave between the * edges of the control and the plot area, or CSS-style margins.
*
reversed
@ A value indicating whether to draw pie * slices in a counter-clockwise direction.
*
start-angle
@ The starting angle for pie slices, * measured clockwise from the 9 o'clock position.
*
selected-item-offset
*
@ The extent to which the selected pie slice is * pulled out from the center, as a fraction of the pie radius.
*
selected-item-position
*
@ The {@link Position} value indicating where to display * the selected slice.
*
selection-mode
@ The {@link SelectionMode} value indicating whether or what is * selected when the user clicks a series.
*
tooltip-content
@ The value to display in the * {@link ChartTooltip} content property.
*
got-focus
& The {@link FlexPie.gotFocus} event handler.
*
lost-focus
& The {@link FlexPie.lostFocus} event handler.
*
rendering
& The {@link FlexPie.rendering} event handler.
*
rendered
& The {@link FlexPie.rendered} event handler.
*
* * The wj-flex-pie directive may contain the following child directives: * {@link wijmo.angular.chart.WjFlexChartLegend} and {@link wijmo.angular.chart.WjFlexPieDataLabel}. */ export declare class WjFlexPie extends WjFlexChartBase { readonly _controlConstructor: typeof wjcChart.FlexPie; _initProps(): void; } export declare class WjFlexChartPlotArea extends WjDirective { constructor(); readonly _controlConstructor: typeof wjcChart.PlotArea; _initControl(element: any): any; }