@visactor/vgrammar-hierarchy
Version:
Layout of hierarchical data for VGrammar
140 lines (139 loc) • 4.5 kB
TypeScript
import type { ITextGraphicAttribute } from '@visactor/vrender-core';
export type ViewBoxOptions = {
width: number;
height: number;
} | {
x0: number;
x1: number;
y0: number;
y1: number;
};
export interface TreemapOptions {
gapWidth?: number | number[];
padding?: number | number[];
aspectRatio?: number;
labelPadding?: number | number[];
labelPosition?: 'top' | 'bottom' | 'left' | 'right';
splitType?: 'binary' | 'dice' | 'slice' | 'sliceDice' | 'squarify';
nodeKey?: string | number | ((datum: TreemapDatum) => string | number);
maxDepth?: number;
minVisibleArea?: number | number[];
minChildrenVisibleArea?: number | number[];
minChildrenVisibleSize?: number | number[];
valueField?: string;
}
export type TreemapTramsformOptions = TreemapOptions & ViewBoxOptions & {
flatten?: boolean;
};
export interface HierarchicalDatum {
value?: number;
children?: HierarchicalDatum[];
}
export type HierarchicalData = HierarchicalDatum[];
export type TreemapData = HierarchicalDatum[];
export type TreemapDatum = HierarchicalDatum;
export interface HierarchicalNodeElement<Datum> {
key: string;
parentKey?: string;
flattenIndex: number;
index: number;
depth: number;
maxDepth: number;
isLeaf?: boolean;
value: number;
datum: Datum[];
children?: HierarchicalNodeElement<Datum>[];
}
export interface TreemapNodeElement extends Omit<HierarchicalNodeElement<TreemapDatum>, 'children'> {
x0?: number;
y0?: number;
x1?: number;
y1?: number;
width?: number;
height?: number;
labelRect?: {
x0?: number;
x1?: number;
y0?: number;
y1?: number;
};
children?: TreemapNodeElement[];
}
type PositionType = string | number;
export interface SunburstLabelConfig {
align?: 'start' | 'end' | 'center';
rotate?: 'tangential' | 'radial';
offset?: number;
}
export type SunburstLabelOptions = boolean | SunburstLabelConfig;
export interface SunburstOptions {
startAngle?: number;
endAngle?: number;
center?: [PositionType, PositionType];
innerRadius?: PositionType | PositionType[];
outerRadius?: PositionType | PositionType[];
gapRadius?: number | number[];
nodeKey?: string | number | ((datum: HierarchicalDatum) => string | number);
label?: SunburstLabelOptions | SunburstLabelOptions[];
}
export type SunburstTramsformOptions = SunburstOptions & ViewBoxOptions & {
flatten?: boolean;
maxDepth?: number;
};
export interface SunburstNodeElement extends HierarchicalNodeElement<HierarchicalDatum> {
innerRadius?: number;
outerRadius?: number;
startAngle?: number;
endAngle?: number;
x?: number;
y?: number;
children?: SunburstNodeElement[];
label?: Pick<ITextGraphicAttribute, 'x' | 'y' | 'textAlign' | 'textBaseline' | 'angle' | 'maxLineWidth'>;
}
export interface ICircle {
x?: number;
y?: number;
radius?: number;
}
export interface CirclePackingOptions {
nodeSort?: boolean | ((a: CirclePackingNodeElement, b: CirclePackingNodeElement) => number);
padding?: number | number[];
setRadius?: (datum: CirclePackingNodeElement) => number;
nodeKey?: string | number | ((datum: HierarchicalDatum) => string | number);
includeRoot?: boolean;
}
export type CirclePackingTramsformOptions = CirclePackingOptions & ViewBoxOptions & {
flatten?: boolean;
maxDepth?: number;
};
export interface CirclePackingNodeElement extends HierarchicalNodeElement<HierarchicalDatum>, ICircle {
children?: CirclePackingNodeElement[];
label?: Pick<ITextGraphicAttribute, 'x' | 'y' | 'textAlign' | 'textBaseline' | 'angle' | 'maxLineWidth'>;
}
export interface TreeOptions {
direction?: 'horizontal' | 'vertical' | 'LR' | 'RL' | 'TB' | 'BT';
layoutType?: 'orthogonal' | 'radial';
alignType?: 'leaf' | 'depth';
linkWidth?: number | number[];
minNodeGap?: number;
nodeKey?: string | number | ((datum: HierarchicalDatum) => string | number);
}
export type TreeTramsformOptions = TreeOptions & ViewBoxOptions & {
flatten?: boolean;
maxDepth?: number;
};
export interface TreeNodeElement extends HierarchicalNodeElement<HierarchicalDatum> {
children?: TreeNodeElement[];
x?: number;
y?: number;
}
export interface TreeLinkElement {
source: TreeNodeElement;
target: TreeNodeElement;
x0?: number;
y0?: number;
x1?: number;
y1?: number;
key?: string;
}
export {};