mxGraph编程之加载流程Xml数据显示

最近因项目要求，研究了一下mxGraph的用法，总结了一些使用mxGraph的心得体会。

mxGraph自不必多言，史上最强大的web流程图绘制插件，没有之一。mxGraph除了拖拽流程块之外就是保存各个流程块之间关联关系的数据，

mxGraph在保存流程块数据的时候，使用的是xml数据进行，在这个json满天飞的现在，mxGraph还使用xml保存数据确实称得上是一种奇葩，不过，mxGraph的xml数据也是十分简单并且易于解析的，因此解析它并转换成我们需要的格式也是很容易的。当然，mxGraph既可以将流程块的数据保存为xml数据，也可以从xml数据中生成流程块数据。所以有些时候，我们连解析xml都不需要。

mxGraph开发库中有一个mxCodec对象，可以很方便的对xml数据进行解析并显示，mxCodec类的decode方法可以实现解析xml数据的功能

但是decode方法需要一个DocumentElement的对象，如何生成呢？答案当然使用mxUtil的parseXml方法生成node对象，然后获取DocumentElement对象，然后送入decode方法，生成我们的流程图

既然思路有了，代码自然就出来了

var node = mxUtil.parseXml('你的xml数据');
decoder = new mxCodec();
decoder.decode(node.documentElement, graph.getModel)

注意：graph是你的mxGraph对象