HT for Web

Class: Grid

ht. Grid

new Grid()

网格类型，可嵌套包含附属节点，以网格方式定位附属节点，一般用于呈现设备面板

Extends

Methods

a(name, value) → {Object}

获取或设置attr属性，仅有一个参数时相当于getAttr，有两个参数时相当于setAttr

Parameters:
Name Type Argument Description
name String

属性名
value Object <optional>

属性值
Inherited From:
Returns:
Type
Object

addChild(child, index)

添加孩子节点，index为孩子插入索引，为空则插入作为最后的孩子，内部会自动调用child的setParent

Parameters:
Name Type Argument Description
child ht.Data

孩子元素
index Number <optional>

插入索引
Inherited From:

addStyleIcon(name, icon)

增加icon，icon参数请参考beginner guide

Parameters:
Name Type Description
name String

icon名
icon Object

icon参数
Inherited From:
Example
data.addStyleIcon("arrow1", {
   position: 2,
   width: 50,
   height: 25,
   keepOrien: true,
   names: ['arrow']
});

clearChildren()

删除所有孩子节点，内部会自动调用setParent

Inherited From:

dm() → {ht.DataModel}

获取DataModel，getDataModel的缩写

Inherited From:
Returns:

dataModel

Type
ht.DataModel

eachChild(func, scope)

遍历孩子元素

Parameters:
Name Type Argument Description
func function

遍历函数
scope Object <optional>

函数域
Inherited From:
Example
 data.eachChild(function(child) {
   console.log(child.getId());
});

firePropertyChange(property, oldValue, newValue)

派发属性变化事件

Parameters:
Name Type Description
property String

属性名
oldValue Object

旧值
newValue Object

新值
Inherited From:

fp(property, oldValue, newValue)

派发属性变化事件，同firePropertyChange

Parameters:
Name Type Description
property String

属性名
oldValue Object

旧值
newValue Object

新值
Inherited From:

getAgentEdges() → {ht.List}

获取当前图元代理的连线集合

Inherited From:
Returns:
Type
ht.List

getAttaches() → {ht.List}

获取吸附到自身的所有图元

Inherited From:
Returns:
Type
ht.List

getAttr(name) → {Object}

获取attr属性

Parameters:
Name Type Description
name String

属性名
Inherited From:
Returns:
Type
Object

getAttrObject() → {Object}

获取attr属性对象，该属性默认为空，用于存储用户业务信息

Inherited From:
Returns:

attr属性对象

Type
Object

getCellRect(rowIndex, columnIndex)

获取单元格的矩形范围

Parameters:
Name Type Description
rowIndex Number

行索引
columnIndex Number

列索引

getChildAt(index) → {ht.Data}

返回指定索引位置的孩子

Parameters:
Name Type Description
index Number

索引
Inherited From:
Returns:

索引对应的孩子

Type
ht.Data

getChildren() → {ht.List}

获取所有孩子节点

Inherited From:
Returns:

孩子元素集合

Type
ht.List

getClass() → {function}

获取类声明(构造函数)

Inherited From:
Returns:

类声明(构造函数)

Type
function

getClassName() → {String}

获取类全名，继承Data并希望序列化时应该重写此方法返回子类的类名字符串

Inherited From:
See:
Returns:

类全名

Type
String

getCorners(xPadding, yPadding) → {Array}

获取图元四个角的实时坐标(包括旋转后的坐标)

Parameters:
Name Type Description
xPadding Number

水平方向padding
yPadding Number

垂直方向padding
Inherited From:
Returns:

四个角坐标，顺序为左上，右上，右下，左下

Type
Array
Example
 //返回值示例：
[
{x: 0, y: 0},//左上
{x: 100, y: 0},//右上
{x: 100, y: 100},//右下
{x: 0, y: 100}//左下
]

getDataModel() → {ht.DataModel}

获取所属的DataModel

Inherited From:
Returns:

DataModel数据容器

Type
ht.DataModel

getDisplayName() → {String}

获取显示名称，常作为Column和Property的列头和属性名称显示

Inherited From:
Returns:

显示名称

Type
String

getEdges() → {ht.List}

获取所有跟图元关联的连线(不包括代理的连线)

Inherited From:
Returns:
Type
ht.List

getElevation() → {Number}

获取图元中心在3D坐标系中的y坐标

Inherited From:
Returns:
Type
Number

getHeight() → {Number}

获取图元在2D拓扑中的高度，或3D拓扑中的z轴长度

Inherited From:
Returns:
Type
Number

getHost() → {ht.Data}

获取宿主图元，当图元吸附上宿主图元时，宿主移动或旋转时会带动所有吸附者

Inherited From:
Returns:
Type
ht.Data

getIcon() → {String|Object}

获取小图标名称，常作为TreeView和ListView等组件上的节点小图标

Inherited From:
Returns:

图标名或矢量

Type
String | Object

getId() → {Number}

获取唯一编号

Inherited From:
Returns:

唯一编号

Type
Number

getImage() → {ht.Data}

获取拓扑上展现的图片信息，在GraphView拓扑图中图片一般以position为中心绘制

Inherited From:
Returns:
Type
ht.Data

getLayer() → {String|Number}

获取数据元素在GraphView组件中的图层位置

Inherited From:
Default Value:
  • 0
Returns:

图层名

Type
String | Number

getLoopedEdges() → {ht.List}

获取所有跟节点关联的自环连线

Inherited From:
Returns:
Type
ht.List

getName() → {String}

获取数据元素名

Inherited From:
Returns:

名称

Type
String

getParent() → {ht.Data}

获取父元素

Inherited From:
Returns:

父元素

Type
ht.Data

getPosition() → {Object}

获取图元中心点坐标

Inherited From:
Returns:
Type
Object
Example
 //返回值示例：
{
	x: 0,
	y: 0
}

getPosition3d() → {Array}

获取图元中心点在3D拓扑中的三维坐标

Inherited From:
Returns:

三维坐标数组，格式为[x, y, z]

Type
Array

getRect() → {Object}

获取图元的矩形区域(包括旋转)

Inherited From:
Returns:

矩形区域

Type
Object
Example
 //返回值示例：
{x: 0, y: 0, width: 100, height: 100}

getRotation() → {Number}

获取图元的旋转角度，围绕中心点顺时针旋转

Inherited From:
Returns:

旋转角度(弧度制)

Type
Number

getRotation3d() → {Array}

获取图元在3D拓扑中的三维旋转角度

Inherited From:
Returns:

三维旋转角度(弧度制)，格式为[x, y, z]，即[getRotationX(), -getRotation(), getRotationZ()]

Type
Array

getRotationMode() → {String}

返回三维旋转模式
图元在3D拓扑中旋转时，先沿x轴旋转，再沿y轴旋转和先沿y轴旋转，再沿x轴旋转最后的结果是不一样的

Inherited From:
See:
Returns:

三维旋转模式，xyz|xzy|yxz|yzx|zxy|zyx

Type
String

getRotationX() → {Number}

获取图元在3d拓扑中沿x轴的旋转角度(弧度制)

Inherited From:
Returns:
Type
Number

getRotationY() → {Number}

获取图元在3d拓扑中沿y轴的旋转角度(弧度制)

Inherited From:
Returns:
Type
Number

getRotationZ() → {Number}

获取图元在3d拓扑中沿z轴的旋转角度(弧度制)

Inherited From:
Returns:
Type
Number

getSerializableAttrs() → {Object}

此函数返回一个map，决定序列化时哪些attr属性可被序列化，默认所有attr对象里的属性都会被序列化

Inherited From:
Returns:

需要被序列化的attr属性map

Type
Object
Example
 function(){
    var name, map = {};
    for (name in this._attrObject) {            
        map[name] = 1;
    }
    return map; 
}

getSerializableProperties() → {Object}

此函数返回一个map，决定序列化时哪些属性可被序列化，如果有自定义的get/set属性并且需要序列化，应该重写此方法

Inherited From:
Returns:

需要被序列化的属性map

Type
Object
Example
 function(){
    return {
        name: 1,
        displayName: 1, 
        icon: 1, 
        toolTip: 1, 
        parent: 1,
        layer: 1,
        tag: 1,
        adjustChildrenToTop: 1            
    };
}

getSerializableStyles() → {Object}

此函数返回一个map，决定序列化时哪些样式可被序列化，默认所有样式都会被序列化

Inherited From:
Returns:

需要被序列化的样式map

Type
Object
Example
 function(){            
    var name, map = {};
    for (name in this._styleMap) {            
        map[name] = 1;
    }
    return map; 
}

getSize() → {Object}

获取图元在2D拓扑中的尺寸(宽高)

Inherited From:
Returns:
Type
Object
Example
 //返回值示例：
{
	with: 100,
	height: 100
}

getSize3d() → {Array}

获取图元在3D拓扑中的尺寸(长宽高)

Inherited From:
Returns:

格式为[x, y, z]，即[getWidth(), getTall(), getHeight()]

Type
Array

getSourceAgentEdges() → {ht.List}

获取代理的起始于该图元的连线

Inherited From:
Returns:
Type
ht.List

getSourceEdges() → {ht.List}

获取跟图元关联的并起始于该图元的连线(不包括代理的连线)

Inherited From:
Returns:
Type
ht.List

getStyle(name) → {Object}

获取样式属性

Parameters:
Name Type Description
name String

样式名
Inherited From:
Returns:
Type
Object

getStyleMap() → {Object}

获取图元内部样式映射信息

Inherited From:
Returns:

样式映射表

Type
Object

getSuperClass() → {function}

获取父类声明(构造函数)，继承类时可以用来调用父类构造或函数

Inherited From:
Returns:

父类声明(构造函数)

Type
function
Example
 function MyNode() {
     this.getSuperClass().call(this);//调用父类构造函数
}
ht.Default.def(MyNode, ht.Data, {
   setName: function(name) {
   	this.getSuperClass().prototype.setName.call(this, name);//调用父类的setName函数 
   	this._username = name;
   }
});

getTag() → {String}

获取标示号，可通过getDataByTag快速查找

Inherited From:
Returns:

标示号

Type
String

getTall() → {Number}

获取图元在3D拓扑中的y轴长度

Inherited From:
Returns:
Type
Number

getTargetAgentEdges() → {ht.List}

获取图元代理的结束于该图元的连线

Inherited From:
Returns:
Type
ht.List

getTargetEdges() → {ht.List}

获取跟图元关联的并结束于该图元的连线(不包括代理的连线)

Inherited From:
Returns:
Type
ht.List

getToolTip() → {String}

获取文字提示信息

Inherited From:
Returns:

文字提示

Type
String

getUIClass() → {function}

获取拓扑组件上的UI类

Inherited From:
Returns:

UI类声明(构造函数)

Type
function

getWidth() → {Number}

获取图元在2D拓扑中的宽度，或在3D拓扑中x轴的长度

Inherited From:
Returns:
Type
Number

handleHostPropertyChange(event)

当吸附宿主对象属性发生变化时回调该函数，可重载做后续处理

Parameters:
Name Type Description
event Event

事件对象
Inherited From:

hasAgentEdges() → {Boolean}

判断当前图元上是否有代理连线

Inherited From:
Returns:
Type
Boolean

hasChildren() → {Boolean}

判断是否有孩子

Inherited From:
Returns:

是否有孩子

Type
Boolean

invalidate()

强制触发属性变化事件通知界面更新

Inherited From:

isAdjustChildrenToTop() → {Boolean}

GraphView点击图元会自动sendToTop，该属性决定是否对子图元也进行sendToTop操作

Inherited From:
Returns:

是否将children自动sendToTop

Type
Boolean

isDescendantOf(data) → {Boolean}

判断自身是否为指定data的子孙

Parameters:
Name Type Description
data ht.Data

要对比的数据元素
Inherited From:
Returns:

自身是否为指定data的子孙

Type
Boolean

isEmpty() → {Boolean}

判断是否有孩子，同hasChildren

Inherited From:
Returns:

是否有孩子

Type
Boolean

isHostOn(node) → {Boolean}

判断当前图元是否吸附到指定图元对象上

Parameters:
Name Type Description
node ht.Node

指定的图元
Inherited From:
Returns:
Type
Boolean

isParentOf(data) → {Boolean}

判断自身是否为指定data的父亲

Parameters:
Name Type Description
data ht.Data

要对比的数据元素
Inherited From:
Returns:

自身是否为指定data的父亲

Type
Boolean

isRelatedTo(data) → {Boolean}

判断自身与指定data是否有父子或子孙关系

Parameters:
Name Type Description
data ht.Data

要对比的数据元素
Inherited From:
Returns:

自身与指定data是否有父子或子孙关系

Type
Boolean

iv()

强制触发属性变化事件通知界面更新，invalidate的缩写

Inherited From:

onChildAdded(child, index)

添加孩子时的回调函数，可重载做后续处理

Parameters:
Name Type Description
child ht.Data

新增加的孩子元素
index Number

索引
Inherited From:

onChildRemoved(child, index)

删除孩子时的回调函数，可重载做后续处理

Parameters:
Name Type Description
child ht.Data

被删除的孩子元素
index Number

索引
Inherited From:

onHostChanged(oldHost, newHost)

当吸附的宿主对象发生变化时回调该函数，可重载做后续处理

Parameters:
Name Type Description
oldHost ht.Node

旧的宿主
newHost ht.Node

新的宿主
Inherited From:

onParentChanged(oldParent, parent)

改变父亲元素时的回调函数，可重载做后续处理

Parameters:
Name Type Description
oldParent ht.Data

旧的父元素
parent ht.Data

新的父元素
Inherited From:

onPropertyChanged(event)

属性变化回调函数，可重载做后续处理

Parameters:
Name Type Description
event Object

属性变化事件
Inherited From:
Example
 //event格式：
{
	property: 'name',//发生变化的属性
	oldValue: 'oldValue',//旧值
	newValue: 'newValue',''新值
	data: data//发生变化的data
}

onStyleChanged(name, oldValue, newValue)

样式属性变化时会回调该函数，可重载做后续处理

Parameters:
Name Type Description
name String

样式名
oldValue Object

旧的样式值
newValue Object

新的样式值
Inherited From:

p(x, y) → {Object}

获取或设置设置图元中心点坐标，有两个参数时相当于setPosition，没有参数时相当于getPosition

Parameters:
Name Type Argument Description
x Number <optional>

x坐标
y Number <optional>

y坐标
Inherited From:
See:
Returns:

坐标值，格式为:{x: x, y: y}

Type
Object

p3(x, y, z) → {Array}

获取或设置图元中心点在3D拓扑中的三维坐标，有三个参数时相当于setPosition3d，没有参数时相当于getPosition3d

Parameters:
Name Type Argument Description
x Number <optional>

x坐标
y Number <optional>

y坐标
z Number <optional>

z坐标
Inherited From:
See:
Returns:

三维坐标数组，格式为[x, y, z]

Type
Array

r3(rotationX, rotationY, rotationZ) → {Array}

获取或设置图元在3D拓扑中的三维旋转角度，有三个参数时相当于setRotation3d，没有参数时相当于getRotation3d

Parameters:
Name Type Argument Description
rotationX Number <optional>

沿x轴的旋转角度(弧度制)
rotationY Number <optional>

沿y轴的旋转角度(弧度制)
rotationZ Number <optional>

沿z轴的旋转角度(弧度制)
Inherited From:
See:
Returns:

三维旋转角度(弧度制)，格式为[x, y, z]，即[getRotationX(), -getRotation(), getRotationZ()]

Type
Array

removeChild(child)

删除指定孩子元素，内部会自动调用孩子元素的setParent

Parameters:
Name Type Description
child ht.Data

要删除的孩子元素
Inherited From:

removeStyleIcon(name)

删除icon

Parameters:
Name Type Description
name String

要删除的icon名
Inherited From:

rotateAt(x, y, angle)

以指定的坐标为中心旋转图元

Parameters:
Name Type Description
x Number

指定x坐标
y Number

指定y坐标
angle Number

旋转角度(弧度制)
Inherited From:

s(name, value) → {Object}

获取或设置样式，仅有一个参数时相当于getStyle，有两个参数时相当于setStyle

Parameters:
Name Type Argument Description
name String

样式名
value Object <optional>

样式值
Inherited From:
Returns:
Type
Object

s3(width, tall, height) → {Array}

获取或设置图元在3D拓扑中的尺寸，有三个参数时相当于setSize3d，没有参数时相当于getSize3d

Parameters:
Name Type Description
width Number

x轴方向的长度
tall Number

y轴方向的长度
height Number

z轴方向的长度
Inherited From:
See:
Returns:

格式为[x, y, z]，即[getWidth(), getTall(), getHeight()]

Type
Array

setAdjustChildrenToTop(adjustToTop)

GraphView点击图元会自动sendToTop，该属性决定是否对子图元也进行sendToTop操作

Parameters:
Name Type Description
adjustToTop Boolean

是否将children自动sendToTop
Inherited From:

setAttr(name, value)

设置attr属性

Parameters:
Name Type Description
name String

属性名
value Object

属性值
Inherited From:

setAttrObject(attrObject)

设置attr属性对象，该属性默认为空，用于存储用户业务信息

Parameters:
Name Type Description
attrObject Object

attr属性对象
Inherited From:

setDisplayName(displayName)

设置显示名称，常作为Column和Property的列头和属性名称显示

Parameters:
Name Type Description
displayName String

显示名称
Inherited From:

setElevation(elevation)

设置图元中心在3D坐标系中的y坐标

Parameters:
Name Type Description
elevation Number

y轴方向的坐标值
Inherited From:

setHeight(height)

设置图元在2D拓扑中的高度，或3D拓扑中的z轴长度

Parameters:
Name Type Description
height Number

2D拓扑中的高度，或3D拓扑中的z轴长度
Inherited From:

setHost(data)

设置宿主图元，当图元吸附上宿主图元时，宿主移动或旋转时会带动所有吸附者

Parameters:
Name Type Description
data ht.Data

宿主图元
Inherited From:

setIcon(icon)

设置小图标名称，常作为TreeView和ListView等组件上的节点小图标

Parameters:
Name Type Description
icon String | Object

图标名或矢量
Inherited From:

setId(id)

设置唯一编号，如果手工设置，一定要确保在data加入到DataModel之前设置并且唯一不重复

Parameters:
Name Type Description
id String | Number

唯一编号
Inherited From:

setImage(image)

设置拓扑上展现的图片信息，在GraphView拓扑图中图片一般以position为中心绘制

Parameters:
Name Type Description
image String | Object

注册的图片名或url或矢量对象
Inherited From:

setLayer(layer)

设置数据元素在GraphView组件中的图层位置

Parameters:
Name Type Description
layer String | Number

图层名
Inherited From:

setName(name)

设置数据元素名称

Parameters:
Name Type Description
name String

数据元素名称
Inherited From:

setParent(parent)

设置父元素

Parameters:
Name Type Description
parent ht.Data

父元素
Inherited From:

setPosition(x, y)

设置图元中心点坐标

Parameters:
Name Type Description
x Number

x坐标
y Number

y坐标
Inherited From:

setPosition3d(x, y, z)

设置图元中心点在3D拓扑中的三维坐标

Parameters:
Name Type Description
x Number

x坐标
y Number

y坐标
z Number

z坐标
Inherited From:

setRect(x, y, width, height)

设置图元矩形区域

Parameters:
Name Type Description
x Number

x坐标
y Number

y坐标
width Number

宽度
height Number

高度
Inherited From:

setRotation(rotation)

设置图元的旋转角度，围绕中心点顺时针旋转

Parameters:
Name Type Description
rotation Number

旋转角度(弧度制)
Inherited From:

setRotation3d(x, y, z)

设置图元在3D拓扑中的三维旋转角度

Parameters:
Name Type Description
x Number

沿x轴的旋转角度(弧度制)
y Number

沿y轴的旋转角度(弧度制)
z Number

沿z轴的旋转角度(弧度制)
Inherited From:

setRotationMode(rotationMode)

设置三维旋转模式
图元在3D拓扑中旋转时，先沿x轴旋转，再沿y轴旋转和先沿y轴旋转，再沿x轴旋转最后的结果是不一样的

Parameters:
Name Type Description
rotationMode String

旋转模式，可选值如下：

  • xyz:先进行x轴旋转，再进行y轴旋转，最后进行z轴旋转
  • xzy:先进行x轴旋转，再进行z轴旋转，最后进行y轴旋转
  • yxz:先进行y轴旋转，再进行x轴旋转，最后进行z轴旋转
  • yzx:先进行y轴旋转，再进行z轴旋转，最后进行x轴旋转
  • zxy:先进行z轴旋转，再进行x轴旋转，最后进行y轴旋转
  • zyx:先进行z轴旋转，再进行y轴旋转，最后进行x轴旋转
Inherited From:
See:

setRotationX(rotationX)

设置图元在3D拓扑中沿x轴的旋转角度(弧度制)

Parameters:
Name Type Description
rotationX Number

旋转角度(弧度制)
Inherited From:

setRotationY(rotationY)

设置图元在3D拓扑中沿y轴的旋转角度(弧度制)

Parameters:
Name Type Description
rotationY Number

旋转角度(弧度制)
Inherited From:

setRotationZ(rotationZ)

设置图元在3D拓扑中沿z轴的旋转角度(弧度制)

Parameters:
Name Type Description
rotationZ Number

旋转角度(弧度制)
Inherited From:

setSize(width, height)

设置图元在2D拓扑中的尺寸(宽高)

Parameters:
Name Type Description
width Number

宽度
height Number

高度
Inherited From:

setSize3d(width, tall, height)

设置图元在3D拓扑中的尺寸

Parameters:
Name Type Description
width Number

x轴方向的长度
tall Number

y轴方向的长度
height Number

z轴方向的长度
Inherited From:

setStyle(name, value)

设置样式

Parameters:
Name Type Description
name String

样式名
value Object

样式值
Inherited From:

setTag(tag)

设置标示号，可通过getDataByTag快速查找

Parameters:
Name Type Description
tag String

标示号
Inherited From:

setTall() → {Number}

设置图元在3D拓扑中的y轴方向的长度

Inherited From:
Returns:

tall y轴方向的长度

Type
Number

setToolTip(toolTip)

设置文字提示信息

Parameters:
Name Type Description
toolTip String

文字提示
Inherited From:

setWidth() → {Number}

设置图元在3D拓扑中的x轴方向的长度

Inherited From:
Returns:

width x轴方向的长度

Type
Number

size() → {Number}

获取孩子元素总数

Inherited From:
Returns:

孩子元素总数

Type
Number

t3(tx, ty, tz)

在当前坐标的基础上增加x、y、z三个方向的平移值，translate3d的缩写

Parameters:
Name Type Description
tx Number

x轴方向的平移值
ty Number

y轴方向的平移值
tz Number

z轴方向的平移值
Inherited From:
See:

toChildren(matchFunc, scope) → {ht.List}

以matchFunc为过滤函数构建新的孩子元素集合

Parameters:
Name Type Argument Description
matchFunc function <optional>

过滤函数
scope Object <optional>

函数域
Inherited From:
Returns:

孩子元素集合

Type
ht.List
Example
 var list = data.toChildren(function(child) {
   if (child.a('visible')) {
   	return true;
   }
});

toLabel() → {String}

返回值作为TreeView和GraphView等组件上的图元文字标签，默认返回displayName||name信息

Inherited From:
Returns:

文字标签

Type
String

toString() → {String}

重写js默认的toString

Inherited From:
Returns:
Type
String

translate(tx, ty)

在当前坐标的基础上增加x、y两个方向的平移值

Parameters:
Name Type Description
tx Number

x轴方向的平移值
ty Number

y轴方向的平移值
Inherited From:

translate3d(tx, ty, tz)

在当前坐标的基础上增加x、y、z三个方向的平移值，t3的缩写

Parameters:
Name Type Description
tx Number

x轴方向的平移值
ty Number

y轴方向的平移值
tz Number

z轴方向的平移值
Inherited From:
See:

translate3dBy(direction, distance)

沿向量平移

Parameters:
Name Type Description
direction Array

方向向量
distance Number

平移距离
Inherited From:

translateBack(distance)

沿向量[0, 0, -1]平移

Parameters:
Name Type Description
distance Number

平移距离
Inherited From:

translateBottom(distance)

沿向量[0, -1, 0]平移

Parameters:
Name Type Description
distance Number

平移距离
Inherited From:

translateFront(distance)

沿向量[0, 0, 1]平移

Parameters:
Name Type Description
distance Number

平移距离
Inherited From:

translateLeft(distance)

沿向量[-1, 0, 0]平移

Parameters:
Name Type Description
distance Number

平移距离
Inherited From:

translateRight(distance)

沿向量[1, 0, 0]平移

Parameters:
Name Type Description
distance Number

平移距离
Inherited From:

translateTop(distance)

沿向量[0, 1, 0]平移

Parameters:
Name Type Description
distance Number

平移距离
Inherited From:
欢迎交流 service@hightopo.com