Question

我正在尝试在连接时改变边缘的样式。样式由逻辑依赖于源顶点或目标顶点设置。我可以通过添加连接侦听器并使用mxCell.setStyle来改变样式：

graph.connectionHandler.addListener(mxEvent.CONNECT, function (sender, evt)
{
     var edge = evt.getProperty('cell');
     edge.setStyle("...");         
}

虽然这会将样式设置为我指定的样式，但由于某种原因，它会更改目标顶点上的连接点。例如，如果我将其拖动到目标顶点上的9:00，在设置样式后，它将多次将连接点移动到目标顶点上的6:00。

Answer 1

经过几个小时的搞乱之后，我终于意识到新边缘的样式包含连接点的信息，因此您无法替换它。我决定将我想要设置的样式与应用于边缘的默认样式合并：

graph.connectionHandler.addListener(mxEvent.CONNECT, function (sender, evt){
     var edge = evt.getProperty('cell');
     var style = graph.getCellStyle(edge); //style is in object form
     var newStyle = graph.stylesheet.getCellStyle("edgeStyle=orthogonalEdgeStyle;html=1;rounded=1;jettySize=auto;orthogonalLoop=1;strokeColor=#FFCC00;strokeWidth=4;", style); //Method will merge styles into a new style object.  We must translate to string from here 
     var array = [];
        for (var prop in newStyle)
            array.push(prop + "=" + newStyle[prop]);
        edge.style = array.join(';'); 
}

如何在连接时更改边缘样式而不更改连接点

1 个答案: