Draw a rounded triangle through Parameter1

GoJS
1

I want to draw a triangle that controls rounded corners by Parameter1, but I don’t know how to draw it

  const geo = new go.Geometry().add(
    new go.PathFigure(0.05 * w, h, true)
      .add(new go.PathSegment(go.PathSegment.Bezier, 0.1 * w, 0.8 * h, 0, h, 0, h))
      .add(new go.PathSegment(go.PathSegment.Line, 0.45 * w, 0.1 * h))
      .add(new go.PathSegment(go.PathSegment.Bezier, 0.55 * w, 0.1 * h, 0.5 * w, 0, 0.5 * w, 0))
      .add(new go.PathSegment(go.PathSegment.Line, 0.95 * w, 0.9 * h))
      .add(new go.PathSegment(go.PathSegment.Bezier, 0.9 * w, h, w, h, w, h))
      .add(new go.PathSegment(go.PathSegment.Line, 0.05 * w, h))
  )
2

That’s the right idea.

  go.Shape.defineFigureGenerator("RoundedTriangle", function(shape, w, h) {
    var p = shape ? shape.parameter1 : NaN;
    if (isNaN(p) || p < 0) p = 20;
    p = Math.min(p, w/2);
    p = Math.min(p, h/2);
    return new go.Geometry().add(
        new go.PathFigure(p, h, true)
          .add(new go.PathSegment(go.PathSegment.Bezier, p/2, h-p, 0, h, 0, h))  // this works
          .add(new go.PathSegment(go.PathSegment.Line, w/2-p/2, p))
          .add(new go.PathSegment(go.PathSegment.Bezier, w/2+p/2, p, w/2, 0, w/2, 0))
          .add(new go.PathSegment(go.PathSegment.Line, w-p/2, h - p))
          .add(new go.PathSegment(go.PathSegment.Bezier, w-p, h, w, h, w, h).close()));
  });

And then use it:

    myDiagram.nodeTemplate =
      $(go.Node, "Auto",
        { width: 100, height: 100 },
        $(go.Shape, "RoundedTriangle",
          { fill: "white", portId: "" },
          new go.Binding("fill", "color"),
          new go.Binding("parameter1", "corner")),
        $(go.TextBlock,
          { alignment: new go.Spot(0.5, 0.75) },
          new go.Binding("text"))
      );

With data such as:

    myDiagram.model = new go.GraphLinksModel(
    [
      { key: 1, text: "Alpha", color: "lightblue" },
      { key: 2, text: "Beta", color: "orange", corner: 5 },
      { key: 3, text: "Gamma", color: "lightgreen", corner: 10 },
      { key: 4, text: "Delta", color: "pink", corner: 60 }
    ],
    [
      { from: 1, to: 2 },
      { from: 1, to: 3 },
      { from: 2, to: 2 },
      { from: 3, to: 4 },
      { from: 4, to: 1 }
    ]);

The result is:
image