Make text always in middle of textblock (resizable)

GoJS
1

i am new learner. i am trying to make text always in middle.
But it make center either by vertical.
` myDiagram.add(
$(go.Node, “Horizontal”, {resizable: true, resizeObjectName: “textBox”, rotatable: true, },
{ // the Node.location point will be at the center of each node
alignment: go.Spot.Center
},
$(go.TextBlock, { text: “verticalAlignment: Center”, textAlign: “center”,
width: 170, height: 60, background: “lightgreen”, margin: 10,editable:true }),

));   `

please help me to make text always on middle.

2

Depending on your requirements, there are several ways to achieve that. This is one way:

    myDiagram.nodeTemplate =
      $(go.Node, "Spot",
        { resizable: true },
        new go.Binding("desiredSize", "size", go.Size.parse).makeTwoWay(go.Size.stringify),
        $(go.Shape,
          { fill: "lightyellow" },
          new go.Binding("fill", "color")),
        $(go.TextBlock,
          { editable: true },
          new go.Binding("text").makeTwoWay())
      );

This works because the default GraphObject.alignment for “Spot” Panels is Center.

You could also set TextBlock.textAlign to "center", if you prefer. That is quite independent of everything else.

Another way is to also set TextBlock.verticalAlignment to go.Spot.Center. But that is not necessary when using Panel layout to ensure that the TextBlock is centered. It depends on what it is that should have the text centered in it.

3

i tried with “Horizontal” , “Vertical”, “Auto” but i dont know about Spot. also i add Shape Thank you very much walter finally it worked.

` myDiagram.add(
$(go.Node, “Spot”, {resizable: true, resizeObjectName: “textBox”, rotatable: true, },

  $(go.Shape,
      { fill: "lightyellow" },
      new go.Binding("fill", "color")),
  $(go.TextBlock, { text: "textBox",
                            margin: 5,
                            textAlign: "center",
                            editable: true,
                            font: "bold 12pt Helvetica, Arial, sans-serif",
                            stroke: '#454545' },
   new go.Binding("desiredSize", "size", go.Size.parse).makeTwoWay(go.Size.stringify),
                        new go.Binding("text").makeTwoWay()
 )
));`
4

It’s important to be familiar with what GoJS can do. You might want to read GoJS Panels -- Northwoods Software and GoJS Table Panels -- Northwoods Software.

I suggest you read all of the pages of the Introduction, starting with GoJS Introduction -- Northwoods Software, that apply to the kind of web app that you want to build.