mxGraph定义:mxGraph是一个js绘图组件,适用在网页设计/编辑流程图、图表、网络图和普通图形的web应用程序。
mxGraph支持:mxGraph支持拖动和克隆细胞,重新调整和改造,连接和断开,拖动和下降,从外部来源,编辑细胞中的标签和更多。
mxGraph.insertVertex(parent,id,value,x,y,width,height,style )
parent——作为组结构中新单元的直接父级的单元
id——这是描述单元格的全局唯一标识符,它始终是一个字符串。这主要用于在外部引用持久输出中的单元格。如果您不希望自己维护id,请将null传递给此参数并确保mxGraphModel.isCreateIds()返回true。这样,模型将管理ID并确保它们是唯一的。
value——这是单元格的用户对象。它将在顶点或边缘上显示为标签。(传值之后,该值会出现在所连的线上)
x——该元素左上角到浏览器的横向距离
y——该元素左上角到浏览器的纵向距离
width——该元素的宽
height——该元素的高
v1指代第一元素,v2指代第二个元素
从第一个连线指向第二,直接是默认:graph.insertEdge(parent, null, '', v1, v2);
从第二连线指向第一个:
graph.insertEdge(parent, null, '', v2, v1, 'edgeStyle=orthogonalEdgeStyle;');
注:
1.获取方法
- //始终从选择的mxcells返回数组的第一个细胞
graph.getSelectionCell()- //获取所有被选择的元素
graph.getSelectionCells()- //返回所选择所有cells的所有信息
graph.getSelectionModel()2.设置方法
//设置选中节点cell
graph.setSelectionCell(v1);
API
http://jgraph.github.io/mxgraph/docs/js-api/files/index-txt.html