javascript – mxGraph – 通过加载XML显示图表

在How to get the XML from mxGrpah diagram?的帮助下,能够从图形编辑器中获取动态XML.
现在,我需要通过加载XML(反向算法)来显示图表

解决方法:

好的,与How to get the XML from mxGrpah diagram?回答类似,我不再清楚如何获取保存整个图形的图形对象,因此我提出以下解决方法：

1)获取原始图形对象的引用到index.html代码中

一世.将全局变量添加到index.html以获取图形对象的引用

var universalGraph;

II.进入已创建图形对象的.js文件(例如,转到installListeners函数上的js / view / mxGraphView,并将图形对象的实例分配给全局可访问引用

mxGraphView.prototype.installListeners = function(){
var graph = this.graph;
var container = graph.container;
universalGraph = graph; //this way, you will have access from .index.html to the graph object and you will be able to import the xml as shown in the example here https://stackoverflow.com/questions/56664578/mxgraph-save-functionality-not-working-locally/56735153#56735153 

正如您将看到的,现在建议使用全局Graph.xml的解决方案here是多余的,因为现在这样您将始终访问图形对象:).

2)既然你现在有图形对象,你可以将它用于任何你想要的目的(导出/导入xml状态)

编辑

我还发布了一个如何在index.html中上传xml的示例

function uploadXML(){
        let xml = '<thexml_you_got_from_the_export><thexml_you_got_from_the_export/>';
        let doc = mxUtils.parseXml(xml);
        let codec = new mxCodec(doc);
        codec.decode(doc.documentElement, universalGraph.getModel());
        let elt = doc.documentElement.firstChild;
        let cells = [];
        while (elt != null)
        {
            let cell = codec.decode(elt)
            if(cell != undefined){
                if(cell.id != undefined && cell.parent != undefined && (cell.id == cell.parent)){
                    elt = elt.nextSibling;
                    continue;
                }
                cells.push(cell);
            }
            elt = elt.nextSibling;
        }
        universalGraph.addCells(cells);

    }

标签：javascript,php,mxgraph
来源： https://codeday.me/bug/20191003/1847083.html