test/g6
1
0
Fork 0
mirror of https://gitee.com/antv/g6.git synced 2024-11-29 18:28:19 +08:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

refactor(elements): remove getKey method on base-node (#5811)

Browse Source
This commit is contained in:
Aaron 2024-06-04 13:56:03 +08:00 committed by GitHub
parent eca59ed3ea
commit 8934714cce
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
13 changed files with 20 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/g6/__tests__/utils/create.ts
View File

@ -77,7 +77,7 @@ export function createGraphCanvas(
*/
class CenterConnectCircle extends Circle {
public getIntersectPoint(): Point {
const bounds = this.getKey().getBounds();
const bounds = this.getShape('key').getBounds();
return bounds.center;
}
}

2
packages/g6/src/elements/combos/base-combo.ts
View File

@ -151,7 +151,7 @@ export abstract class BaseCombo<S extends BaseComboStyleProps = BaseComboStylePr
this.getGraphicStyle(attributes),
'collapsedMarker',
);
const keyShape = this.getKey();
const keyShape = this.getShape('key');
const [x, y] = getXYByPlacement(keyShape.getLocalBounds(), 'center');
const style = { ...collapsedMarkerStyle, x, y };

2
packages/g6/src/elements/combos/circle.ts
View File

@ -55,7 +55,7 @@ export class CircleCombo extends BaseCombo<CircleComboStyleProps> {
}
public getIntersectPoint(point: Point): Point {
const keyShapeBounds = this.getKey().getBounds();
const keyShapeBounds = this.getShape('key').getBounds();
return getEllipseIntersectPoint(point, keyShapeBounds);
}
}

22
packages/g6/src/elements/nodes/base-node.ts
View File

@ -239,7 +239,7 @@ export abstract class BaseNode<S extends BaseNodeStyleProps = BaseNodeStyleProps
this.getGraphicStyle(attributes),
'label',
);
const keyShape = this.getKey();
const keyShape = this.getShape('key');
const keyBounds = keyShape.getLocalBounds();
return Object.assign(
@ -262,7 +262,7 @@ export abstract class BaseNode<S extends BaseNodeStyleProps = BaseNodeStyleProps
if (attributes.icon === false || (!attributes.iconText && !attributes.iconSrc)) return false;
const iconStyle = subStyleProps(this.getGraphicStyle(attributes), 'icon');
const keyShape = this.getKey();
const keyShape = this.getShape('key');
const [x, y] = getXYByPlacement(keyShape.getLocalBounds(), 'center');
return { x, y, ...iconStyle };
@ -294,7 +294,7 @@ export abstract class BaseNode<S extends BaseNodeStyleProps = BaseNodeStyleProps
}
protected getBadgeStyle(style: NodeBadgeStyleProps): NodeBadgeStyleProps {
const keyShape = this.getKey();
const keyShape = this.getShape('key');
const { placement = 'top', offsetX, offsetY, ...restStyle } = style;
const textStyle = getTextStyleByPlacement(keyShape.getLocalBounds(), placement, offsetX, offsetY, true);
return { ...textStyle, ...restStyle };
@ -327,18 +327,10 @@ export abstract class BaseNode<S extends BaseNodeStyleProps = BaseNodeStyleProps
protected getPortXY(attributes: Required<S>, style: NodePortStyleProps): Point {
const { placement = 'left' } = style;
const bounds = this.getKey().getLocalBounds();
const bounds = this.getShape('key').getLocalBounds();
return getPortXYByPlacement(bounds, placement as PortPlacement);
}
/**
* Get the key shape for the node.
* @returns Key shape.
*/
public getKey<T extends DisplayObject>(): T {
return this.shapeMap.key as T;
}
/**
* Get the ports for the node.
* @returns Ports shape map.
@ -352,7 +344,7 @@ export abstract class BaseNode<S extends BaseNodeStyleProps = BaseNodeStyleProps
* @returns The center point of the node.
*/
public getCenter(): Point {
return this.getKey().getBounds().center;
return this.getShape('key').getBounds().center;
}
/**
@ -361,12 +353,12 @@ export abstract class BaseNode<S extends BaseNodeStyleProps = BaseNodeStyleProps
* @returns The intersection point.
*/
public getIntersectPoint(point: Point): Point {
const keyShapeBounds = this.getKey().getBounds();
const keyShapeBounds = this.getShape('key').getBounds();
return getRectIntersectPoint(point, keyShapeBounds);
}
protected drawHaloShape(attributes: Required<S>, container: Group): void {
const keyShape = this.getKey();
const keyShape = this.getShape('key');
this.upsert(
'halo',
keyShape.constructor as new (...args: unknown[]) => DisplayObject,

2
packages/g6/src/elements/nodes/circle.ts
View File

@ -46,7 +46,7 @@ export class Circle extends BaseNode {
}
public getIntersectPoint(point: Point): Point {
const keyShapeBounds = this.getKey().getBounds();
const keyShapeBounds = this.getShape('key').getBounds();
return getEllipseIntersectPoint(point, keyShapeBounds);
}
}

2
packages/g6/src/elements/nodes/ellipse.ts
View File

@ -52,7 +52,7 @@ export class Ellipse extends BaseNode {
}
public getIntersectPoint(point: Point): Point {
const keyShapeBounds = this.getKey().getBounds();
const keyShapeBounds = this.getShape('key').getBounds();
return getEllipseIntersectPoint(point, keyShapeBounds);
}
}

2
packages/g6/src/elements/nodes/html.ts
View File

@ -65,7 +65,7 @@ export class HTML extends BaseNode<HTMLStyleProps> {
}
protected getDomElement() {
return this.getKey<GHTML>().getDomElement();
return this.getShape<GHTML>('key').getDomElement();
}
protected getKeyStyle(attributes: Required<HTMLStyleProps>): GHTMLStyleProps {

2
packages/g6/src/elements/nodes/star.ts
View File

@ -49,7 +49,7 @@ export class Star extends Polygon<StarStyleProps> {
protected getPortXY(attributes: Required<StarStyleProps>, style: NodePortStyleProps): Point {
const { placement = 'top' } = style;
const bbox = this.getKey().getLocalBounds();
const bbox = this.getShape('key').getLocalBounds();
const ports = getStarPorts(this.getOuterR(attributes), this.getInnerR(attributes));
return getPortXYByPlacement(bbox, placement as StarPortPlacement, ports, false);
}

4
packages/g6/src/elements/nodes/triangle.ts
View File

@ -49,7 +49,7 @@ export class Triangle extends Polygon<TriangleStyleProps> {
protected getPortXY(attributes: Required<TriangleStyleProps>, style: NodePortStyleProps): Point {
const { direction } = attributes;
const { placement = 'top' } = style;
const bbox = this.getKey().getLocalBounds();
const bbox = this.getShape('key').getLocalBounds();
const [width, height] = this.getSize(attributes);
const ports = getTrianglePorts(width, height, direction);
return getPortXYByPlacement(bbox, placement as TrianglePortPlacement, ports, false);
@ -63,7 +63,7 @@ export class Triangle extends Polygon<TriangleStyleProps> {
if (icon === false || isEmpty(iconText || iconSrc)) return false;
const iconStyle = subStyleProps<IconStyleProps>(this.getGraphicStyle(attributes), 'icon');
const bbox = this.getKey().getLocalBounds();
const bbox = this.getShape('key').getLocalBounds();
const [x, y] = getTriangleCenter(bbox, direction);
const size = getIncircleRadius(bbox, direction) * 2 * ICON_SIZE_RATIO;

4
packages/g6/src/elements/shapes/base-shape.ts
View File

@ -183,8 +183,8 @@ export abstract class BaseShape<StyleProps extends BaseShapeStyleProps> extends
return createAnimationsProxy(animationMap);
}
public getShape(key: string): DisplayObject | undefined {
return this.shapeMap[key];
public getShape<T extends DisplayObject>(name: string): T {
return this.shapeMap[name] as T;
}
private setVisibility() {

2
packages/g6/src/utils/bbox.ts
View File

@ -45,7 +45,7 @@ export function getBBoxSize(bbox: AABB): [number, number] {
* @returns <zh/> 包围盒 | <en/> bounding box
*/
export function getNodeBBox(node: Point | Node, padding?: Padding): AABB {
const bbox = isPoint(node) ? getPointBBox(node) : node.getKey().getBounds();
const bbox = isPoint(node) ? getPointBBox(node) : node.getShape('key').getBounds();
return padding ? getExpandedBBox(bbox, padding) : bbox;
}

6
packages/g6/src/utils/edge.ts
View File

@ -289,8 +289,6 @@ export const getRadians = (bbox: AABB): Record<LoopPlacement, [number, number]>
* @param clockwise - <zh/> 是否顺时针 | <en/> Whether to draw the loop clockwise
* @param sourcePort - <zh/> 起点连接桩 | <en/> Source port
* @param targetPort - <zh/> 终点连接桩 | <en/> Target port
* @param rawSourcePoint - <zh/> 起点 | <en/> Source point
* @param rawTargetPoint - <zh/> 终点 | <en/> Target point
* @returns <zh/> 起点和终点 | <en/> Start and end points
*/
export function getLoopEndpoints(
@ -336,8 +334,6 @@ export function getLoopEndpoints(
* @param dist - <zh/> 从节点 keyShape 边缘到自环顶部的距离 | <en/> The distance from the edge of the node keyShape to the top of the self-loop
* @param sourcePortKey - <zh/> 起点连接桩 key | <en/> Source port key
* @param targetPortKey - <zh/> 终点连接桩 key | <en/> Target port key
* @param rawSourcePoint - <zh/> 起点 | <en/> Source point
* @param rawTargetPoint - <zh/> 终点 | <en/> Target point
* @returns <zh/> 返回绘制环形边的路径 | <en/> Returns the path of the loop edge
*/
export function getCubicLoopPath(
@ -409,8 +405,6 @@ export function getCubicLoopControlPoints(
* @param dist - <zh/> 从节点 keyShape 边缘到自环顶部的距离 | <en/> The distance from the edge of the node keyShape to the top of the self-loop
* @param sourcePortKey - <zh/> 起点连接桩 key | <en/> Source port key
* @param targetPortKey - <zh/> 终点连接桩 key | <en/> Target port key
* @param rawSourcePoint - <zh/> 起点 | <en/> Source point
* @param rawTargetPoint - <zh/> 终点 | <en/> Target point
* @returns <zh/> 返回绘制环形折线边的路径 | <en/> Returns the path of the loop polyline edge
*/
export function getPolylineLoopPath(

2
packages/g6/src/utils/element.ts
View File

@ -122,7 +122,7 @@ export function getAllPorts(node: Node): Record<string, Port> {
portsStyle.forEach((portStyle: NodePortStyleProps, i: number) => {
const { key, placement } = portStyle;
if (isSimplePort(portStyle)) {
ports[key || i] ||= getXYByPlacement(node.getKey().getBounds(), placement);
ports[key || i] ||= getXYByPlacement(node.getShape('key').getBounds(), placement);
}
});
return ports;