Links Alignment issue and overlapping issue

We need to reproduce the problem first. If you can help with that…
Or we can try to do so on our own based on your screenshots.

Problem 1: Links are going on to nodes even after having routing: go.Link.AvoidsNodes in linkTemplate

Problem 2: Few Vertical links and Horizontal Links are too close to each other(Not Overlapping) and appearing like one link. So we need to create some padding or margin to links or we need to create extra points to enroute the link where we get proper gap between links to make individual links visible clearly.so how can we make this possible?

Note: we are not using customLink

Starting from the Dynamic Ports sample, and not using CustomLink, I am unable to reproduce the problem that you show with the horiziontal segment crossing over the two nodes.

Hi walter
when we are using myRouter for arranging links , AvoidNodes functionality is getting overridden
after Avoid Nodes , myRouter is getting executed and links are getting adjusted
so links are overlapping on the stencil. can you please tell me solution for this problem?

Yes, that is a known shortcoming with that experimental code, which is why I suggested increasing the avoidableMargin on the nodes.

okay i will try and come back to you , thanks walter
small question
1.can we adjust position of nodes based on connections?
2. can we change ports text of node dynamically other than binding?

How are the nodes being positioned? Have you specified a Diagram.layout? If so, that is what is positioning the nodes. If not, then presumably you are either expecting your users to position nodes manually, or else you have computed their positions yourself and have put them in the model and your node template(s) are using a Binding on the Node.position or Node.location property.

In any case there’s no reason the user cannot move nodes slightly themselves. Or a lot.

How would you want to change the text of ports dynamically? Of course you can just set the TextBlock.text property. Or if the TextBlock.editable property is true, then the user can edit that text in-place.

  1. For ports text, i have data in js object, i have on solution like having binding for each and every port textblock to have dynamic text which we get from response Object but with this solution i need to maintain 14 key value pair objects for 14ports of 14port Nodes. is there any alternative to make this happend which inceases efficiency and reduce key value pairs?
  1. for myDIagram nodeTemplate can you please send me where should i add avoidableMargins because im not using any nodeTemplate for diagram as of now, im only using node linkTemplate for myDiagram.can you please help me in this ?

stencilsMap.add("", myDiagram.nodeTemplate);
myDiagram.nodeTemplateMap = stencilsMap;
im using for myDiagram

LinkTemplate

myDiagram.linkTemplate =
    $(go.Link,
      {
        routing: go.Link.AvoidsNodes,
 corner: 5,  // with rounded corners
        curve: go.Link.JumpOver,
        relinkableFrom: true, relinkableTo: true,
        reshapable: true,
        resegmentable: true,
      },    // little "hops" in the path of an orthogonal link that crosses another orthogonal link
      new go.Binding("points").makeTwoWay(),
      $(go.Shape,  // the link's path shape
        { isPanelMain: true, stroke: "transparent" },
        new go.Binding("pathPattern", "patt", convertPathPatternToShape),
        new go.Binding("stroke", "color"),  // shape.stroke = data.color
        new go.Binding("strokeWidth", "thick"),// shape.strokeWidth = data.thick
        new go.Binding("fill", "fill"),
        new go.Binding("isPanelMain", "isPanelMain"),
      ),
      $(go.Shape,
        { toArrow: "" }, { isPanelMain: true },
        new go.Binding("toArrow", "toArrow"),  // shape.stroke = data.color 
        new go.Binding("angle", "angle"),
        new go.Binding("strokeWidth", "thick"),
        new go.Binding("fill", "fill"),
        new go.Binding("stroke", "color")
      ),
    );

You must be using at least one Node template, because your screenshots are clearly not showing the default node template but something custom for your app.

What is the problem with having 14 JavaScript Objects holding “text” property values? If there is any possibility that two different instances of nodes using the same template might appear differently (i.e. have different numbers of ports or different properties for each port), then you’ll need to have the data be different too, so that data could not be shared.

thanks Walter got you and i shared linkTemplate and nodeTemplate wat i use today for diagram
can you please tell me where to add that property?

Yes, as I demonstrated when I first mentioned that property:

but i don’t have nodeTemplate for mydiagram where should i add that property is my question.

Your screenshot shows that you have either set Diagram.nodeTemplate or you have set Diagram.nodeTemplateMap or modified that nodeTemplateMap by adding node templates.

So you definitely have at least one node template that you have defined. Just set that property on that Node template.

it is taking Default nodeTemplate. can you please tell me how to add that property to default myDiagram.nodeTemplate.
this is what im using , im appending default nodeTemplate for map object.and that map object im giving to nodeTemplateMap.
// for the default category, “”, use the same template that Diagrams use by default; this just shows the key value as a simple TextBlock

  stencilsMap.add("", myDiagram.nodeTemplate);
 myDiagram.nodeTemplateMap = stencilsMap;

Ah, OK, if you don’t mind modifying the node template that is used by the main Diagram, just set that property on that template.