Skip to main content Link Menu Expand (external link) Document Search Copy Copied

domain

Specify all options related to the domain configuration

type DomainOptions: {
  type: string;
  gutter: number;
  padding: [number, number, number, number];
  dynamicDimension: boolean;
  label: LabelOptions;
  subLabel: SubLabelOptions;
  sort: 'asc' | 'desc';
}

type

Domain’s type, representing a time unit

type: string;

Default: hour

Available default domains type

  • year
  • month
  • week
  • day
  • hour

See Examples

gutter

Space between each domain, in pixel

gutter: number;

Default: 4

Playground

padding

Padding inside each domain, in pixel

padding: [number, number, number, number];

Expect an array of 4 numbers, in the same order as CSS padding property (top, right, bottom, left)

Default: [0, 0, 0, 0]

Playground




dynamicDimension

Whether the domain’s should be resized to fit its content.

dynamicDimension: boolean;

The domain dimension depends on the chosen subDomain type, which each have a different number of columns and rows count.

Some of the subDomain type, such as day, do not have a fixed number of items, as there can be 28, 29, 30 or 31 days in a month.

This leads to different domains having different sizes, and may cause the calendar total dimension to change on navigation.

When disabled, the domains will all take the same maximum size as defined by the subDomain template, and some blank space may appear between domains.

Usually, only either the width or the height will by dynamic.

Default: true

Playground


When set to true, notice how the calendar may resize on navigation

When set to false, notice how the calendar never resize on navigation, 
but some white space may appear between the domains

label

Specify all options related to the domain’s label

label: LabelOptions;

See the Domain Label section

sort

Sort order of the domains.

sort: 'asc' | 'desc';

Default: asc

This only affect the domain’s order, not the subDomain.

Playground

Toggle sort order

Table of contents