Links not getting added in straight line, how to do it?

Hi i have a flow in which when i connect two nodes i am not getting the links in straight line as shown below, but i want these links to be in straight line automatically as shown below. pl let me know how to do it?

Tell me more about how nodes are located. If users drag the nodes to where they want them to be, perhaps you want to turn on grid snapping in order to encourage aligning the nodes. GoJS Grid Patterns -- Northwoods Software

Hi, with using the grid layout is there a way to align nodes when user drag and drops the node where ever he wants? and even with the grid layout i am not able to align the nodes with straight line…

If you care about aligning nodes based on the connected links, GridLayout might not be the best layout for you.

If users are manually positioning each node, I suggest that you set Node.locationSpot to go.Spot.Center and Node.locationObjectName to the name of your icon/port. Also set DraggingTool.isGridSnapEnabled to true. For example, when initializing your Diagram:

 myDiagram = $(go.Diagram, "myDiagramDiv",
        $(go.Panel, "Grid",
            { gridCellSize: . . . },
            $(go.Shape, "LineH", { stroke: "lightgray" }),
            $(go.Shape, "LineV", { stroke: "lightgray" }) 
      // support grid snapping when dragging
      "draggingTool.isGridSnapEnabled": true,
      . . .

Read GoJS Grid Patterns -- Northwoods Software, but note that grid patterns need not be visible in order to produce grid-snapping behavior.

In this case the default Diagram.layout will be sufficient – it really does not try to move nodes on their own because it assumes either the user or your code will locate all nodes.

Node doesnt have locationSpot property

locationSpot is on Part, which Node is a subclass of. Part | GoJS API