Realign, arrage the position of the nodes

@rahimhaji wrote:

Dear Friends,

iam creating a chart with nodes and subnodes, when iam adding new node/subnode I have to rearrage the position and when I delete a node I have to reset the position and rearrage the position. when deleting iam getting some different lines (link line) extra… pls guide me is there any mistake iam doing in code:

// ------------------------------------------------ Object 4 ------------------------------------

diagram.nodeTemplateMap.add(“RightRectangle”,
$$(go.Node, “Spot”, nodeStyle(),
{
selectionAdornmentTemplate: // adornment when a group is selected
$$(go.Adornment, “Auto”,
$$(go.Placeholder),
$$(“Button”,
{
alignment: go.Spot.LeftCenter,
click: addRightSubNodeAndLink // this function is defined below
},
$$(go.Shape, “PlusLine”, { name: “left”, width: 6, height: 6 })
)
)
},
new go.Binding(“movable”, “movable”),
new go.Binding(“location”, “loc”, go.Point.parse).makeTwoWay(go.Point.stringify),
new go.Binding(“uid”, “uid”),
$$(go.Panel, “Auto”,
$$(go.Shape, “Rectangle”,
{
minSize: new go.Size(200, 90),
fill: new $$(go.Brush, “Linear”, { 0.0: “White”, 1.0: “red” }),
stroke: null
},
new go.Binding(“fill”)),
$$(go.TextBlock, “Rectangle”,
{ font: “bold 11pt Helvetica, Arial, sans-serif”, stroke: “#000000”, editable: false, width: 150, height: 60, background: “white”, textAlign: “center”, verticalAlignment: go.Spot.Center },
new go.Binding(“text”))
),
// three named ports, one on each side except the top, all output only:
makePort(“L”, go.Spot.Left, false, false),
{
click: function (e, obj) {
selectedNode(e, obj)
}
},
{ doubleClick: function (e, obj) { } }
));
//--------------------------------------------------------------------------------

// ------------------------------------------------ Object 6 ------------------------------------

diagram.nodeTemplateMap.add(“RightSubRectangle”,
$$(go.Node, “Spot”, nodeStyle(),

},
new go.Binding("movable", "movable"),
new go.Binding("subObject", "subObj"),
new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),
new go.Binding("uid", "uid"),
$$(go.Panel, "Vertical",
  makePort("RSubR", go.Spot.Right, false, false),
  makePort("RSubL", go.Spot.Left, false, false)),
$$(go.Panel, "Auto",
  $$(go.Panel, "Auto",
    $$(go.Shape, "Rectangle", { fill: "white" }),
    $$(go.Panel, "Table",
      { defaultRowSeparatorStroke: "gray" },
      $$(go.RowColumnDefinition, { column: 0, width: 200 }),
      $$(go.Panel, "Vertical", { row: 0, column: 0 },
        $$(go.TextBlock, { width: 100, overflow: go.TextBlock.OverflowEllipsis, maxLines: 4, wrap: go.TextBlock.WrapDesiredSize, margin: 10, isMultiline: true, textAlign: "center", editable: false, },
          new go.Binding("text", "text"))
      ),
      $$(go.Panel, "Auto", { row: 1, column: 0, alignment: go.Spot.Center },
        $$(go.TextBlock, { margin: 5 }, new go.Binding("text", "statusTxt"))
      ),
      $$(go.Panel, "Auto", { row: 2, column: 0, alignment: go.Spot.Center },
        $$(go.TextBlock, { margin: 5 }, new go.Binding("text", "ownerTxt"))
      )
    ))),
// three named ports, one on each side except the top, all output only:     
{
  click: function (e, obj) {
    selectedNode(e, obj)
  }
},
{ doubleClick: function (e, obj) {  } }

));
//----------------------------------------------------------------------------------------
function addRightSubNodeAndLink(e, Obj) {
var rightMainNodeSubInc = 0;
var clickedObjKey = Obj.part.data.key;
var getObj = diagram.findNodeForKey(clickedObjKey);
if (getObj.data.subObj != undefined) {
rightMainNodeSubInc = getObj.data.subObj + 1
}
var x = Obj.part.adornedPart.location.x;
var y = Obj.part.adornedPart.location.y;

var w = Obj.actualBounds.width;
var h = Obj.actualBounds.height;

var tempLinkDataArray = diagram.model.linkDataArray;
for (var a = 0; a < tempLinkDataArray.length; a++) {
if (tempLinkDataArray[a].from == clickedObjKey || tempLinkDataArray[a].to == clickedObjKey) {
diagram.model.removeLinkData(tempLinkDataArray[a]);
}
}

diagram.model.addNodeData({ key: clickedObjKey + “" + rightMainNodeSubInc, category: “RightSubRectangle”, text: “RC” + rightMainNodeSubInc, ownerTxt: “Owner :”, statusTxt: “Status : Draft”, loc: go.Point.stringify({ x: x, y: y }), movable: false, uid: “0” })
diagram.model.addLinkData({ from: clickedObjKey + "” + rightMainNodeSubInc, to: clickedObjKey, fromSpot: go.Spot.Right, toSpot: go.Spot.Left, toArrow: “” })
if (rightMainNodeSubInc == 1) {
diagram.model.addLinkData({ from: clickedObjKey + “" + rightMainNodeSubInc, to: “e1”, fromSpot: go.Spot.Left, toSpot: go.Spot.Right, toArrow: “” })
}
else {
diagram.model.addLinkData({ from: clickedObjKey + "” + rightMainNodeSubInc, to: clickedObjKey + “_” + (rightMainNodeSubInc - 1), portId: “RSubL”, fromSpot: go.Spot.Left, toSpot: go.Spot.Right, toArrow: “” })
}
diagram.model.setDataProperty(getObj, “location”, new go.Point(x + 300, y));

var data = diagram.model.findNodeDataForKey(clickedObjKey);
diagram.model.setDataProperty(data, “subObj”, rightMainNodeSubInc);
reArrangeNode(“right”, rightMainNodeInc, centerObjX, centerObjY)
}
//----------------------------------------------------------------------------------------
function resetNode(aNodeKey) {
//console.log(“aNodeKey “+aNodeKey);
var name = aNodeKey.split(”")
if (name.length == 2) {
var node = diagram.findNodeForKey(aNodeKey);
for (var a = 1; a <= node.data.subObj; a++) {
var deleteSubNode = diagram.findNodeForKey(aNodeKey + "” + a);
if (deleteSubNode != null) {
diagram.remove(deleteSubNode);
}
}
diagram.remove(selectedNodeValue);
}
else if (name.length == 3) {
var parentNode = diagram.findNodeForKey(name[0] + “" + name[1]);
var getNodeArray = [centerObj.part.data.key]
diagram.remove(selectedNodeValue);
var checkSubObjCount = 0;
for (var a = 1; a <= parentNode.data.subObj; a++) {
var subNode = diagram.findNodeForKey(name[0] + "” + name[1] + “" + a);
if (subNode != null) {
getNodeArray.push(subNode.data.key)
}
else {
checkSubObjCount++;
}
}
getNodeArray.push(parentNode.data.key)
//console.log("cc “+checkSubObjCount +” – "+parentNode.data.subObj)
if (checkSubObjCount == parentNode.data.subObj) {
var tempParentObj = diagram.model.findNodeDataForKey(name[0] + "” + name[1]);
diagram.model.setDataProperty(tempParentObj, “subObj”, 0);
}
//-------- Delete link, if the link existing already----------------------
for (var b = 0, k = 1; b < getNodeArray.length - 1; b++ , k++) {
var tempLinkDataArray = diagram.model.linkDataArray;
for (var a = 0; a < tempLinkDataArray.length; a++) {
if (tempLinkDataArray[a].from == getNodeArray[b] && tempLinkDataArray[a].to == getNodeArray[k]) {
diagram.model.removeLinkData(tempLinkDataArray[a]);
break;
}
}

  if (name[0] == "L") {
    diagram.model.addLinkData({ from: getNodeArray[b], to: getNodeArray[k], fromSpot: go.Spot.Left, toSpot: go.Spot.Right, toArrow: "" })
  } else {
    diagram.model.addLinkData({ from: getNodeArray[b], to: getNodeArray[k], fromSpot: go.Spot.Right, toSpot: go.Spot.Left, toArrow: "" })
  }
}
//--------------------------------------------------------------------------- 

}
var setSide = ((name[0] == “L”) ? “left” : “right”);
var count = ((setSide == “left”) ? leftMainNodeInc : rightMainNodeInc)
reArrangeNode(setSide, count, centerObjX, centerObjY)
}

//--------------------------------------
function reArrangeNode(aValues, aInc, aCenterX, aCenterY) {
console.log(“reArrangeNode -> start Function”)
var name = ((aValues == “left”) ? “L_” : “R_”);
var centerY = aCenterY;
var twoObjectGap = 10;
var xPos = ((aValues == “left”) ? (aCenterX - 300) : (aCenterX + 300));
var yPos = 0;
var getObjectHeight = 0;

var objHeight = 0;
if (aInc > 1) {
for (var a = 1; a <= aInc; a++) {
var data = diagram.findNodeForKey(name + a);
if (data != null) {
objHeight = data.actualBounds.height
//alert(a+""+objHeight);
if (data.data.subObj == 0 || data.data.subObj == undefined) {
getObjectHeight += objHeight + twoObjectGap
}
else {
for (var a1 = 1; a1 <= data.data.subObj; a1++) {
var tempdata1 = diagram.findNodeForKey(name + a + "" + a1);
if (tempdata1 != null) {
getObjectHeight += tempdata1.actualBounds.height + twoObjectGap;
break;
}
}
}
}
}
yPos = ((diagram.grid.height + 81) - getObjectHeight) / 2;
//yPos=((diagram.grid.height)-getObjectHeight)/2;
console.log(“Center :” + diagram.grid.height + "" + getObjectHeight);
for (var b = 1; b <= aInc; b++) {
xPos = ((aValues == “left”) ? (aCenterX - 300) : (aCenterX + 300));
var getObj = diagram.findNodeForKey(name + b);
if (getObj != null) {
objHeight = getObj.actualBounds.height
if (getObj.data.subObj > 0 && getObj.data.subObj != undefined) {
var subObjLen = getObj.data.subObj
for (var c = 1; c <= subObjLen; c++) {
var getSubObj = diagram.findNodeForKey(name + b + “_” + c);

        var extraHeightSubNode = 0;

        if (getSubObj != null) {
          //extraHeightSubNode = (getSubObj.actualBounds.height/14)

          diagram.model.setDataProperty(getSubObj, "location", new go.Point(xPos, yPos + extraHeightSubNode))
          xPos = ((aValues == "left") ? (xPos - 300) : (xPos + 300));
          objHeight = (getSubObj.actualBounds.height);
        }
        diagram.model.setDataProperty(getObj, "location", new go.Point(xPos, yPos + extraHeightSubNode))
      }

    }
    else {
      diagram.model.setDataProperty(getObj, "location", new go.Point(xPos, yPos))
    }
    yPos += objHeight + twoObjectGap;
  }
}

}
console.log(“reArrangeNode -> End Function”)
}

Posts: 1

Participants: 1

Read full topic