Basically, I am trying to show my menu before edge connection in which I will store different edge styles. Clicking on any one option of the menu will decide the style of my edge.
In my code, I am returning hard coded values to decide the relationship type.
//Menu Start***
function on_context_menu2(){
var contextElement = document.getElementById("context-menu2");
var content_ = '';
content_+='<div style="cursor: pointer" class="item" onclick="returnRelVal('Aggregation')"><i class="fa fa-refresh"></i> Rel 1</div>';
content_+='<div style="cursor: pointer" class="item" onclick="returnRelVal('Composition')"><i class="fa fa-refresh"></i> Rel 2</div>';
window.onclick = function(){
contextElement.innerHTML = content_;
contextElement.style.top = event.pageY + "px";
contextElement.style.left = event.pageX + "px";
contextElement.classList.add("active");
removeMenu();
}
function removeMenu(){
window.onclick = function(){
document.getElementById("context-menu2").classList.remove("active");
menuOpened = false;
}
}
//return relVal;
//return "Aggregation";
return "Composition";
}
// Menu End****
graph.connectionHandler.addListener(mxEvent.CONNECT, function(sender, evt){
//alert('connected');
var aa = on_context_menu2();
alert(aa);
if(aa=="Aggregation"){
var edge = evt.getProperty('cell');
var style = graph.getCellStyle(edge);
var newStyle = graph.stylesheet.getCellStyle("edgeStyle=orthogonalEdgeStyle;rounded=1;orthogonalLoop=1;strokeColor=#000000;strokeWidth=1;startArrow=open;endArrow=diamond;", style);
var array = [];
for (var prop in newStyle)
array.push(prop + "=" + newStyle[prop]);
edge.style = array.join(';');
}
else if (aa=="Composition"){
var edge = evt.getProperty('cell');
var style = graph.getCellStyle(edge);
var newStyle = graph.stylesheet.getCellStyle("edgeStyle=orthogonalEdgeStyle;rounded=1;orthogonalLoop=1;strokeColor=#000000;strokeWidth=1;startArrow=oval;endArrow=diamond;", style);
var array = [];
for (var prop in newStyle)
array.push(prop + "=" + newStyle[prop]);
edge.style = array.join(';');
}
});
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…