Drawing links from one node to another

GoJS
1

I have the following node template

    myDiagram.nodeTemplate =
        $$(go.Part, "Spot", // the whole node panel
            new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),       
            $$(go.Panel, go.Panel.Spot,
                $$(go.Panel, go.Panel.Auto,
                    $$(go.Shape,
                        {
                            name: "PANEL",
                            strokeWidth: 4,
                            stroke: null,
                            fill: null,
                            portId: "",
                            fromLinkable: true,
                            fromLinkableSelfNode: false,
                            fromLinkableDuplicates: true,
                            toLinkable: true,
                            toLinkableSelfNode: true,
                            toLinkableDuplicates: true
                        },
                        new go.Binding("fill", "white")),
                    $$(go.Picture,
                        { desiredSize: new go.Size(24, 24), margin: 3 },
                        new go.Binding("source", "imageUrl")))),
            makePort("T", go.Spot.Top, false, true),
            makePort("L", go.Spot.Left, true, true),
            makePort("R", go.Spot.Right, true, true),
            makePort("B", go.Spot.Bottom, true, false));

And this is the link template

    myDiagram.linkTemplate =
        $$(go.Link,
            { relinkableFrom: true, relinkableTo: true }, // allow the user to relink existing links
            $$(go.Shape,
                { strokeWidth: 2 },
                new go.Binding("stroke", "color")),
            $$(go.Shape,
                { toArrow: "Standard", stroke: null },
                new go.Binding("fill", "color")));

I am able to get my cursor to change when I hover over the circular ports (shown in the attached picture)

However, when I try to drag it to connect to another node, nothing happens. Am I missing something?

Additional code:

This is the fuction that I use to set the background image (if it matters)

    function SetBackground(path) {
        myDiagram.add(
            $$(go.Part,
                { layerName: "Background", position: new go.Point(0, 0), selectable: false, pickable: false },
                $$(go.Picture, path)));
    }
2

I have recorded a screencast to illustrated my point

3

I’m not certain, but eyeballing this:

myDiagram.nodeTemplate =
$$(go.Part,

Your node template is in fact a Part and not a Node. Parts cannot have ports or connected links, so I imagine this is why you cannot use the “ports” you created as ports. Try changing it to a Node.

4

Yes, that was the problem, thanks!