Picture as node background without affecting node size

I am using what is in essence an adaption of the “dynamic ports” sample, where the size of a Table-type node is determined by the number of ports in its left and right side port arrays.

I want to add a Picture as background on the nodes. I am using a Spot panel to position a RoundedRectangle and the background icon image inside the BODY panel.

I have gotten as far as the image below. My problem is that when the number of ports is small the background image causes the Spot Panel (which I have given a gray background) with the image to be too large for the number of ports. I have outlined the undesired area in red below. The faint grey icon is the background picture, which is here causing the node to grow too high for just two ports. I want the node to be the size of the RoundedRectangle.

I can constrain the panel and have it clip the background picture, but then the clipping is to a fixed height. I want the icon image to be able to grow to its full height when the node has many ports, as can be seen on the two larger nodes.

What I am looking for is either:

A way for the background image Panel to not affect the size of the node, but I have not been able to figure out how to do that.

Alternatively, with the background in a clipped Spot Panel, but again I have not been able to figure a way to make the clipping rectangle follow the size of the node (when the size of the node is dynamically stretched to the height of the left/right port panels).

An “Auto” Panel with a constrained size will clip its elements.
Here’s what I just tried:

    myDiagram.nodeTemplate =
      $(go.Node, "Auto",
        // this could be your Picture instead:
        $(go.Shape, "Ellipse",
          { fill: "lightgray", width: 30, height: 60, alignment: go.Spot.Top, margin: 3 }),
        $(go.Panel, "Auto",
          // so that the panel is in front of the Shape/Picture
          { isPanelMain: true, width: 80 },
          new go.Binding("height"),
          $(go.Shape,  // the border shape
            { fill: "transparent", strokeWidth: 3 },
            new go.Binding("stroke", "color")),
          $(go.TextBlock,
            { margin: 8, editable: true },
            new go.Binding("text").makeTwoWay())
        )
      );

    myDiagram.model = new go.GraphLinksModel(
    [
      { key: 1, text: "Alpha", color: "lightblue", height: 100 },
      { key: 2, text: "Beta", color: "orange", height: 150 }
    ],
    [
      { from: 1, to: 2 }
    ]);

Substitute your Picture for the first Shape. The result:
image

Ah, that was a revelation! Going back to the docs I see it is described like so, but only using a text example, which is a more fluid thing than a Picture, which is why I didn’t catch it when searching for info. Maybe put some text in that paragraph that mention “image clipping or cropping” would make it more googlable?