Chart Layout Options

interface ChartLayoutOptions {
    axis?: {
        cross?: ChartAxisOptions;
        index?: ChartAxisOptions;
    };
    beginAtZero?: boolean;
    centerX?: number;
    centerY?: number;
    children?: Widget[];
    dateFormatOptions?: DateTimeFormatOptions;
    edgeOffset?: boolean;
    gridAlign?: boolean;
    gridColor?: Color;
    gridWidth?: number;
    indexAxis?: "x" | "y";
    indexIntervalUnit?: DateTimeUnit;
    indexType?: "number" | "label" | "date";
    layout?: ChartLayout;
    progress?: number;
    size?: {
        height: number;
        width: number;
    };
    style?: WidgetStyle;
    suggestedMax?: number | DateTime<boolean>;
    suggestedMin?: number | DateTime<boolean>;
    x?: number;
    y?: number;
}

Hierarchy

  • BaseChartOptions
    • ChartLayoutOptions

Properties

axis?: {
    cross?: ChartAxisOptions;
    index?: ChartAxisOptions;
}

Type declaration

  • Optional cross?: ChartAxisOptions

    Description

    cross is an object that defines the options of the cross-axis in the chart.

  • Optional index?: ChartAxisOptions

    Description

    index is an object that defines the options of the index-axis in the chart.

Description

axis is an object that defines the options of the axes in the chart.

beginAtZero?: boolean

Description

beginAtZero is a boolean that represents whether the axis begins at zero. It is optional. If not provided, the beginAtZero will be true.

centerX?: number
centerY?: number
children?: Widget[]
dateFormatOptions?: DateTimeFormatOptions

Description

dateFormatOptions is an object that defines the options of the date time format.

edgeOffset?: boolean

Description

edgeOffset is a boolean that represents whether the chart has an edge offset which is half of the interval. It is optional. If not provided, the edgeOffset will be false when gridAlign is true and true when gridAlign is false.

gridAlign?: boolean

Description

gridAlign is a boolean that represents whether the grid labels are aligned with the grid or line&ticks. It is optional. If not provided, the gridAlign will be true for BarChart and false for other types.

gridColor?: Color

Description

gridColor is a color that represents the color of the grid lines. It is optional. If not provided, the gridColor will be Color.WHITE.

gridWidth?: number

Description

gridWidth is a number that represents the width of the grid lines. It is optional. If not provided, the gridWidth will be 1.

indexAxis?: "x" | "y"

Description

indexAxis is a string that represents the index-axis of the chart. It is optional. If not provided, the index-axis will be 'x'.

indexIntervalUnit?: DateTimeUnit

Description

indexIntervalUnit is a string that represents the interval unit of the index-axis. To be noted that the indexIntervalUnit only works when the indexType is 'date'. It is optional. If not provided, the indexIntervalUnit will be generated automatically.

indexType?: "number" | "label" | "date"

Description

indexType is a string that represents the type of the index-axis. To be noted that the indexType can't be mixed in a chart. It is optional. If not provided, the indexType will be 'label' when labels are provided as strings, 'date' when labels are provided as DateTimes or ChartDataUnit#isIndexDate are DateTimes. and 'number' when ChartDataUnit#isIndexDate are not DateTimes.

layout?: ChartLayout

Description

layout is an object that defines the layout of the chart. To be noted that when the layout is provided, the size of the chart will be ignored, and the layout will be used to calculate the size. What's more, the layout won't be added as child of the chart, which means the layout should be added to the scene manually. It is optional. If not provided, the layout will be generated automatically.

progress?: number
size?: {
    height: number;
    width: number;
}

Type declaration

  • height: number

    Description

    height is a number that represents the height of the chart. To be noted that the height is the height of chart layout (excluding label, legend, etc.).

  • width: number

    Description

    width is a number that represents the width of the chart. To be noted that the width is the width of chart layout (excluding label, legend, etc.).

Description

size is an object that defines the size of the chart. It is optional. If not provided, the size will be { width:300, height: 300 } as default.

style?: WidgetStyle
suggestedMax?: number | DateTime<boolean>

Description

suggestedMax is a number that represents the suggested maximum value of the axis. If no data above the suggestedMax, the axis will end at the suggestedMax. It is optional. If not provided, the suggestedMax will be undefined.

suggestedMin?: number | DateTime<boolean>

Description

suggestedMin is a number that represents the suggested minimum value of the axis. If no data below the suggestedMin, the axis will begin at the suggestedMin. It is optional. If not provided, the suggestedMin will be 0 when beginAtZero is true and undefined when beginAtZero is false.

x?: number
y?: number