UNPKG

3.19 kBTypeScriptView Raw
1import { LineStyleProps, TextStyleProps, MarkerStyleProps } from '@antv/f-engine';
2import Coord from '../../coord';
3import { DataRecord, DataField, DataValue } from '../../chart/Data';
4
5interface TickLine extends LineStyleProps {
6 length?: number; // tick line 的长度
7}
8
9interface Text extends TextStyleProps {
10 align?: 'left' | 'right' | 'start' | 'center' | 'end' | 'between' | 'auto';
11 text?: string;
12}
13
14// 仅在 bottom 下新增了 align 支持 `between`
15type StyleText<T = any> = T extends 'bottom' | void ? Text : Omit<Text, 'align'>;
16
17type LabelCallback<Type = void> = (
18 text: Tick['text'],
19 index: number,
20 total: number
21) => StyleText<Type>;
22type GridCallBack = (text: Tick['text'], index: number, total: number) => LineStyleProps;
23
24interface symbolStyleProps extends MarkerStyleProps {
25 type?: MarkerStyleProps.symbol;
26}
27export interface Style<Type = void> {
28 grid?: LineStyleProps;
29 tickLine?: TickLine;
30 line?: LineStyleProps;
31 symbol?: symbolStyleProps | symbolStyleProps[];
32 labelOffset?: number;
33 label?: StyleText<Type>;
34}
35
36export interface StyleProps<Type = void> extends Omit<Style, 'label' | 'grid' | 'labelOffset'> {
37 width?: number | string;
38 height?: number | string;
39 label?: StyleText<Type> | LabelCallback<Type>;
40 grid?: LineStyleProps | GridCallBack;
41 labelOffset?: number | string;
42}
43
44interface Point {
45 x: number;
46 y: number;
47}
48
49export interface Tick {
50 value: number;
51 points: Point[];
52 text: string;
53 tickValue: string | number;
54 labelStyle?: Text;
55 gridStyle?: LineStyleProps;
56 gridPoints?: Point[];
57}
58
59type PolarCord = Pick<Coord, 'center'>;
60type RectCord = Pick<Coord, 'left' | 'right' | 'bottom' | 'top'>;
61
62export interface RectProps<Type = void> {
63 ticks?: Tick[];
64 coord?: RectCord;
65 style?: Style<Type>;
66 animation?: any;
67}
68
69export interface PolarProps {
70 ticks?: Tick[];
71 coord?: PolarCord;
72 style?: Style;
73 animation?: any;
74 grid?: 'line' | 'arc';
75 gridPoints?: Point[][];
76}
77
78export class RectOrPolarCoord<T extends boolean> extends Coord {
79 isPolar: T;
80}
81
82export interface RectAxisProps {
83 coord: RectOrPolarCoord<true>;
84 position: 'right' | 'left' | 'top' | 'bottom';
85 ticks?: Tick[];
86 style?: Style;
87 animation?: any;
88}
89
90export interface PolarAxisProps {
91 coord: RectOrPolarCoord<false>;
92 dimType: 'x' | 'y';
93 ticks?: Tick[];
94 style?: Style;
95 animation?: any;
96}
97
98export interface AxisProps<
99 TRecord extends DataRecord = DataRecord,
100 TField extends DataField<TRecord> = DataField<TRecord>
101> {
102 /**
103 * 是否显示该坐标轴
104 */
105 visible?: boolean;
106 /**
107 * 映射的字段名称
108 */
109 field: TField;
110 /**
111 * 坐标轴显示位置
112 */
113 position?: 'right' | 'left' | 'top' | 'bottom';
114 /**
115 * 回调函数,用于格式化坐标轴刻度点的文本显示,
116 * 会影响数据在坐标轴 axis、图例 legend、提示信息 tooltip 上的显示。
117 */
118 formatter?: (value: DataValue<TRecord, TField>) => string | number;
119 type?: string;
120 tickCount?: number;
121 range?: any;
122 mask?: string;
123 min?: number;
124 max?: number;
125 nice?: boolean;
126 ticks?: Array;
127 /**
128 * 坐标轴样式定制
129 */
130 style?: StyleProps;
131 // 网格线类型
132 grid?: 'arc' | 'line';
133}