Search code examples
javascriptgojs

How to resize gojs button


I have a diagram in gojs that uses groups. Each group has a SubGraphExpanderButton. I want to increase the size of the SubGraphExpanderButton relative to the size of the rest of the graph (Nodes, Links, etc.). How do I do that? I could not find it in the documentation here: https://gojs.net/latest/intro/buttons.html Below is my code for my GroupTemplate:

// define the group template
myDiagram.groupTemplate =
  $(go.Group, "Auto",
    {
        isSubGraphExpanded: false,  // initially, make all groups collapsed 
        layout: $(go.LayeredDigraphLayout,
                  { direction: 0, columnSpacing: 10 }),
        memberAdded: function(grp, part) {
            grp.visible = true;
        },
        memberRemoved: function(grp, part) {
            if (grp.memberParts.count <= 0) grp.visible = false;
        }
    },
    $(go.Shape, "Rectangle", new go.Binding("stroke", "color"),
      { fill: COLOR_WHITE, stroke: COLOR_GRAY, strokeWidth: BORDER_STROKE_WIDTH }
    ),
    $(go.Panel, "Vertical",
      { defaultAlignment: go.Spot.Left, margin: 15 },
      $(go.Panel, "Horizontal",
        { defaultAlignment: go.Spot.Top },
        $("SubGraphExpanderButton", { width:8, height:20 }),
        $(go.TextBlock,
          { font: "Bold 40px Sans-Serif", margin: 4, stroke: COLOR_BLACK },
          new go.Binding("text", "key"))
      ),
      $(go.Placeholder,
        { padding: new go.Margin(0, 10) }
      )
    )
  );

} Currently, the + button is too small Thanks!


Solution

  • Instead of setting the width and height of the button, you could try setting its scale.