import type { DisplayObjectConfig } from '@antv/g';
import type { PathArray } from '@antv/util';
import type { Point } from '../../types';
import { getCubicPath, getCurveControlPoint, parseCurveOffset, parseCurvePosition } from '../../utils/edge';
import { mergeOptions } from '../../utils/style';
import type { BaseEdgeStyleProps } from './base-edge';
import { BaseEdge } from './base-edge';
/**
* 三次贝塞尔曲线样式配置项
*
* Cubic Bezier curve style properties
*/
export interface CubicStyleProps extends BaseEdgeStyleProps {
/**
* 控制点数组,用于定义曲线的形状。如果不指定,将会通过 `curveOffset` 和 `curvePosition` 来计算控制点
*
* Control points. Used to define the shape of the curve. If not specified, it will be calculated using `curveOffset` and `curvePosition`.
*/
controlPoints?: [Point, Point];
/**
* 控制点在两端点连线上的相对位置,范围为`0-1`
*
* The relative position of the control point on the line, ranging from `0-1`
* @defaultValue 0.5
*/
curvePosition?: number | [number, number];
/**
* 控制点距离两端点连线的距离,可理解为控制边的弯曲程度
*
* The distance of the control point from the line
* @defaultValue 20
*/
curveOffset?: number | [number, number];
}
type ParsedCubicStyleProps = Required;
/**
* 三次贝塞尔曲线
*
* Cubic Bezier curve
*/
export class Cubic extends BaseEdge {
static defaultStyleProps: Partial = {
curvePosition: 0.5,
curveOffset: 20,
};
constructor(options: DisplayObjectConfig) {
super(mergeOptions({ style: Cubic.defaultStyleProps }, options));
}
/**
* @inheritdoc
*/
protected getKeyPath(attributes: ParsedCubicStyleProps): PathArray {
const [sourcePoint, targetPoint] = this.getEndpoints(attributes);
const { controlPoints, curvePosition, curveOffset } = attributes;
const actualControlPoints = this.getControlPoints(
sourcePoint,
targetPoint,
parseCurvePosition(curvePosition),
parseCurveOffset(curveOffset),
controlPoints,
);
return getCubicPath(sourcePoint, targetPoint, actualControlPoints);
}
protected getControlPoints(
sourcePoint: Point,
targetPoint: Point,
curvePosition: [number, number],
curveOffset: [number, number],
controlPoints?: [Point, Point],
): [Point, Point] {
return controlPoints?.length === 2
? controlPoints
: [
getCurveControlPoint(sourcePoint, targetPoint, curvePosition[0], curveOffset[0]),
getCurveControlPoint(sourcePoint, targetPoint, curvePosition[1], curveOffset[1]),
];
}
}