Class: EffectSystem

特效系统

// stage.effectSystem.特效(对象, 特效参数:{参数n:参数值})
// 例如:
stage.effectSystem.flash(node, {times: 5, duration:500}).play();

一个特效源码实现：

   
// 生成一个线条流动的特效动画实例
flow(nodeOrLink: Node | Link, opt: { lineDash?: Array<number>, direction?: 'clockwise'|'anticlockwise' } = {}) {
   let lineDash = opt.lineDash || [3, 2];
   let direction = opt.direction || 'clockwise';

   let dir  = direction == 'clockwise' ? 1 : -1;

   let animationSystem = this.animationSystem;

   nodeOrLink.css({
       lineDash: lineDash
   });

   let animation = animationSystem.anime({
       from: [0],
       to: [300],
       update: (arr) => {
           nodeOrLink.css({
               lineDashOffset: -arr[0] * dir
           });
       },
       times: 20,
       duration: 10000
   });
   return animation;
}

Table of contents

Constructors

• constructor

Properties

• animationSystem
• stage

Methods

• expandScale
• flash
• flow
• linkMark
• rippling
• unexpandScale

Constructors

constructor

new EffectSystem(stage, animationSystem)

Parameters

Name	Type
stage	Stage
animationSystem	AnimationSystem

Properties

animationSystem

animationSystem: AnimationSystem

---

stage

stage: Stage

Methods

expandScale

expandScale(node, opt?): Animation

节点展开, 节点的宽高从指定尺寸（默认从0）逐渐变为当前尺寸

Parameters

Name	Type
node	Node
opt	ExpandScaleOpt

Returns

Animation

---

flash

flash(nodeOrLink, opt?): Animation

生成一个闪烁的特效动画实例

Parameters

Name	Type
nodeOrLink	Node | Link
opt	FlashOpt

Returns

Animation

一个闪动动画

---

flow

flow(nodeOrLink, opt?): Animation

生成一个线条流动的特效动画实例

Parameters

Name	Type
nodeOrLink	Node | Link
opt	FlowOpt

Returns

Animation

---

linkMark

linkMark(link, opt?): Node

在连线的中间位置放置一个文本符号(默认是emoji符号：❌)

可以用来表示：断开、告警、状态等

类似的其他emoji符号：🚫 ❗ ️💢️ ❓ ✅

Parameters

Name	Type
link	Link
opt	Object
opt.color?	string
opt.font?	string
opt.text?	string

Returns

Node

---

rippling

rippling(opt?): AENode

生成一个’涟漪‘（圆形扩散）的特效节点对象

Parameters

Name	Type
opt	RipplingOpt

Returns

AENode

---

unexpandScale

unexpandScale(node, opt?): Animation

节点逐渐收起来的效果

Parameters

Name	Type
node	Node
opt	UnexpandScaleOpt

Returns

Animation