mxGraph: Create graph with XML

Question

I am trying to create graph from xml file.

My JavaScript Code is-

function loadXML() {
console.log(\"Inside loadXML\");
var doc = mxUtils.parseXml(\'         


        

Answer 1

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));

Answer 2

try this

 var xml = '<root><mxCell id="2" value="World!Vishal" vertex="1"><mxGeometry x="200" y="150" width="80" height="30" as="geometry"/></mxCell><mxCell id="3" edge="1" source="2"><mxGeometry relative="1" as="geometry"><mxPoint x="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.

Answer 3

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

    mxGraph graph = new mxGraph();      
    String strXML = 
    mxUtils.readFile("sample.xml");
    Document xmlGraphDoc = mxXmlUtils.parseXml(strXML);
    mxCodec codec = new mxCodec(xmlGraphDoc);       
    Object o;
    o = codec.decode(xmlGraphDoc.getDocumentElement());
    graph.setModel((mxGraphModel)o);
    mxGraphModel model = (mxGraphModel)graph.getModel();

Below is my Sample XML

<mxGraphModel dx="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>
    <mxCell id="0" />
    <mxCell id="1" parent="0" />
    <mxCell id="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">
       <mxGeometry x="110" y="90" width="600" height="340" as="geometry" />
    </mxCell>
  </root>
</mxGraphModel>