Question

我用一些端口创建单元格：

当收入边缘超过输入端口时，如何设置输入端口不可连接？
如何禁用与指定类型的单元格连接的单元格？

我找到了一个班级mxMultiplicity，它似乎很有帮助，但我不知道如何使用它。

图表的XML表达式是这样的。有两种单元格，它们具有用户对象Table和Operation作为值。

<mxGraphModel>
  <root>
    <mxCell id="0"/>
    <mxCell id="1" parent="0"/>
    <mxCell id="2" style="table" vertex="1" parent="1">
      <Table name="table1" as="value">
        <Array as="data">
          <add value="1"/>
          <add value="2"/>
          <add value="3"/>
        </Array>
      </Table>
      <mxGeometry x="90" y="50" width="50" height="50" as="geometry"/>
      <Array as="ports">
        <Object type="out" x="0.5" y="0.5" perimeter="1"/>
      </Array>
    </mxCell>
    <mxCell id="3" vertex="1" parent="1">
      <Operation name="add" portNumber="2" code="a + b" as="value"/>
      <mxGeometry x="150" y="180" width="90" height="50" as="geometry"/>
      <Array as="ports">
        <Object type="in" x="0.3" y="0" perimetry="1" as="add-in0"/>
        <Object type="in" x="0.6" y="0" perimetry="1" as="add-in1"/>
        <Object type="out" x="0.5" y="1" perimetry="1" as="add-out"/>
      </Array>
    </mxCell>
  </root>
</mxGraphModel>

Answer 1

我自己解决了，希望如果你有同样的问题，答案可以帮助你。

我检查了mxMultiplicity.js的代码，并尝试覆盖原型函数checkType。通过这种方式，当它检查您连接的终端是否为禁用单元时，如果value是一个对象，它将检查value是否是type的实例。

mxMultiplicity.prototype.checkType = function(graph, value, type, attr, attrValue) {
            if (value != null) {
                if (typeof value == 'object') {
                    if (value instanceof type) {
                        return value[attr] == attrValue;
                    } else {
                        return false;
                    }
                } else if (!isNaN(value.nodeType)) {
                    return mxUtils.isNode(value, type, attr, attrValue);
                } else {
                    return value == type;
                }
            }
            return false;
        }

连接规则可以是这个，Table是我的构造函数。

graph.multiplicities.push(new mxMultiplicity(
    false, Table, null, null, 0, 0, null,
    'can not input to table', 'null'
));

Answer 2

我们可以使用mxGraph.prototype.validateEdge并需要实施。

mxGraph.prototype.validateEdge = function(edge, source, target)
{
    // to do implementation.

    // return type : to be "String" or "Null"
    return null;
};

如何动态设置单元格不可连接？

2 个答案: