Table is not getting aligned to left


These are the screenshot of the table row in two different screen size and even after setting the defaultAlignment of the table panel to left ,then also table is getting aligned to center.

this.nodeTemplate = $(go.Node, 'Vertical', { selectionAdorned: false, height: 40 }, 
$(go.Panel, 'Table',
        { 
          defaultAlignment: go.Spot.Left,
          margin: new go.Margin(8, 0, 8, 0),
          background:'red'
        },
        $(go.Panel, 'TableRow', { row: 0},
          $(go.TextBlock,
            {
              column:0,
              width:200,
              font: '1rem verdana', stroke: '#000000',
              maxLines: 1, overflow: go.TextBlock.OverflowEllipsis,
              background:'green',
              alignment: go.Spot.LeftCenter
            },
            new go.Binding('text', 'columnName'),
          ),
          $(go.TextBlock,
            {
              width:200,
              column:1,
              font: '1.1rem verdana', stroke: '#000000',
              background: 'pink',
              alignment: go.Spot.LeftCenter
            },
            new go.Binding('text', 'ProductCount'),
          )
        )
      ));
}

I want the table to align to left.

Setting Panel.defaultAlignment establishes the default alignment for each element of the panel. Because the panel is a “Table” Panel, that means each element in its cell.

You then set each TextBlock’s alignment to the same spot, but that is just redundant. Each text is clearly left aligned.

It might be useful to set alignment on that whole “Table” Panel, because the default alignment for elements of a “Vertical” Panel is Center. But because the “Table” Panel is the only element of a “Vertical” Panel, it doesn’t matter – there is nothing else for it to be aligned with.

Is your question really asking about the position of the Node in the viewport? Not about the interior of the Node? If so, then you want to set either Diagram.initialContentAlignment or contentAlignment to go.Spot.Left, depending if you just want such an alignment initially upon loading the model, or always.

Thanks, it worked