外观上看，每个图元由一个主体和多个孩子组件构成，默认节点呈现为一个图标和文字，这里的图标就是节点的主体，对于连线主体则为一条路径。
挂载孩子组件
除了默认的图形元素外，使用#addUI(...)方法，可以挂载更多孩子组件，每个组件可表示特定的信息，将图元属性与孩子组件属性相关联，可实现数据的联动效果
#addUI - 添加子组件
示例
添加文本标签到节点，并将文本标签的内容和字体颜色与节点用户属性相绑定，通过修改节点属性来改变文本的内容和颜色
var nodeWithLabels = graph.createNode("Node with Labels", 0, -110);
var label2 = new Q.LabelUI();
label2.position = Q.Position.CENTER_TOP;
label2.anchorPosition = Q.Position.CENTER_BOTTOM;
label2.border = 1;
label2.padding = new Q.Insets(2, 5);
label2.showPointer = true;
label2.offsetY = -10;
label2.backgroundColor = Colors.yellow;
label2.fontSize = 16;
label2.fontStyle = "italic 100";
nodeWithLabels.addUI(label2, [{
property : "label2",
propertyType : Q.Consts.PROPERTY_TYPE_CLIENT,
bindingProperty : "data"
}, {
property : "label2.color",
propertyType : Q.Consts.PROPERTY_TYPE_CLIENT,
bindingProperty : "color"
}]);
nodeWithLabels.set("label2", "another label");
nodeWithLabels.set("label2.color", Colors.blue);
效果
扩展孩子组件
通过扩展孩子组件可以实现更丰富的效果，比如定制一个柱状图，挂载到节点，表示CPU占有率，或者挂载告警冒泡标示节点的状态
