Question

我在我的项目中使用mxGraph JS库来构建图形。我能够构造图形，将其编码为xml并将xml解码为图形。

问题

我有一个自定义类Message，我在调用cell.data函数后返回的对应mxCell的对象设置为graph.insertVertex()。

Message类看起来像这样：

class Message {
    constructor(title) {
        this.attributes = {};
        this.attributes.title = title;
        this.attributes.audioPath = "";
    }

还有一个名为Type的类用于封装Message对象。它只是逻辑的要求。看起来像这样：

class Type{
  constructor(a,b){
    this.object = a;
    this.type = b;
  }
}

我在图表中插入顶点并设置像这样的单元格数据：

Message m=new Message(); //new Message object
m.attributes.title="Sample"; //setting message attributes

cell = graph.insertVertex(parent, null, this.attributes.title, 20, 40, 80, 30); //inserting vertex in graph

Type type=new Type(); //new Type object
type.type="msg"; 
type.object=m;

cell.data=m; //Setting type to cell data

现在我在Message注册我的mxCodecRegistry对象：

var messageCodec = new mxObjectCodec(new Message());
messageCodec.encode = function(enc, obj) {
    var node = enc.document.createElement('message');
    mxUtils.setTextContent(node, JSON.stringify(obj.attributes));
    return node;
};
messageCodec.decode = function(dec, node, into) {
    var obj = JSON.parse(mxUtils.getTextContent(node));
    obj.constructor = Message;

    return obj;
};

mxCodecRegistry.register(messageCodec);

在此之后，我将图形编码为xml。这是代码和输出xml：

CODE：

var encoder  = new mxCodec();
var node = encoder.encode(graph.getModel());
xml = mxUtils.getXml(node);

//mxUtils.popup(xml, true);
return xml;

输出：

<?xml version="1.0" encoding="UTF-8"?>
<mxGraphModel>
   <root>
      <mxCell id="0" />
      <mxCell id="1" parent="0" />
      <mxCell id="8" value="Sample" vertex="1" parent="1">
         <mxGeometry x="338.5" y="180" width="40" height="20" as="geometry" />
         <Type type="msg" as="data">
            <message as="object">{"title":"Insert_1"}</message>
         </Type>
      </mxCell>
   </root>
</mxGraphModel>

将xml解码为图形并在控制台中打印cell.data：

CODE：

var doc = mxUtils.parseXml(xml);
var codec = new mxCodec(doc);
codec.decode(doc.documentElement, graph.getModel());
for(var i in graph2.getChildCells() ) {
        console.log("cell" + i + ":" + JSON.stringify(graph.getChildCells()[i].data));
}

输出：

cell0:{}
cell1:{}

请帮帮我。我希望单元格数据转换回对象，以便我可以直接访问所有属性。

无法使用mxObjectDecode将mxGraph单元格数据从xml解码为对象

0 个答案: