Class: DisplayObject ​

显示对象, Node、Link的父类

Hierarchy ​

• EventTarget

  ↳ DisplayObject

  ↳↳ Node

  ↳↳ Link

Table of contents ​

Constructors ​

• constructor

Properties ​

• _computedStyle
• allwaysSerializers
• children
• classList
• className
• connectable
• data
• deep
• destroyed
• draggable
• dropAllowed
• editable
• frozen
• inLinks
• isLayer
• isLink
• isNode
• isSelected
• mouseEnabled
• name
• origin
• outLinks
• paintSelected
• painted
• parent
• pickType
• selectedStyle
• serializeable
• serializers
• showSelected
• style
• type
• z

Accessors ​

• bottom
• height
• left
• right
• rotation
• scaleX
• scaleY
• skewX
• skewY
• top
• userData
• visible
• width
• x
• y
• zIndex

Methods ​

• addChild
• addChilds
• addClass
• addEventListener
• changeParent
• clearCss
• css
• destory
• dispatchEvent
• draw
• getAABB
• getAllLinks
• getAllNodes
• getChildren
• getComputedStyle
• getK
• getLinks
• getLocalPoint
• getPoint
• getPositionNames
• getRoot
• getSegmentPoints
• getStageTransform
• getStyle
• getTransform
• getUserData
• getWorldTransform
• hasChild
• hasChildren
• hasClass
• hasListener
• hide
• hideAllChild
• isConnected
• isOutOfParent
• isVisible
• on
• pickable
• positionToLocalPoint
• querySelector
• querySelectorAll
• remove
• removeAllChild
• removeAllClass
• removeChild
• removeChilds
• removeClass
• removeEventListener
• removeFromParent
• removeUserData
• screenToLocalVec
• screenToLocalXY
• setStyles
• setUserData
• setZIndex
• setzIndex
• show
• showAllChild
• stageToLocalVec
• stageToLocalXY
• toLayerXY
• toScreenXY
• toStageXY
• toWorldXY
• transformPoint
• translateWith
• updateZIndex
• updatezIndex
• flatten
• getNoChildrensObjects

Constructors ​

constructor ​

new DisplayObject()

Overrides ​

EventTarget.constructor

Properties ​

_computedStyle ​

Readonly _computedStyle: Style

层叠样式计算后的

主题、自定义样式类、css方法设置三者叠加后的最终结果

只读，不要修改

allwaysSerializers ​

allwaysSerializers: string[]

总会被序列化的属性列表

children ​

Readonly children: DisplayObject[]

子节点集合

classList ​

Readonly classList: string[]

通过addClass添加的样式名称列表

className ​

Readonly className: string

connectable ​

connectable: boolean

是否可连线，仅仅编辑模式有意义

data ​

Optional data: any

为了安全考虑，防止与对象属性冲突,用户最好使用该对象 用户附加到该对象的自定义属性

Since

2.4.0

deep ​

deep: number

层级深度, Layer为0，下面第一层子节点为1，依次类推

destroyed ​

destroyed: boolean

draggable ​

draggable: boolean

是否可拖拽

dropAllowed ​

dropAllowed: boolean

是否可以作为拖拽目标

Since

2.4.0

editable ​

editable: boolean

是否可以调整角度、尺寸，仅仅编辑模式有意义

frozen ​

frozen: boolean

是否冻结（所有下级子节点）

冻结后鼠标拾取到子节点或者本节点都视为拾取了本节点

inLinks ​

inLinks: Link[]

所有以本对象为结束点的Link对象数组

isLayer ​

Optional isLayer: boolean

isLink ​

Optional isLink: boolean

是否是Link对象

isNode ​

isNode: boolean

是否是Node对象

isSelected ​

isSelected: boolean

是否被选中了

mouseEnabled ​

mouseEnabled: boolean

是否响应鼠标，为false的时候，不响应鼠标的动作

name ​

Optional name: string

名称，可以在编辑时指定，运行时通过名称获取对象的引用

origin ​

origin: number[]

本地坐标系的原点，采用单位化坐标， 默认为[0,0], 父对象的中心

outLinks ​

outLinks: Link[]

所有以本节点为开始点的Link对象数组

paintSelected ​

Optional paintSelected: Function

painted ​

painted: boolean

是否绘制到了最后一帧：是否在当前最新的画布上

parent ​

Optional parent: DisplayObject

上级对象

pickType ​

pickType: PickType

鼠标拾取方式（节点内容，还是整个节点矩形区域)

selectedStyle ​

Optional selectedStyle: Style

选中时的样式，如果不设置将使用默认的

serializeable ​

serializeable: boolean

是否可序列化，默认true 如果为false，序列化时将跳过该对象

serializers ​

serializers: string[]

序列化属性列表

showSelected ​

showSelected: boolean

是否显示选中的效果，默认显示

style ​

style: Style

样式

type ​

Optional type: string

类型，自定义类型

可用于自定义节点，区分节点类型

比用data属性更方便一点

Since

2.4.0

z ​

z: number

Accessors ​

bottom ​

get bottom(): number

Since

2.4.0

Returns ​

number

set bottom(v): void

Parameters ​

Returns ​

void

height ​

get height(): number

Returns ​

number

set height(v): void

Parameters ​

Returns ​

void

left ​

get left(): number

Since

2.4.0

Returns ​

number

set left(v): void

Parameters ​

Returns ​

void

right ​

get right(): number

Since

2.4.0

Returns ​

number

set right(v): void

Parameters ​

Returns ​

void

rotation ​

get rotation(): any

Returns ​

any

set rotation(v): void

Parameters ​

Returns ​

void

scaleX ​

get scaleX(): number

Returns ​

number

set scaleX(v): void

Parameters ​

Returns ​

void

scaleY ​

get scaleY(): number

Returns ​

number

set scaleY(v): void

Parameters ​

Returns ​

void

skewX ​

get skewX(): number

Returns ​

number

set skewX(v): void

Parameters ​

Returns ​

void

skewY ​

get skewY(): number

Returns ​

number

set skewY(v): void

Parameters ​

Returns ​

void

top ​

get top(): number

Since

2.4.0

Returns ​

number

set top(v): void

Parameters ​

Returns ​

void

userData ​

get userData(): any

Deprecated

已过时，请使用更简短的：data 属性替代

Returns ​

any

set userData(v): void

Deprecated

已过时，请使用更简短的：data 属性替代

Parameters ​

Returns ​

void

visible ​

get visible(): boolean

Returns ​

boolean

set visible(v): void

Parameters ​

Returns ​

void

width ​

get width(): number

Returns ​

number

set width(v): void

Parameters ​

Returns ​

void

x ​

get x(): number

Returns ​

number

set x(v): void

Parameters ​

Returns ​

void

y ​

get y(): number

Returns ​

number

set y(v): void

Parameters ​

Returns ​

void

zIndex ​

get zIndex(): number

Returns ​

number

set zIndex(v): void

Parameters ​

Returns ​

void

Methods ​

addChild ​

addChild(child): DisplayObject

增加子对象

Parameters ​

Returns ​

DisplayObject

addChilds ​

addChilds(childs): void

一次性增加多个对象, 比单个增加速度快多，数量越多越明显！

但是：互为子节点、重复添加的情形需要开发者来确保避免。

Parameters ​

Returns ​

void

addClass ​

addClass(styleName): void

增加一个样式

obj.addClass('.focus');

Parameters ​

Returns ​

void

addEventListener ​

addEventListener(type, callback): void

增加事件监听

Parameters ​

Returns ​

void

Inherited from ​

EventTarget.addEventListener

changeParent ​

Abstract changeParent(newParent): any

修改父对象但保持屏幕坐标不变

Parameters ​

Returns ​

any

clearCss ​

clearCss(): void

清除通过css或setStyles定义的所有样式

Returns ​

void

css ​

css(styleOption, value?): DisplayObject

背景和边框的设置语法参考css样式, 图形绘制的语法使用cavnas属性设置，如下:

node.css({
   border: 'solid 1px gray',
   borderRadius: 5,
   font: 'bold 11px arial',
   color: 'gray',
   textPosition: 'center',
   textAlign: 'center',
   textBaseline: 'middle',
});

Parameters ​

Returns ​

DisplayObject

destory ​

destory(): void

销毁，释放相关的资源引用,一旦销毁，对象不能再被访问，访问就会报错。

注意：销毁后，所有事件回调、动画、定时器等均不能再访问，否则会报错。

Returns ​

void

dispatchEvent ​

dispatchEvent(event): void

分发事件

Parameters ​

Returns ​

void

Inherited from ​

EventTarget.dispatchEvent

draw ​

Abstract draw(ctx): any

绘制具体内容

Parameters ​

Returns ​

any

getAABB ​

getAABB(recursive?): Rectangle

获取对象在Layer中的aabb包围盒

Parameters ​

Returns ​

Rectangle

getAllLinks ​

getAllLinks(): DisplayObject[]

递归式 获取所有连线对象

Returns ​

DisplayObject[]

所有连线对象

getAllNodes ​

getAllNodes(): DisplayObject[]

递归式 获取所有节点对象

Returns ​

DisplayObject[]

所有节点对象

getChildren ​

getChildren(): DisplayObject[]

获取所有子对象

Returns ​

DisplayObject[]

getComputedStyle ​

getComputedStyle(obj): Style

获取指定对象样式层叠计算后的样式(只读，不要修改返回的对象)

Parameters ​

Returns ​

Style

getK ​

getK(segIndex, t): number

Parameters ​

Returns ​

number

getLinks ​

getLinks(): Link[]

获取所有连接到本对象的Link

Returns ​

Link[]

getLocalPoint ​

getLocalPoint(t, segIndex?): PointLike

获取对象边框或者线上某一点(本地坐标系)

Parameters ​

Returns ​

PointLike

getPoint ​

getPoint(t, segIndex?): PointLike

获取对象上某一点

Parameters ​

Returns ​

PointLike

getPositionNames ​

getPositionNames(): string[]

获取本对象上定义的所有位置名称

Returns ​

string[]

getRoot ​

getRoot(): DisplayObject

获取'root'对象, 沿着parent一直向上追溯

Returns ​

DisplayObject

getSegmentPoints ​

Abstract getSegmentPoints(): PointLike[]

Returns ​

PointLike[]

getStageTransform ​

getStageTransform(): any

Returns ​

any

getStyle ​

getStyle(name): any

读取某个样式的值

Parameters ​

Returns ​

any

getTransform ​

getTransform(): Transform

Returns ​

Transform

getUserData ​

getUserData(): any

读取用户自定义的数据

Returns ​

any

getWorldTransform ​

getWorldTransform(): any

Returns ​

any

hasChild ​

hasChild(child): boolean

是否拥有子对象

Parameters ​

Returns ​

boolean

hasChildren ​

hasChildren(): boolean

Returns ​

boolean

hasClass ​

hasClass(styleName): boolean

检测是否拥有某个样式类

node.hasClass('.focus');

Since

2.4.0

Parameters ​

Returns ​

boolean

hasListener ​

hasListener(type): boolean

是否有该类型的监听

Parameters ​

Returns ​

boolean

Inherited from ​

EventTarget.hasListener

hide ​

hide(): DisplayObject

隐藏

Returns ​

DisplayObject

hideAllChild ​

hideAllChild(): void

隐藏所有下级节点

// 实现:
this.children.forEach(function (c) {
c.hide();
});

Returns ​

void

isConnected ​

isConnected(): boolean

是否被任意Link连接到

Since

2.4.0

Returns ​

boolean

isOutOfParent ​

isOutOfParent(): boolean

是否超出了父节点的矩形区域

Returns ​

boolean

isVisible ​

isVisible(): boolean

判断是否可见

Returns ​

boolean

on ​

on(type, callback): void

增加监听事件, 功能完全等同于addEventListener，一种简写

Parameters ​

Returns ​

void

Inherited from ​

EventTarget.on

pickable ​

pickable(): boolean

是否可被拾取到，默认返回：mouseEnabled 属性

pickable() {
   return this.mouseEnabled;
}

Returns ​

boolean

positionToLocalPoint ​

Abstract positionToLocalPoint(name, x?, y?): PointLike

得到对象内部位置坐标（参照左上角为-this.widht/2，-this.height/2, 0, 0 为中心）

Parameters ​

Returns ​

PointLike

querySelector ​

querySelector(querySelector): DisplayObject

功能类似querySelectorAll,但只返回第一个满足条件的对象或者null

Parameters ​

Returns ​

DisplayObject

querySelectorAll ​

querySelectorAll(querySelector?): DisplayObject[]

对象选择器

语法兼容DOM的Selector API标准（并不支持标准里的所有语法）

支持的语法形式如下：

//obj.querySelector(类名称)， 例如:
let circleNodes = layer.querySelectorAll('CircleNode');
let links = layer.querySelector('Link');

//obj.querySelector(样式名称)，例如:
let serverNodes = layer.querySelectorAll('.server');
let activedObjs = layer.querySelectorAll('.active');

let arr = layer.querySelectorAll((e)=>e.x > 20 && e.y < 100);

//obj.querySelector(ID);
let obj = layer.querySelectorAll('#123')[0];

//obj.querySelector([属性名称=""]);
let arr = layer.querySelectorAll('[text="abc"]');
let arr2 = layer.querySelectorAll('[draggable=true]');

// obj.querySelector(类名称|样式名称[属性名称=""]);
let obj = layer.querySelector('TextNode[x<=-200]');
let obj2 = layer.querySelector('.server[text="X86"]');

Parameters ​

Returns ​

DisplayObject[]

remove ​

remove(): DisplayObject

removeFromParent的简写。

推荐使用语义更明确的：removeFromParent()来替代。

Returns ​

DisplayObject

removeAllChild ​

removeAllChild(): DisplayObject

移除所有子对象

Returns ​

DisplayObject

removeAllClass ​

removeAllClass(): void

移除所有通过addClass添加的样式

obj.removeAllClass();

Returns ​

void

removeChild ​

removeChild(child): DisplayObject

移除一个子对象

Parameters ​

Returns ​

DisplayObject

removeChilds ​

removeChilds(childs): DisplayObject

移除多个子对象

Parameters ​

Returns ​

DisplayObject

removeClass ​

removeClass(styleName): void

移除一个样式

obj.removeClass('.focus');

Parameters ​

Returns ​

void

removeEventListener ​

removeEventListener(type, callback): any

移除一个事件监听

Parameters ​

Returns ​

any

Inherited from ​

EventTarget.removeEventListener

removeFromParent ​

removeFromParent(): DisplayObject

从父容器中移除

Returns ​

DisplayObject

removeUserData ​

removeUserData(): DisplayObject

移除用户自定义的数据

Deprecated

已过时，直接设置 data 为空对象或者null 即可

Returns ​

DisplayObject

screenToLocalVec ​

screenToLocalVec(vec): Vec2

将一个屏幕坐标系下的向量转换到本地坐标系 @@since 2.5.0

Parameters ​

Returns ​

Vec2

screenToLocalXY ​

screenToLocalXY(x, y): any

将一个屏幕坐标转换到本地坐标系

Parameters ​

Returns ​

any

setStyles ​

setStyles(styleOpt, value?): DisplayObject

完全等价于css 方法

Parameters ​

Returns ​

DisplayObject

setUserData ​

setUserData(data): DisplayObject

设置用户自定义数据

直接在节点对象上增加属性不是稳妥的方法，若要向节点增加额外的属性，应该调用此方法

Deprecated

已过时，直接访问 data 即可

Parameters ​

Returns ​

DisplayObject

setZIndex ​

setZIndex(index): void

设置zIndex

Parameters ​

Returns ​

void

setzIndex ​

setzIndex(index): void

请使用 setZIndex(Z大写)

Deprecated

Parameters ​

Returns ​

void

show ​

show(): DisplayObject

显示

Returns ​

DisplayObject

showAllChild ​

showAllChild(): void

显示所有下级节点，

// 实现:
this.children.forEach(function (c) {
    c.show();
});

Returns ​

void

stageToLocalVec ​

stageToLocalVec(vec): Vec2

Deprecated

v2.5.0 后使用 screenToLocalVec 替代

Parameters ​

Returns ​

Vec2

stageToLocalXY ​

stageToLocalXY(x, y): any

Deprecated

v2.5.0 后使用 screenToLocalXY 替代

Parameters ​

Returns ​

any

toLayerXY ​

toLayerXY(x, y): PointLike

Deprecated

v2.5.0 后使用 toWorldXY 替代

Parameters ​

Returns ​

PointLike

toScreenXY ​

toScreenXY(x, y): any

将一个本地坐标转到屏幕(实际是canvas)坐标系

cavnas的左上角为0,0

Since

2.5.0

Parameters ​

Returns ​

any

toStageXY ​

toStageXY(x, y): any

Deprecated

v2.5.0 后使用 toSreenXY 替代

Parameters ​

Returns ​

any

toWorldXY ​

toWorldXY(x, y): PointLike

将一个本地坐标转到世界坐标系

Since

2.5.0

Parameters ​

Returns ​

PointLike

transformPoint ​

transformPoint(p): Object

Parameters ​

Returns ​

Object

translateWith ​

Abstract translateWith(dx, dy): any

Parameters ​

Returns ​

any

updateZIndex ​

updateZIndex(): void

Returns ​

void

updatezIndex ​

updatezIndex(): void

请使用 upateZIndex(Z大写)

Deprecated

Returns ​

void

flatten ​

Static flatten(arr, cond?, breadthFirst?): DisplayObject[]

Parameters ​

Returns ​

DisplayObject[]

getNoChildrensObjects ​

Static getNoChildrensObjects(arr): DisplayObject[]

Parameters ​

Returns ​

DisplayObject[]