swimlane header issue

[Behnam Norouzi]

Hi guys, I have trying to change swimlane header size but I encounter  this shape, and i should mention i have changed the size in the palette and [dargEnter]=onDrop() function.
Thanks
Behnam 

 

    const swimlaneShapes: NodeModel[] = [

            {

                id: "Horizontalswimlane",

                addInfo: {

                    tooltip: this.translatePipe.transform("PROCESSES.FLOWCHART.HORIZONTAL_SWIMLANE"),

                },

                shape: {

                    type: "SwimLane",                  

                    lanes: [

                        {

                            id: "lane1",

                            style: { strokeColor: "black" },

                            height: 180,

                            width: 1100,

                            header: {

                                width: 50,

                                height: 20,

                                style: { strokeColor: "#757575", fontSize: 11,},

                            },                          

                        },                      

                    ],

                    orientation: "Horizontal",

                    isLane: true,

                    },

                height: 60,

                width: 140,

                offsetX: 70,

                offsetY:30,

            },

public onDrop(args: any): void {

        if (args.element) {

      if (args.element.shape.header?.height) {

                    args.element.shape.header.height = 20;

                    args.element.shape.phaseSize=0.001;

[Balasubramanian Manikandan]

Use the CollectionChange event for dynamically modifying the header and phase height in the swimlane. To avoid repetitive triggering of the collection change event, verify the type as "Addition" prior to adjusting the height. Please refer to the code example and sample below.

Code Snippet

public collectionChange(arg : ICollectionChangeEventArgs): void{

    if(arg.type === "Addition"){

        if (arg.element.shape.type === 'SwimLane') {

            (arg.element.shape as any).header.height = 10;

            (arg.element.shape as any).phaseSize = 0;

            this.diagram.dataBind();

        }

    }

  }

Sample

https://stackblitz.com/edit/angular-w3uerm?file=src%2Fapp.component.ts,src%2Fapp.component.html

[Behnam Norouzi]

Thanks, it works.

[Preethi Rajakandham]

Hi Behnam Norouzi,

You're welcome. We are glad to know that the reported problem has been resolved at your end. Please let us know if you have any further queries on this. We are happy to help.

Regards,

Preethi R