diff --git a/demo/main.js b/demo/main.js index 8b24a50..a31174a 100644 --- a/demo/main.js +++ b/demo/main.js @@ -532,14 +532,20 @@ function onLoaded() { cy.nodes().forEach(node => { if(node.id()!= topLevelFocusParent.id() && node.parent().length == 0){ - - var newboundingBox = {w: node.width(),h:node.height(), ...node.position()}; + if(node.isChildless()){ + node.select(); + + }else{ + selectChildren(node); + } + var newboundingBox = cy.collection(cy.$(":selected")).boundingBox(); + newboundingBox = {...newboundingBox,w: node.width(),h:node.height()}; var width = newboundingBox.w; var height = newboundingBox.h; componentNodes.push({id: node.id(),data:cy.$(":selected"),pos:{ - x: newboundingBox.x, - y: newboundingBox.y}}); + x: (newboundingBox.x2 + newboundingBox.x1)/2, + y: (newboundingBox.y1 + newboundingBox.y2)/2}}); var newNode = cyLayout.add({ group: 'nodes', data: { @@ -550,8 +556,8 @@ function onLoaded() { newNode.position({ - x: newboundingBox.x, - y: newboundingBox.y + x: (newboundingBox.x2 + newboundingBox.x1)/2, + y: (newboundingBox.y1 + newboundingBox.y2)/2 }); newNode.style({ @@ -559,7 +565,8 @@ function onLoaded() { 'height': Math.max(width,height), // Set the new height of the node 'label' : document.getElementById("cbk-flag-display-node-labels").checked ? newNode.data().id : '' }); - + + cy.nodes().unselect(); compoundsCounter++; } }) @@ -610,21 +617,22 @@ function onLoaded() { cyLayout.add(children) children.forEach(child => { child.select() - var newboundingBox = {w: child.width(),h:child.height(), ...child.position()}; + var newboundingBox = cy.collection(cy.$(":selected")).boundingBox(); + newboundingBox = {...newboundingBox,w: child.width(),h:child.height()}; var width = newboundingBox.w; var height = newboundingBox.h; if(child.id() != focusID){ if(child.isChildless()){ componentNodes.push({id: child.id(), data:cy.$(":selected"),pos:{ - x: child.position().x, - y: child.position().y}}); + x: (newboundingBox.x2 + newboundingBox.x1)/2, + y: (newboundingBox.y1 + newboundingBox.y2)/2}}); newNode = cyLayout.getElementById(child.id()) newNode.position({ - x: child.position().x, - y: child.position().y + x: (newboundingBox.x2 + newboundingBox.x1)/2, + y: (newboundingBox.y1 + newboundingBox.y2)/2 }); newNode.style({ diff --git a/dist/cytoscape-complexity-management.cjs.js b/dist/cytoscape-complexity-management.cjs.js index 32a5b92..be60593 100644 --- a/dist/cytoscape-complexity-management.cjs.js +++ b/dist/cytoscape-complexity-management.cjs.js @@ -1173,18 +1173,24 @@ function expandGraph(focusID, cy) { var componentNodes = []; cy.nodes().forEach(function (node) { if (node.id() != topLevelFocusParent.id() && node.parent().length == 0) { - var newboundingBox = _objectSpread2({ + if (node.isChildless()) { + node.select(); + } else { + selectChildren(node); + } + var newboundingBox = cy.collection(cy.$(":selected")).boundingBox(); + newboundingBox = _objectSpread2(_objectSpread2({}, newboundingBox), {}, { w: node.width(), h: node.height() - }, node.position()); + }); var width = newboundingBox.w; var height = newboundingBox.h; componentNodes.push({ id: node.id(), data: cy.$(":selected"), pos: { - x: newboundingBox.x, - y: newboundingBox.y + x: (newboundingBox.x2 + newboundingBox.x1) / 2, + y: (newboundingBox.y1 + newboundingBox.y2) / 2 } }); var newNode = cyLayout.add({ @@ -1195,8 +1201,8 @@ function expandGraph(focusID, cy) { } }); newNode.position({ - x: newboundingBox.x, - y: newboundingBox.y + x: (newboundingBox.x2 + newboundingBox.x1) / 2, + y: (newboundingBox.y1 + newboundingBox.y2) / 2 }); newNode.style({ 'width': Math.max(width, height), @@ -1205,6 +1211,7 @@ function expandGraph(focusID, cy) { // Set the new height of the node 'label': document.getElementById("cbk-flag-display-node-labels").checked ? newNode.data().id : '' }); + cy.nodes().unselect(); } }); if (cy.getElementById(focusID).parent().length == 0) { @@ -1249,10 +1256,11 @@ function expandGraph(focusID, cy) { cyLayout.add(children); children.forEach(function (child) { child.select(); - var newboundingBox = _objectSpread2({ + var newboundingBox = cy.collection(cy.$(":selected")).boundingBox(); + newboundingBox = _objectSpread2(_objectSpread2({}, newboundingBox), {}, { w: child.width(), h: child.height() - }, child.position()); + }); var width = newboundingBox.w; var height = newboundingBox.h; if (child.id() != focusID) { @@ -1261,14 +1269,14 @@ function expandGraph(focusID, cy) { id: child.id(), data: cy.$(":selected"), pos: { - x: child.position().x, - y: child.position().y + x: (newboundingBox.x2 + newboundingBox.x1) / 2, + y: (newboundingBox.y1 + newboundingBox.y2) / 2 } }); newNode = cyLayout.getElementById(child.id()); newNode.position({ - x: child.position().x, - y: child.position().y + x: (newboundingBox.x2 + newboundingBox.x1) / 2, + y: (newboundingBox.y1 + newboundingBox.y2) / 2 }); newNode.style({ 'width': Math.max(width, height) + 'px', diff --git a/dist/cytoscape-complexity-management.esm.js b/dist/cytoscape-complexity-management.esm.js index d87e861..2693d60 100644 --- a/dist/cytoscape-complexity-management.esm.js +++ b/dist/cytoscape-complexity-management.esm.js @@ -1171,18 +1171,24 @@ function expandGraph(focusID, cy) { var componentNodes = []; cy.nodes().forEach(function (node) { if (node.id() != topLevelFocusParent.id() && node.parent().length == 0) { - var newboundingBox = _objectSpread2({ + if (node.isChildless()) { + node.select(); + } else { + selectChildren(node); + } + var newboundingBox = cy.collection(cy.$(":selected")).boundingBox(); + newboundingBox = _objectSpread2(_objectSpread2({}, newboundingBox), {}, { w: node.width(), h: node.height() - }, node.position()); + }); var width = newboundingBox.w; var height = newboundingBox.h; componentNodes.push({ id: node.id(), data: cy.$(":selected"), pos: { - x: newboundingBox.x, - y: newboundingBox.y + x: (newboundingBox.x2 + newboundingBox.x1) / 2, + y: (newboundingBox.y1 + newboundingBox.y2) / 2 } }); var newNode = cyLayout.add({ @@ -1193,8 +1199,8 @@ function expandGraph(focusID, cy) { } }); newNode.position({ - x: newboundingBox.x, - y: newboundingBox.y + x: (newboundingBox.x2 + newboundingBox.x1) / 2, + y: (newboundingBox.y1 + newboundingBox.y2) / 2 }); newNode.style({ 'width': Math.max(width, height), @@ -1203,6 +1209,7 @@ function expandGraph(focusID, cy) { // Set the new height of the node 'label': document.getElementById("cbk-flag-display-node-labels").checked ? newNode.data().id : '' }); + cy.nodes().unselect(); } }); if (cy.getElementById(focusID).parent().length == 0) { @@ -1247,10 +1254,11 @@ function expandGraph(focusID, cy) { cyLayout.add(children); children.forEach(function (child) { child.select(); - var newboundingBox = _objectSpread2({ + var newboundingBox = cy.collection(cy.$(":selected")).boundingBox(); + newboundingBox = _objectSpread2(_objectSpread2({}, newboundingBox), {}, { w: child.width(), h: child.height() - }, child.position()); + }); var width = newboundingBox.w; var height = newboundingBox.h; if (child.id() != focusID) { @@ -1259,14 +1267,14 @@ function expandGraph(focusID, cy) { id: child.id(), data: cy.$(":selected"), pos: { - x: child.position().x, - y: child.position().y + x: (newboundingBox.x2 + newboundingBox.x1) / 2, + y: (newboundingBox.y1 + newboundingBox.y2) / 2 } }); newNode = cyLayout.getElementById(child.id()); newNode.position({ - x: child.position().x, - y: child.position().y + x: (newboundingBox.x2 + newboundingBox.x1) / 2, + y: (newboundingBox.y1 + newboundingBox.y2) / 2 }); newNode.style({ 'width': Math.max(width, height) + 'px', diff --git a/dist/cytoscape-complexity-management.umd.js b/dist/cytoscape-complexity-management.umd.js index 23eab81..031c570 100644 --- a/dist/cytoscape-complexity-management.umd.js +++ b/dist/cytoscape-complexity-management.umd.js @@ -5535,18 +5535,24 @@ var componentNodes = []; cy.nodes().forEach(function (node) { if (node.id() != topLevelFocusParent.id() && node.parent().length == 0) { - var newboundingBox = _objectSpread2({ + if (node.isChildless()) { + node.select(); + } else { + selectChildren(node); + } + var newboundingBox = cy.collection(cy.$(":selected")).boundingBox(); + newboundingBox = _objectSpread2(_objectSpread2({}, newboundingBox), {}, { w: node.width(), h: node.height() - }, node.position()); + }); var width = newboundingBox.w; var height = newboundingBox.h; componentNodes.push({ id: node.id(), data: cy.$(":selected"), pos: { - x: newboundingBox.x, - y: newboundingBox.y + x: (newboundingBox.x2 + newboundingBox.x1) / 2, + y: (newboundingBox.y1 + newboundingBox.y2) / 2 } }); var newNode = cyLayout.add({ @@ -5557,8 +5563,8 @@ } }); newNode.position({ - x: newboundingBox.x, - y: newboundingBox.y + x: (newboundingBox.x2 + newboundingBox.x1) / 2, + y: (newboundingBox.y1 + newboundingBox.y2) / 2 }); newNode.style({ 'width': Math.max(width, height), @@ -5567,6 +5573,7 @@ // Set the new height of the node 'label': document.getElementById("cbk-flag-display-node-labels").checked ? newNode.data().id : '' }); + cy.nodes().unselect(); } }); if (cy.getElementById(focusID).parent().length == 0) { @@ -5611,10 +5618,11 @@ cyLayout.add(children); children.forEach(function (child) { child.select(); - var newboundingBox = _objectSpread2({ + var newboundingBox = cy.collection(cy.$(":selected")).boundingBox(); + newboundingBox = _objectSpread2(_objectSpread2({}, newboundingBox), {}, { w: child.width(), h: child.height() - }, child.position()); + }); var width = newboundingBox.w; var height = newboundingBox.h; if (child.id() != focusID) { @@ -5623,14 +5631,14 @@ id: child.id(), data: cy.$(":selected"), pos: { - x: child.position().x, - y: child.position().y + x: (newboundingBox.x2 + newboundingBox.x1) / 2, + y: (newboundingBox.y1 + newboundingBox.y2) / 2 } }); newNode = cyLayout.getElementById(child.id()); newNode.position({ - x: child.position().x, - y: child.position().y + x: (newboundingBox.x2 + newboundingBox.x1) / 2, + y: (newboundingBox.y1 + newboundingBox.y2) / 2 }); newNode.style({ 'width': Math.max(width, height) + 'px', diff --git a/src/cue-utilities.js b/src/cue-utilities.js index d0a4c31..9ed5043 100644 --- a/src/cue-utilities.js +++ b/src/cue-utilities.js @@ -179,14 +179,20 @@ function expandGraph(focusID,cy){ cy.nodes().forEach(node => { if(node.id()!= topLevelFocusParent.id() && node.parent().length == 0){ - - var newboundingBox = {w: node.width(),h:node.height(), ...node.position()}; + if(node.isChildless()){ + node.select(); + + }else{ + selectChildren(node); + } + var newboundingBox = cy.collection(cy.$(":selected")).boundingBox(); + newboundingBox = {...newboundingBox,w: node.width(),h:node.height()}; var width = newboundingBox.w; var height = newboundingBox.h; componentNodes.push({id: node.id(),data:cy.$(":selected"),pos:{ - x: newboundingBox.x, - y: newboundingBox.y}}); + x: (newboundingBox.x2 + newboundingBox.x1)/2, + y: (newboundingBox.y1 + newboundingBox.y2)/2}}); var newNode = cyLayout.add({ group: 'nodes', data: { @@ -197,8 +203,8 @@ function expandGraph(focusID,cy){ newNode.position({ - x: newboundingBox.x, - y: newboundingBox.y + x: (newboundingBox.x2 + newboundingBox.x1)/2, + y: (newboundingBox.y1 + newboundingBox.y2)/2 }); newNode.style({ @@ -206,7 +212,8 @@ function expandGraph(focusID,cy){ 'height': Math.max(width,height), // Set the new height of the node 'label' : document.getElementById("cbk-flag-display-node-labels").checked ? newNode.data().id : '' }); - + + cy.nodes().unselect(); compoundsCounter++; } }) @@ -257,21 +264,22 @@ function expandGraph(focusID,cy){ cyLayout.add(children) children.forEach(child => { child.select() - var newboundingBox = {w: child.width(),h:child.height(), ...child.position()}; + var newboundingBox = cy.collection(cy.$(":selected")).boundingBox(); + newboundingBox = {...newboundingBox,w: child.width(),h:child.height()}; var width = newboundingBox.w; var height = newboundingBox.h; if(child.id() != focusID){ if(child.isChildless()){ componentNodes.push({id: child.id(), data:cy.$(":selected"),pos:{ - x: child.position().x, - y: child.position().y}}); + x: (newboundingBox.x2 + newboundingBox.x1)/2, + y: (newboundingBox.y1 + newboundingBox.y2)/2}}); newNode = cyLayout.getElementById(child.id()) newNode.position({ - x: child.position().x, - y: child.position().y + x: (newboundingBox.x2 + newboundingBox.x1)/2, + y: (newboundingBox.y1 + newboundingBox.y2)/2 }); newNode.style({ @@ -338,7 +346,6 @@ function expandGraph(focusID,cy){ }); } - function translateNode(a,a1) { // Step 1: Find the displacement vector d between a and a1 return { x: a1.x - a.x, y: a1.y - a.y };