element.d.ts 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181
  1. import { IElement, IShape, IGroup, ICanvas, ICtor } from '../interfaces';
  2. import { ClipCfg, ChangeType, ShapeAttrs, BBox, ShapeBase } from '../types';
  3. import Base from './base';
  4. import GraphEvent from '../event/graph-event';
  5. declare abstract class Element extends Base implements IElement {
  6. /**
  7. * @protected
  8. * 图形属性
  9. * @type {ShapeAttrs}
  10. */
  11. attrs: ShapeAttrs;
  12. constructor(cfg: any);
  13. getDefaultCfg(): {
  14. visible: boolean;
  15. capture: boolean;
  16. zIndex: number;
  17. };
  18. /**
  19. * @protected
  20. * 获取默认的属相
  21. */
  22. getDefaultAttrs(): {
  23. matrix: any;
  24. opacity: number;
  25. };
  26. abstract getShapeBase(): ShapeBase;
  27. abstract getGroupBase(): ICtor<IGroup>;
  28. /**
  29. * @protected
  30. * 一些方法调用会引起画布变化
  31. * @param {ChangeType} changeType 改变的类型
  32. */
  33. onCanvasChange(changeType: ChangeType): void;
  34. /**
  35. * @protected
  36. * 初始化属性,有些属性需要加工
  37. * @param {object} attrs 属性值
  38. */
  39. initAttrs(attrs: ShapeAttrs): void;
  40. /**
  41. * @protected
  42. * 初始化动画
  43. */
  44. initAnimate(): void;
  45. isGroup(): boolean;
  46. getParent(): IGroup;
  47. getCanvas(): ICanvas;
  48. attr(...args: any[]): any;
  49. abstract getBBox(): BBox;
  50. abstract getCanvasBBox(): BBox;
  51. isClipped(refX: any, refY: any): boolean;
  52. /**
  53. * 内部设置属性值的接口
  54. * @param {string} name 属性名
  55. * @param {any} value 属性值
  56. */
  57. setAttr(name: string, value: any): void;
  58. /**
  59. * @protected
  60. * 属性值发生改变
  61. * @param {string} name 属性名
  62. * @param {any} value 属性值
  63. * @param {any} originValue 属性值
  64. */
  65. onAttrChange(name: string, value: any, originValue: any): void;
  66. /**
  67. * 属性更改后需要做的事情
  68. * @protected
  69. */
  70. afterAttrsChange(targetAttrs: any): void;
  71. show(): this;
  72. hide(): this;
  73. setZIndex(zIndex: number): this;
  74. toFront(): void;
  75. toBack(): void;
  76. remove(destroy?: boolean): void;
  77. resetMatrix(): void;
  78. getMatrix(): number[];
  79. setMatrix(m: number[]): void;
  80. getTotalMatrix(): any;
  81. applyMatrix(matrix: number[]): void;
  82. /**
  83. * @protected
  84. * 获取默认的矩阵
  85. * @returns {number[]|null} 默认的矩阵
  86. */
  87. getDefaultMatrix(): any;
  88. applyToMatrix(v: number[]): number[];
  89. invertFromMatrix(v: number[]): number[];
  90. setClip(clipCfg: ClipCfg): any;
  91. getClip(): IShape;
  92. clone(): any;
  93. destroy(): void;
  94. /**
  95. * 是否处于动画暂停状态
  96. * @return {boolean} 是否处于动画暂停状态
  97. */
  98. isAnimatePaused(): any;
  99. /**
  100. * 执行动画,支持多种函数签名
  101. * 1. animate(toAttrs: ElementAttrs, duration: number, easing?: string, callback?: () => void, delay?: number)
  102. * 2. animate(onFrame: OnFrame, duration: number, easing?: string, callback?: () => void, delay?: number)
  103. * 3. animate(toAttrs: ElementAttrs, cfg: AnimateCfg)
  104. * 4. animate(onFrame: OnFrame, cfg: AnimateCfg)
  105. * 各个参数的含义为:
  106. * toAttrs 动画最终状态
  107. * onFrame 自定义帧动画函数
  108. * duration 动画执行时间
  109. * easing 动画缓动效果
  110. * callback 动画执行后的回调
  111. * delay 动画延迟时间
  112. */
  113. animate(...args: any[]): void;
  114. /**
  115. * 停止动画
  116. * @param {boolean} toEnd 是否到动画的最终状态
  117. */
  118. stopAnimate(toEnd?: boolean): void;
  119. /**
  120. * 暂停动画
  121. */
  122. pauseAnimate(): this;
  123. /**
  124. * 恢复动画
  125. */
  126. resumeAnimate(): this;
  127. /**
  128. * 触发委托事件
  129. * @param {string} type 事件类型
  130. * @param {GraphEvent} eventObj 事件对象
  131. */
  132. emitDelegation(type: string, eventObj: GraphEvent): void;
  133. private emitDelegateEvent;
  134. /**
  135. * 移动元素
  136. * @param {number} translateX 水平移动距离
  137. * @param {number} translateY 垂直移动距离
  138. * @return {IElement} 元素
  139. */
  140. translate(translateX?: number, translateY?: number): this;
  141. /**
  142. * 移动元素到目标位置
  143. * @param {number} targetX 目标位置的水平坐标
  144. * @param {number} targetX 目标位置的垂直坐标
  145. * @return {IElement} 元素
  146. */
  147. move(targetX: number, targetY: number): this;
  148. /**
  149. * 移动元素到目标位置,等价于 move 方法。由于 moveTo 的语义性更强,因此在文档中推荐使用 moveTo 方法
  150. * @param {number} targetX 目标位置的 x 轴坐标
  151. * @param {number} targetY 目标位置的 y 轴坐标
  152. * @return {IElement} 元素
  153. */
  154. moveTo(targetX: number, targetY: number): this;
  155. /**
  156. * 缩放元素
  157. * @param {number} ratioX 水平缩放比例
  158. * @param {number} ratioY 垂直缩放比例
  159. * @return {IElement} 元素
  160. */
  161. scale(ratioX: number, ratioY?: number): this;
  162. /**
  163. * 以画布左上角 (0, 0) 为中心旋转元素
  164. * @param {number} radian 旋转角度(弧度值)
  165. * @return {IElement} 元素
  166. */
  167. rotate(radian: number): this;
  168. /**
  169. * 以起始点为中心旋转元素
  170. * @param {number} radian 旋转角度(弧度值)
  171. * @return {IElement} 元素
  172. */
  173. rotateAtStart(rotate: number): IElement;
  174. /**
  175. * 以任意点 (x, y) 为中心旋转元素
  176. * @param {number} radian 旋转角度(弧度值)
  177. * @return {IElement} 元素
  178. */
  179. rotateAtPoint(x: number, y: number, rotate: number): IElement;
  180. }
  181. export default Element;