UNPKG

igniteui-react-charts

Version:

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

168 lines (167 loc) 6.21 kB
import * as React from 'react'; import { TimeAxisLabelFormat } from "./TimeAxisLabelFormat"; export declare class IgrTimeAxisLabelFormat<P extends IIgrTimeAxisLabelFormatProps = IIgrTimeAxisLabelFormatProps> extends React.Component<P, {}> { protected _implementation: any; get i(): TimeAxisLabelFormat; private onImplementationCreated; constructor(props: P); componentDidMount(): void; shouldComponentUpdate(nextProps: any, nextState: any): boolean; render(): any; protected createImplementation(): TimeAxisLabelFormat; private _renderer; private _provideRenderer; static _createFromInternal(internal: any): IgrTimeAxisLabelFormat; /** * The visible axis range at which to apply this label format. * * The `Range` property provide the visible axis range at which to apply this label format. * * ```ts * let labelFormat = new TimeAxisLabelFormat(); * labelFormat.format = "hh:mm:ss"; * labelFormat.range = 1000; * this.xAxis.labelFormats.add(labelFormat); * labelFormat = new TimeAxisLabelFormat(); * labelFormat.format = "hh:mm"; * labelFormat.range = 60 * 1000; * this.xAxis.labelFormats.add(labelFormat); * labelFormat = new TimeAxisLabelFormat(); * labelFormat.format = "MMM-dd-yy"; * labelFormat.range = 24 * 60 * 60 * 1000; * this.xAxis.labelFormats.add(labelFormat); * ``` */ get range(): number; set range(v: number); /** * The DateTime format string to apply. * Some common DateTime format strings are: yyyy, MM/dd/yy, and hh:mm:ss. * * The `Format` property provide the DateTime format string to apply. * * ```ts * let labelFormat = new TimeAxisLabelFormat(); * labelFormat.format = "hh:mm:ss"; * labelFormat.range = 1000; * this.xAxis.labelFormats.add(labelFormat); * labelFormat = new TimeAxisLabelFormat(); * labelFormat.format = "hh:mm"; * labelFormat.range = 60 * 1000; * this.xAxis.labelFormats.add(labelFormat); * labelFormat = new TimeAxisLabelFormat(); * labelFormat.format = "MMM-dd-yy"; * labelFormat.range = 24 * 60 * 60 * 1000; * this.xAxis.labelFormats.add(labelFormat); * ``` * * ```ts * <IgrDataChart * dataSource={this.state.dataSource} * width="700px" * height="500px"> * <IgrTimeXAxis name="xAxis" label="Date" * dateTimeMemberPath="Date" /> * </IgrDataChart> * ``` */ get format(): string; set format(v: string); /** * The DateTime format string to apply, if the year is repeated from the prior date. * Some common DateTime format strings are: yyyy, MM/dd/yy, and hh:mm:ss. */ get repeatedYearFormat(): string; set repeatedYearFormat(v: string); /** * The DateTime format string to apply, if the month is repeated from the prior date. * Some common DateTime format strings are: yyyy, MM/dd/yy, and hh:mm:ss. */ get repeatedMonthFormat(): string; set repeatedMonthFormat(v: string); /** * The DateTime format string to apply, if the day is repeated from the prior date. * Some common DateTime format strings are: yyyy, MM/dd/yy, and hh:mm:ss. */ get repeatedDayFormat(): string; set repeatedDayFormat(v: string); findByName(name: string): any; protected __p: string; protected _hasUserValues: Set<string>; protected get hasUserValues(): Set<string>; protected __m(propertyName: string): void; protected _stylingContainer: any; protected _stylingParent: any; protected _inStyling: boolean; protected _styling(container: any, component: any, parent?: any): void; } export interface IIgrTimeAxisLabelFormatProps { /** * The visible axis range at which to apply this label format. * * The `Range` property provide the visible axis range at which to apply this label format. * * ```ts * let labelFormat = new TimeAxisLabelFormat(); * labelFormat.format = "hh:mm:ss"; * labelFormat.range = 1000; * this.xAxis.labelFormats.add(labelFormat); * labelFormat = new TimeAxisLabelFormat(); * labelFormat.format = "hh:mm"; * labelFormat.range = 60 * 1000; * this.xAxis.labelFormats.add(labelFormat); * labelFormat = new TimeAxisLabelFormat(); * labelFormat.format = "MMM-dd-yy"; * labelFormat.range = 24 * 60 * 60 * 1000; * this.xAxis.labelFormats.add(labelFormat); * ``` */ range?: number | string; /** * The DateTime format string to apply. * Some common DateTime format strings are: yyyy, MM/dd/yy, and hh:mm:ss. * * The `Format` property provide the DateTime format string to apply. * * ```ts * let labelFormat = new TimeAxisLabelFormat(); * labelFormat.format = "hh:mm:ss"; * labelFormat.range = 1000; * this.xAxis.labelFormats.add(labelFormat); * labelFormat = new TimeAxisLabelFormat(); * labelFormat.format = "hh:mm"; * labelFormat.range = 60 * 1000; * this.xAxis.labelFormats.add(labelFormat); * labelFormat = new TimeAxisLabelFormat(); * labelFormat.format = "MMM-dd-yy"; * labelFormat.range = 24 * 60 * 60 * 1000; * this.xAxis.labelFormats.add(labelFormat); * ``` * * ```ts * <IgrDataChart * dataSource={this.state.dataSource} * width="700px" * height="500px"> * <IgrTimeXAxis name="xAxis" label="Date" * dateTimeMemberPath="Date" /> * </IgrDataChart> * ``` */ format?: string; /** * The DateTime format string to apply, if the year is repeated from the prior date. * Some common DateTime format strings are: yyyy, MM/dd/yy, and hh:mm:ss. */ repeatedYearFormat?: string; /** * The DateTime format string to apply, if the month is repeated from the prior date. * Some common DateTime format strings are: yyyy, MM/dd/yy, and hh:mm:ss. */ repeatedMonthFormat?: string; /** * The DateTime format string to apply, if the day is repeated from the prior date. * Some common DateTime format strings are: yyyy, MM/dd/yy, and hh:mm:ss. */ repeatedDayFormat?: string; }