-
Notifications
You must be signed in to change notification settings - Fork 0
Home
tianmo edited this page Aug 30, 2012
·
7 revisions
extgraph是基于extjs的绘图组件,可以方便的实现流程图、工作流等可视化编辑功能。
1、生成空白画布:
var graph = Ext.create('Ext.graph.Panel', {
renderTo: Ext.getBody()
});
或者
{
xtype: 'graph'
}
2、插入节点
var vertexs = graph.insertVertex([{
value: 'hello',
x: 20,
y: 20,
width: 80,
height: 30
},{
value: 'world',
x: 200,
y: 150,
width: 80,
height: 30
}]);
3、插入边
graph.insertEdge({
source: vertexs[0],
target: vertexs[1]
});
完成上面三步,就可以生成一个简单的图形啦,这个图形默认支持拖动、新建连接并且自动生成节点、框选等功能,并且可以定制。 ##下面我们看看这些代码的含义吧。