UNPKG

5 kBTypeScriptView Raw
1/**
2 * @fileOverview Line
3 */
4import React, { PureComponent, ReactElement } from 'react';
5import { CurveType, Props as CurveProps, Point as CurvePoint } from '../shape/Curve';
6import { Props as DotProps } from '../shape/Dot';
7import { ImplicitLabelType } from '../component/Label';
8import { Props as XAxisProps } from './XAxis';
9import { Props as YAxisProps } from './YAxis';
10import { D3Scale, LegendType, TooltipType, AnimationTiming, ChartOffset, DataKey, TickItem, AnimationDuration, ActiveShape } from '../util/types';
11export type LineDot = ReactElement<SVGElement> | ((props: any) => ReactElement<SVGElement>) | DotProps | boolean;
12export interface LinePointItem extends CurvePoint {
13 value?: number;
14 payload?: any;
15}
16interface InternalLineProps {
17 top?: number;
18 left?: number;
19 width?: number;
20 height?: number;
21 points?: LinePointItem[];
22 xAxis?: Omit<XAxisProps, 'scale'> & {
23 scale: D3Scale<string | number>;
24 };
25 yAxis?: Omit<YAxisProps, 'scale'> & {
26 scale: D3Scale<string | number>;
27 };
28}
29interface LineProps extends InternalLineProps {
30 className?: string;
31 data?: any;
32 type?: CurveType;
33 unit?: string | number;
34 name?: string | number;
35 yAxisId?: string | number;
36 xAxisId?: string | number;
37 dataKey?: DataKey<any>;
38 legendType?: LegendType;
39 tooltipType?: TooltipType;
40 layout?: 'horizontal' | 'vertical';
41 connectNulls?: boolean;
42 hide?: boolean;
43 activeDot?: ActiveShape<DotProps> | DotProps;
44 dot?: LineDot;
45 onAnimationStart?: () => void;
46 onAnimationEnd?: () => void;
47 isAnimationActive?: boolean;
48 animateNewValues?: boolean;
49 animationBegin?: number;
50 animationDuration?: AnimationDuration;
51 animationEasing?: AnimationTiming;
52 animationId?: number;
53 id?: string;
54 label?: ImplicitLabelType;
55}
56export type Props = Omit<CurveProps, 'points' | 'pathRef'> & LineProps;
57interface State {
58 isAnimationFinished?: boolean;
59 totalLength?: number;
60 prevPoints?: LinePointItem[];
61 curPoints?: LinePointItem[];
62 prevAnimationId?: number;
63}
64export declare class Line extends PureComponent<Props, State> {
65 static displayName: string;
66 static defaultProps: {
67 xAxisId: number;
68 yAxisId: number;
69 connectNulls: boolean;
70 activeDot: boolean;
71 dot: boolean;
72 legendType: string;
73 stroke: string;
74 strokeWidth: number;
75 fill: string;
76 points: LinePointItem[];
77 isAnimationActive: boolean;
78 animateNewValues: boolean;
79 animationBegin: number;
80 animationDuration: number;
81 animationEasing: string;
82 hide: boolean;
83 label: boolean;
84 };
85 /**
86 * Compose the data of each group
87 * @param {Object} props The props from the component
88 * @param {Object} xAxis The configuration of x-axis
89 * @param {Object} yAxis The configuration of y-axis
90 * @param {String} dataKey The unique key of a group
91 * @return {Array} Composed data
92 */
93 static getComposedData: ({ props, xAxis, yAxis, xAxisTicks, yAxisTicks, dataKey, bandSize, displayedData, offset, }: {
94 props: Props;
95 xAxis: Props['xAxis'];
96 yAxis: Props['yAxis'];
97 xAxisTicks: TickItem[];
98 yAxisTicks: TickItem[];
99 dataKey: Props['dataKey'];
100 bandSize: number;
101 displayedData: any[];
102 offset: ChartOffset;
103 }) => {
104 top?: number;
105 bottom?: number;
106 left?: number;
107 right?: number;
108 width?: number;
109 height?: number;
110 brushBottom?: number;
111 points: {
112 x: number;
113 y: number;
114 value: any;
115 payload: any;
116 }[];
117 layout: "horizontal" | "vertical";
118 };
119 mainCurve?: SVGPathElement;
120 state: State;
121 componentDidMount(): void;
122 componentDidUpdate(): void;
123 static getDerivedStateFromProps(nextProps: Props, prevState: State): State;
124 getTotalLength(): number;
125 generateSimpleStrokeDasharray: (totalLength: number, length: number) => string;
126 getStrokeDasharray: (length: number, totalLength: number, lines: number[]) => string;
127 id: string;
128 pathRef: (node: SVGPathElement) => void;
129 static repeat(lines: number[], count: number): number[];
130 handleAnimationEnd: () => void;
131 handleAnimationStart: () => void;
132 renderErrorBar(needClip: boolean, clipPathId: string): React.JSX.Element;
133 static renderDotItem(option: LineDot, props: any): React.JSX.Element;
134 renderDots(needClip: boolean, clipDot: boolean, clipPathId: string): React.JSX.Element;
135 renderCurveStatically(points: LinePointItem[], needClip: boolean, clipPathId: string, props?: {
136 strokeDasharray: string;
137 }): React.JSX.Element;
138 renderCurveWithAnimation(needClip: boolean, clipPathId: string): React.JSX.Element;
139 renderCurve(needClip: boolean, clipPathId: string): React.JSX.Element;
140 render(): React.JSX.Element;
141}
142export {};