加载xml文件并仅显示顶点

时间:2019-09-25 08:49:34

标签: mxgraph

如何在我的mxGraphModel中加载以下draw.io文件并仅显示顶点而不显示边缘?

<?xml version="1.0" encoding="UTF-8"?>
<mxfile host="www.draw.io" modified="2019-09-25T08:10:42.119Z" agent="Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:69.0) Gecko/20100101 Firefox/69.0" etag="rVOYKV4DccHE-o70O52h" version="11.3.1" pages="1">
  <diagram id="VCf34-Iv6E_k61pAP0pe" name="Page-1">
    <mxGraphModel dx="1248" dy="594" 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="VXw29pc5vOmcNuhHpu7d-5" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;" edge="1" parent="1" source="VXw29pc5vOmcNuhHpu7d-2" target="VXw29pc5vOmcNuhHpu7d-4">
          <mxGeometry relative="1" as="geometry"/>
        </mxCell>
        <mxCell id="VXw29pc5vOmcNuhHpu7d-7" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;" edge="1" parent="1" source="VXw29pc5vOmcNuhHpu7d-2" target="VXw29pc5vOmcNuhHpu7d-6">
          <mxGeometry relative="1" as="geometry"/>
        </mxCell>

        [... some more vertices and edges ...]

      </root>
    </mxGraphModel>
  </diagram>
</mxfile>

谢谢。

2 个答案:

答案 0 :(得分:0)

好吧,由于您有一个doc对象,其中包含已加载的xml,因此您可以使用以下代码解析和仅绘制顶点:

let xml = '<root>...</root>'; //your xml
let doc = mxUtils.parseXml(xml);
let codec = new mxCodec(doc);
codec.decode(doc.documentElement, graph.getModel());
let elt = doc.documentElement.firstChild;
let cells = [];
while (elt != null)
{ 
    let cell = codec.decode(elt);
    if(cell != undefined){
        if(cell.vertex){
          cells.push(cell);
        }
    }

    elt = elt.nextSibling;
}

//add the vertices in the graph
graph.addCells(cells);

答案 1 :(得分:0)

在您的示例中,您处理字符串。我没有字符串,但是有一个xml文件。我该如何加载xml文件并准备使用给定的函数对其进行处理?

如果必须是字符串:如何加载xml文件并将其转换为字符串?