BPMN Workflow sample -> Palette parts are not left aligned

GoJS
1

I implemented a custom palette to show Custom Objects as Data Object but as shown in below screenshot I see lot of empty space on left side. I am not able to figure out what is the issue here

I tried setting contentAlignment and locationSpot to left and also float:left in css for div element

Below is the Palette and nodeTemplate code

		goObj(go.Palette, "myDiv",
		{ 
			// share the templates with the main Diagram
			nodeTemplateMap: _this.palNodeTemplateMap,
			groupTemplateMap: _this.palGroupTemplateMap,
			contentAlignment:go.Spot.Left,
			layout: goObj(go.GridLayout,
                {
					cellSize: new go.Size(1, 1),
					spacing: new go.Size(5, 5),
					comparer: _this.keyCompare
                })
    });

Node Template

let dataObjectNodeTemplate:any =
goObj(go.Node, “Vertical”,
{ locationObjectName: “SHAPE”, locationSpot: go.Spot.Left },
new go.Binding(“location”, “loc”, go.Point.parse).makeTwoWay(go.Point.stringify),
goObj(go.Shape, “File”,
{
name: “SHAPE”, portId: “”, fromLinkable: true, toLinkable: true, cursor: “pointer”,
fill: _this.DataFill, desiredSize: new go.Size(_this.EventNodeSize * 0.8, _this.EventNodeSize)
}
),
goObj(go.TextBlock,
{ margin: 2, editable: true,font:_this.defaultFont },
new go.Binding(“text”).makeTwoWay()
)
);

image.png290×560 13.1 KB

2

First, use your browser’s inspector to see whether the HTML DIV Element really does occupy that area on the left side of the window.

If the DIV is indeed as wide as you thought, then maybe there are one or more nodes with really wide text labels, further down in the document. Would you want that text to be cut off by the edge of the window?

3

Thanks for explaining the issue. DIV has no issue. As you mentioned issue is with text size.