Mxgraph: Create Graph With Xml

I am trying to create graph from xml file. My JavaScript Code is- function loadXML() { console.log('Inside loadXML'); var doc = mxUtils.parseXml('

Solution 1:

try this

 var xml = '<root><mxCellid="2"value="World!Vishal"vertex="1"><mxGeometryx="200"y="150"width="80"height="30"as="geometry"/></mxCell><mxCellid="3"edge="1"source="2"><mxGeometryrelative="1"as="geometry"><mxPointx="440"y="90"as="targetPoint"/></mxGeometry></mxCell></root>';
                     var doc = mxUtils.parseXml(xml);
                    var codec = new mxCodec(doc);
                    var elt = doc.documentElement.firstChild;
                    var cells = [];
                    while (elt != null){                
                      cells.push(codec.decodeCell(elt));
                        graph.refresh();
                      elt = elt.nextSibling;
                    }

                this.graph.addCells(cells);

Let me know if you have any issue.

Solution 2:

if you are using Grapheditor you can use its method (setGraphXml):

let doc = mxUtils.parseXml(xml);

myEditor.editor.setGraphXml(doc.documentElement);

where doc is the parsed XML and myEditor is your editor instance. you can get editor instance with :

const myEditor = new EditorUi(new Editor(urlParams['chrome'] == '1', themes));

Solution 3:

I am using mxGraph in Java for a commandline based integration and this is what i found out

mxGraphgraph=newmxGraph();      
    StringstrXML= 
    mxUtils.readFile("sample.xml");
    DocumentxmlGraphDoc= mxXmlUtils.parseXml(strXML);
    mxCodeccodec=newmxCodec(xmlGraphDoc);       
    Object o;
    o = codec.decode(xmlGraphDoc.getDocumentElement());
    graph.setModel((mxGraphModel)o);
    mxGraphModelmodel= (mxGraphModel)graph.getModel();

Below is my Sample XML

<mxGraphModeldx="1422"dy="794"grid="1"gridSize="10"guides="1"tooltips="1"connect="1"arrows="1"fold="1"page="1"pageScale="1"pageWidth="850"pageHeight="1100"math="0"shadow="0"><root><mxCellid="0" /><mxCellid="1"parent="0" /><mxCellid="7kiFW_6nxtc_rd8VOYzV-1"value="&lt;p style=&quot;margin: 0px ; margin-top: 6px ; text-align: center&quot;&gt;&lt;b&gt;Driver&lt;/b&gt;&lt;/p&gt;&lt;hr&gt;&lt;p style=&quot;margin: 0px ; margin-left: 8px&quot;&gt;&lt;br&gt;&lt;/p&gt;"style="align=left;overflow=fill;html=1;dropTarget=0;"parent="1"vertex="1"><mxGeometryx="110"y="90"width="600"height="340"as="geometry" /></mxCell></root></mxGraphModel>