Grid Size

You can customize the width and the height of the DikeGrid instance.

Grid width

By default, the DikeGrid width is equal to auto. However, you can change this value by providing width's input property.

You can also change this value by providing an Injection Token called GRID_WIDTH.

Grid height

By default, the DikeGrid height is equal to 90vh. However, you can change this value by providing height's input property.

You can also change this value by providing an Injection Token called GRID_HEIGHT.

Changing the DikeGrid size

Let us give the DikeGrid the previous input properties, binding the related properties from the gridProperties object.

grid-structure.component.html

<dike-grid id="grid-structure"
    [width]="gridProperties.width"
    [height]="gridProperties.height">
</dike-grid>

Now, open the Floating Configuration Panel, go to the Size section, type 80% and 90vh for the width and the height, respectively.

Floating Configuration Panel - Size

Changing the DikeGrid size