# 扩展

你可以通过扩展Graph基类来自定义新图形。建议查看基础图形中的具体实现以供参考。在子类实现中,你可能需要实现下列几项属性或方法:

# constructor

在子类中的构造函数中建议使用 Graph 的静态方法mergeDefaultShape来提供默认 shape 形状数据及 shape 数据合法性检查。

/**
 * @description 提供默认shape数据 shape数据合法性检查
 * @param {Shape} shape 预先定义的图形shape形状类型
 * @param {GraphConfig<Partial<Shape>>} config 实例化图形的配置
 * @param {Checker} checker shape合法性检查函数
 */
type Checker = (config: GraphConfig<Shape>) => void

static mergeDefaultShape<Shape>(
  defaultShape: Shape,
  config: GraphConfig<Partial<Shape>>,
  checker?: Checker
): GraphConfig<Shape>

# name

name: string

图形的名称。每个图形都应该有一个唯一的名称,便于调试。

# draw

draw: () => void

图形的绘制方法。根据你预设的shape图形形状数据绘制图形的方法。不实现此方法,图形无法被渲染。

# hoverCheck

hoverCheck?: (point: Point) => boolean

图形的悬浮检测方法。根据你预设的shape图形形状数据及鼠标坐标判断鼠标是否悬浮于图形上。不实现此方法将无法判断图形是否处于悬浮状态,onMouseEnter、onMouseOuter、onClick 事件将无法激活,图形也无法被拖拽。

# setGraphCenter

setGraphCenter?: (e?: MouseEvent) => void

图形中心点设置方法。该方法用于设置 style 的graphCenter属性,图形的 rotate、translate、scale 属性都依赖graphCenter。不实现此方法,图形的旋转位移缩放配置将失效。添加图形后,CRender 实例会调用一次该方法用于初始化(此时不会传递任何参数),move 事件触发后也会被 CRender 实例调用(此时将会传递鼠标事件参数)。

# move

move?: (e: MouseEvent) => void

图形的移动方法。CRender 实例检测到拖拽行为的时候,将调用该方法移动图形。不实现此方法,将无法拖拽图形。