2

在 mxGraph 教程页面中,可以使用 graph.insertVertex() 方法对自定义用户对象进行参数化。

具有自定义用户对象值的 mxCell

自定义用户对象采用工作流编辑器示例中包含的 wfeditor-commons.xml 中的模板定义的 xml 格式。

但是,通过 HTMLCollection 构建子元素的更好方法是什么?下面的 xml 是我自己定义的模板,如果某些值已更改,我需要维护 Description 和 ActivityType 子元素。

<add as="task">
  <Activity label="Task" name="" code="">
    <Description/>
    <ActivityType type="TaskNode"/>
        <mxCell vertex="1"> 
            <mxGeometry as="geometry" width="72" height="32"/>
        </mxCell>
    </Activity>
</add>

要通过以下代码访问子 xml 元素 Description 和 ActivityType 节点:

var model = this.graph.getModel();
var snode = model.getSelectedCell();  //to get current selected cell
var id = snode.id;
var label = $(snode).attr("label");   //get xml node attribute

var descriptionNode = $(snode.value).children("Description");
var descriptionTextContent = $(descriptionNode).text();    //get xml node text
var activityTypeNode = $(snode.value).children("ActivityType");
var activityTypeAttr = $(activityTypeNode).attr("type");   //get xml node attribute

我不确定这是否是通过 HTMLCollection 实现自定义用户对象读写的有效方法。

顺便说一句,如果自定义用户对象的子元素已更改,则需要保存。如何设置节点属性和文本内容值?更改这些值后,还需要调用 set value 方法来刷新用户对象。谢谢

model.setValue(cell, newValue)
4

1 回答 1

1

一开始,对于 jQuery xml 选择器和 MS XML DOM 对象方法有一个困惑。经过对 MS XML DOM 知识的一些研究工作,这是一个很好的读写用户对象的解决方案。

//读取方法

    var model = kmain.mxGraphEditor.graph.getModel();
    var snode = model.getValue(cell);

    var activity = {};
    activity.id = snode.getAttribute("id");
    activity.name = snode.getAttribute('label');
    activity.code = snode.getAttribute('code');

    var descriptionNode = snode.getElementsByTagName("Description")[0];    //child node
    if (descriptionNode) activity.description = descriptionNode.textContent;

    //activity type
    var activityTypeNode = snode.getElementsByTagName("ActivityType")[0];   //child node
    activity.type = activityTypeNode.getAttribute("type");

//写方法

    var snode =  model.getValue(kmain.mxSelectedDomElement.Cell);

    snode.setAttribute('label', activity.name);   //set attribute value
    snode.setAttribute('code', activity.code);    //set attribute value

    var descriptionNode = snode.getElementsByTagName("Description")[0]; 
    if (!descriptionNode){
        descriptionNode = snode.appendChild(snode.ownerDocument.createElement('Description'));    //add child element
    }
    descriptionNode.textContent = activity.description;         //set element text

    var activityTypeNode = snode.getElementsByTagName("ActivityType")[0];
    activityTypeNode.setAttribute("complexType", activity.complexType);

这将使维护 mxGraph 用户的自定义用户对象变得容易。

于 2017-05-23T01:45:32.247 回答