UNPKG

igniteui-react-charts

Version:

Ignite UI React charting components for building rich data visualizations using TypeScript APIs.

288 lines (285 loc) 9.38 kB
import { AxisAngleLabelMode } from "./AxisAngleLabelMode"; import { IgrCategoryAxisBase, IIgrCategoryAxisBaseProps } from "./igr-category-axis-base"; import { CategoryAngleAxis } from "./CategoryAngleAxis"; /** * Represents a IgxDataChartComponent category angle axis. Useful for displaying radial categories. * * `CategoryAngleAxis` represents a IgxDataChartComponent category angle axis. Useful for displaying radial categories * * ```ts * <IgrDataChart * ref={this.onChartRef} * dataSource={this.state.dataSource} * width="100%" * height="100%" > * * <IgrCategoryAngleAxis name="angleAxis" label="Department" /> * <IgrNumericRadiusAxis name="radiusAxis" /> * * </IgrDataChart> * ``` */ export declare class IgrCategoryAngleAxis<P extends IIgrCategoryAngleAxisProps = IIgrCategoryAngleAxisProps> extends IgrCategoryAxisBase<P> { protected createImplementation(): CategoryAngleAxis; /** * @hidden */ get i(): CategoryAngleAxis; constructor(props: P); /** * Checks if the axis is of angular type */ get isAngular(): boolean; /** * Gets or sets interval of labels on the companion axis. */ get companionAxisInterval(): number; set companionAxisInterval(v: number); /** * Gets or sets label angle on the companion axis. */ get companionAxisMinorInterval(): number; set companionAxisMinorInterval(v: number); /** * Gets or sets angle in degress that the chart's 0th angle should be offset for the companion axis */ get companionAxisStartAngleOffset(): number; set companionAxisStartAngleOffset(v: number); /** * Gets or sets the mode axis labels will operate for the companion axis. */ get companionAxisLabelMode(): AxisAngleLabelMode; set companionAxisLabelMode(v: AxisAngleLabelMode); /** * Indicates the angle in degress that the chart's 0th angle should be offset. * * Indicates the angle in degress that the chart's 0th angle should be offset. * * ```ts * <IgrDataChart * dataSource={this.state.dataSource} > * * <IgrCategoryAngleAxis name="angleAxis" startAngleOffset ={30} /> * <IgrNumericRadiusAxis name="radiusAxis" /> * * </IgrDataChart> * ``` */ get startAngleOffset(): number; set startAngleOffset(v: number); /** * Indicates the mode axis labels will operate in. */ get labelMode(): AxisAngleLabelMode; set labelMode(v: AxisAngleLabelMode); get areGroupSizesUneven(): boolean; /** * Gets or sets the frequency of displayed labels. * The set value is a factor that determines which labels will be hidden. For example, an interval of 2 will display every other label. * * Gets or sets the frequency of displayed labels.The set value is a factor that determines which labels will be hidden. * For example, an interval of 2 will display every other label. * * ```ts * <IgrDataChart * dataSource={this.state.dataSource} > * * <IgrCategoryAngleAxis name="angleAxis" interval ={2} /> * <IgrNumericRadiusAxis name="radiusAxis" /> * * </IgrDataChart> * ``` */ get interval(): number; set interval(v: number); /** * Gets the effective value for the current Interval. * * Gets the effective value for the current Interval. * * ```ts * * <IgrDataChart * ref={this.onChartRef} * dataSource={this.state.dataSource} * width="100%" * height="100%" > * * <IgrCategoryAngleAxis name="angleAxis" label="Department" actualInterval={5} /> * <IgrNumericRadiusAxis name="radiusAxis" /> * * </IgrDataChart> * ``` */ get actualInterval(): number; set actualInterval(v: number); /** * Gets or sets the frequency of displayed minor lines. * The set value is a factor that determines how the minor lines will be displayed. * * Gets or sets the frequency of displayed minor lines. The set value is a factor that determines how the minor lines will be displayed. * * ```ts * <IgrDataChart * ref={this.onChartRef} * dataSource={this.state.dataSource} * width="100%" * height="100%" > * * <IgrCategoryAngleAxis name="angleAxis" label="Department" minorInterval={5} /> * <IgrNumericRadiusAxis name="radiusAxis" /> * * </IgrDataChart> * ``` */ get minorInterval(): number; set minorInterval(v: number); /** * Gets the effective value for the current MinorInterval. * * Get the effective value for the current minorInterval. * * ```ts * <IgrDataChart * ref={this.onChartRef} * dataSource={this.state.dataSource} * width="100%" * height="100%" > * * <IgrCategoryAngleAxis name="angleAxis" label="Department" actualMinorInterval={5} /> * <IgrNumericRadiusAxis name="radiusAxis" /> * * </IgrDataChart> * ``` */ get actualMinorInterval(): number; set actualMinorInterval(v: number); /** * Gets the scaled angle in radians from the raw axis value. * @param unscaledAngle * The raw axis value. */ getScaledAngle(unscaledAngle: number): number; /** * Gets the raw axis value from the scaled angle in radians. */ getUnscaledAngle(scaledAngle: number): number; private _actualIntervalChange; private _actualIntervalChange_wrapped; get actualIntervalChange(): (s: IgrCategoryAngleAxis, e: number) => void; set actualIntervalChange(ev: (s: IgrCategoryAngleAxis, e: number) => void); } export interface IIgrCategoryAngleAxisProps extends IIgrCategoryAxisBaseProps { /** * Gets or sets interval of labels on the companion axis. */ companionAxisInterval?: number | string; /** * Gets or sets label angle on the companion axis. */ companionAxisMinorInterval?: number | string; /** * Gets or sets angle in degress that the chart's 0th angle should be offset for the companion axis */ companionAxisStartAngleOffset?: number | string; /** * Gets or sets the mode axis labels will operate for the companion axis. */ companionAxisLabelMode?: AxisAngleLabelMode | string; /** * Indicates the angle in degress that the chart's 0th angle should be offset. * * Indicates the angle in degress that the chart's 0th angle should be offset. * * ```ts * <IgrDataChart * dataSource={this.state.dataSource} > * * <IgrCategoryAngleAxis name="angleAxis" startAngleOffset ={30} /> * <IgrNumericRadiusAxis name="radiusAxis" /> * * </IgrDataChart> * ``` */ startAngleOffset?: number | string; /** * Indicates the mode axis labels will operate in. */ labelMode?: AxisAngleLabelMode | string; /** * Gets or sets the frequency of displayed labels. * The set value is a factor that determines which labels will be hidden. For example, an interval of 2 will display every other label. * * Gets or sets the frequency of displayed labels.The set value is a factor that determines which labels will be hidden. * For example, an interval of 2 will display every other label. * * ```ts * <IgrDataChart * dataSource={this.state.dataSource} > * * <IgrCategoryAngleAxis name="angleAxis" interval ={2} /> * <IgrNumericRadiusAxis name="radiusAxis" /> * * </IgrDataChart> * ``` */ interval?: number | string; /** * Gets the effective value for the current Interval. * * Gets the effective value for the current Interval. * * ```ts * * <IgrDataChart * ref={this.onChartRef} * dataSource={this.state.dataSource} * width="100%" * height="100%" > * * <IgrCategoryAngleAxis name="angleAxis" label="Department" actualInterval={5} /> * <IgrNumericRadiusAxis name="radiusAxis" /> * * </IgrDataChart> * ``` */ actualInterval?: number | string; /** * Gets or sets the frequency of displayed minor lines. * The set value is a factor that determines how the minor lines will be displayed. * * Gets or sets the frequency of displayed minor lines. The set value is a factor that determines how the minor lines will be displayed. * * ```ts * <IgrDataChart * ref={this.onChartRef} * dataSource={this.state.dataSource} * width="100%" * height="100%" > * * <IgrCategoryAngleAxis name="angleAxis" label="Department" minorInterval={5} /> * <IgrNumericRadiusAxis name="radiusAxis" /> * * </IgrDataChart> * ``` */ minorInterval?: number | string; /** * Gets the effective value for the current MinorInterval. * * Get the effective value for the current minorInterval. * * ```ts * <IgrDataChart * ref={this.onChartRef} * dataSource={this.state.dataSource} * width="100%" * height="100%" > * * <IgrCategoryAngleAxis name="angleAxis" label="Department" actualMinorInterval={5} /> * <IgrNumericRadiusAxis name="radiusAxis" /> * * </IgrDataChart> * ``` */ actualMinorInterval?: number | string; }