How to change PanelExpanderButton?

GoJS
1 
public ngAfterViewInit() {
    createCustomButton()
}
public createCustomButton() {
    go.GraphObject.defineBuilder("PanelExpanderButton", function(args) {
      var eltname = /** @type {string} */ (go.GraphObject.takeBuilderArgument(args, "COLLAPSIBLE"));

      var button = /** @type {Panel} */ (
        go.GraphObject.make("Button",
          { // set these values for the visible binding conversion
            "_buttonExpandedFigure": "MinusLine",
            "_buttonCollapsedFigure": "PlusLine"
          },
          go.GraphObject.make(go.Shape, "PlusLine",
                              { name: "ButtonIcon", desiredSize: new go.Size(6, 4) },
                              new go.Binding("figure", "visible",
                                             function(vis) { return vis ? button["_buttonExpandedFigure"] : button["_buttonCollapsedFigure"]; })
                                  .ofObject(eltname)))
      );

      var border = button.findObject("ButtonBorder");
      if (border instanceof go.Shape) {
        border.stroke = null;
        border.fill = "transparent";
      }

      button.click = function(e, button) {
        var diagram = button.diagram;
        if (diagram === null) return;
        if (diagram.isReadOnly) return;
        var elt = button.findTemplateBinder();
        if (elt === null) elt = button.part;
        if (elt !== null) {
          var pan = elt.findObject(eltname);
          if (pan !== null) {
            diagram.startTransaction('Collapse/Expand Panel');
            pan.visible = !pan.visible;
            diagram.commitTransaction('Collapse/Expand Panel');
          }
        }
      }

      return button;
    });


    //return button;
  }```

i have tried above one used it not showing any effect

following the below giving blackscreen in place of button
$(“PanelExpanderButton”, “LIST”, // the name of the element whose visibility this button toggles
{ row: 0,
“_buttonExpandedFigure”: “MinusLine”,
“_buttonCollapsedFigure”: “PlusLine”
alignment: go.Spot.TopRight })```

2

The “PanelExpanderButton” is predefined, so you don’t need to redefine it.

3

if giving the custombuttonName getting the error

go.GraphObject.defineBuilder("PanelExpanderButton2", function(args)

and using
 $("PanelExpanderButton2", "COLLAPSIBLE",  // the name of the element whose visibility this button toggles
      { row: 0,
        alignment: go.Spot.TopRight,
        "ButtonIcon.stroke": "#262626"
       })

core.js:6185 ERROR Error: GraphObject.make requires a class function or GoJS class name or name of an object builder, not: PanelExpanderButton2

4

Which version of go.d.ts are you using?

5

/**
Type definitions for GoJS v2.1.16
* Gets the current GoJS version.
* @since 2.0
*/

6

I just tried compiling this, and it compiled without any complaints:

import * as go from "gojs";

go.GraphObject.defineBuilder("B", function(args) {
  return go.GraphObject.make(go.Shape, "Circle", { fill: "red", width: 20, height: 20 });
})

export function f() {
  const $ = go.GraphObject.make;

  const panel =
    $(go.Panel, "Auto",
      $(go.Shape, { fill: "lightgreen" }),
      $("B", { width: 120, height: 120 })
    );

  return panel;
}

So I cannot explain why you are getting compile errors.

7

solution: move the code to **oninit **in angular