aws-cdk-lib.aws_quicksight.CfnDashboard.LayoutConfigurationProperty

interface LayoutConfigurationProperty

LanguageType name
.NETAmazon.CDK.AWS.QuickSight.CfnDashboard.LayoutConfigurationProperty
Gogithub.com/aws/aws-cdk-go/awscdk/v2/awsquicksight#CfnDashboard_LayoutConfigurationProperty
Javasoftware.amazon.awscdk.services.quicksight.CfnDashboard.LayoutConfigurationProperty
Pythonaws_cdk.aws_quicksight.CfnDashboard.LayoutConfigurationProperty
TypeScript aws-cdk-lib » aws_quicksight » CfnDashboard » LayoutConfigurationProperty

The configuration that determines what the type of layout will be used on a sheet.

This is a union type structure. For this structure to be valid, only one of the attributes can be defined.

Example

// The code below shows an example of how to instantiate this type.
// The values are placeholders you should change.
import { aws_quicksight as quicksight } from 'aws-cdk-lib';
const layoutConfigurationProperty: quicksight.CfnDashboard.LayoutConfigurationProperty = {
  freeFormLayout: {
    elements: [{
      elementId: 'elementId',
      elementType: 'elementType',
      height: 'height',
      width: 'width',
      xAxisLocation: 'xAxisLocation',
      yAxisLocation: 'yAxisLocation',

      // the properties below are optional
      backgroundStyle: {
        color: 'color',
        visibility: 'visibility',
      },
      borderStyle: {
        color: 'color',
        visibility: 'visibility',
      },
      loadingAnimation: {
        visibility: 'visibility',
      },
      renderingRules: [{
        configurationOverrides: {
          visibility: 'visibility',
        },
        expression: 'expression',
      }],
      selectedBorderStyle: {
        color: 'color',
        visibility: 'visibility',
      },
      visibility: 'visibility',
    }],

    // the properties below are optional
    canvasSizeOptions: {
      screenCanvasSizeOptions: {
        optimizedViewPortWidth: 'optimizedViewPortWidth',
      },
    },
  },
  gridLayout: {
    elements: [{
      columnSpan: 123,
      elementId: 'elementId',
      elementType: 'elementType',
      rowSpan: 123,

      // the properties below are optional
      columnIndex: 123,
      rowIndex: 123,
    }],

    // the properties below are optional
    canvasSizeOptions: {
      screenCanvasSizeOptions: {
        resizeOption: 'resizeOption',

        // the properties below are optional
        optimizedViewPortWidth: 'optimizedViewPortWidth',
      },
    },
  },
  sectionBasedLayout: {
    bodySections: [{
      content: {
        layout: {
          freeFormLayout: {
            elements: [{
              elementId: 'elementId',
              elementType: 'elementType',
              height: 'height',
              width: 'width',
              xAxisLocation: 'xAxisLocation',
              yAxisLocation: 'yAxisLocation',

              // the properties below are optional
              backgroundStyle: {
                color: 'color',
                visibility: 'visibility',
              },
              borderStyle: {
                color: 'color',
                visibility: 'visibility',
              },
              loadingAnimation: {
                visibility: 'visibility',
              },
              renderingRules: [{
                configurationOverrides: {
                  visibility: 'visibility',
                },
                expression: 'expression',
              }],
              selectedBorderStyle: {
                color: 'color',
                visibility: 'visibility',
              },
              visibility: 'visibility',
            }],
          },
        },
      },
      sectionId: 'sectionId',

      // the properties below are optional
      pageBreakConfiguration: {
        after: {
          status: 'status',
        },
      },
      style: {
        height: 'height',
        padding: {
          bottom: 'bottom',
          left: 'left',
          right: 'right',
          top: 'top',
        },
      },
    }],
    canvasSizeOptions: {
      paperCanvasSizeOptions: {
        paperMargin: {
          bottom: 'bottom',
          left: 'left',
          right: 'right',
          top: 'top',
        },
        paperOrientation: 'paperOrientation',
        paperSize: 'paperSize',
      },
    },
    footerSections: [{
      layout: {
        freeFormLayout: {
          elements: [{
            elementId: 'elementId',
            elementType: 'elementType',
            height: 'height',
            width: 'width',
            xAxisLocation: 'xAxisLocation',
            yAxisLocation: 'yAxisLocation',

            // the properties below are optional
            backgroundStyle: {
              color: 'color',
              visibility: 'visibility',
            },
            borderStyle: {
              color: 'color',
              visibility: 'visibility',
            },
            loadingAnimation: {
              visibility: 'visibility',
            },
            renderingRules: [{
              configurationOverrides: {
                visibility: 'visibility',
              },
              expression: 'expression',
            }],
            selectedBorderStyle: {
              color: 'color',
              visibility: 'visibility',
            },
            visibility: 'visibility',
          }],
        },
      },
      sectionId: 'sectionId',

      // the properties below are optional
      style: {
        height: 'height',
        padding: {
          bottom: 'bottom',
          left: 'left',
          right: 'right',
          top: 'top',
        },
      },
    }],
    headerSections: [{
      layout: {
        freeFormLayout: {
          elements: [{
            elementId: 'elementId',
            elementType: 'elementType',
            height: 'height',
            width: 'width',
            xAxisLocation: 'xAxisLocation',
            yAxisLocation: 'yAxisLocation',

            // the properties below are optional
            backgroundStyle: {
              color: 'color',
              visibility: 'visibility',
            },
            borderStyle: {
              color: 'color',
              visibility: 'visibility',
            },
            loadingAnimation: {
              visibility: 'visibility',
            },
            renderingRules: [{
              configurationOverrides: {
                visibility: 'visibility',
              },
              expression: 'expression',
            }],
            selectedBorderStyle: {
              color: 'color',
              visibility: 'visibility',
            },
            visibility: 'visibility',
          }],
        },
      },
      sectionId: 'sectionId',

      // the properties below are optional
      style: {
        height: 'height',
        padding: {
          bottom: 'bottom',
          left: 'left',
          right: 'right',
          top: 'top',
        },
      },
    }],
  },
};

Properties

NameTypeDescription
freeFormLayout?IResolvable | FreeFormLayoutConfigurationPropertyA free-form is optimized for a fixed width and has more control over the exact placement of layout elements.
gridLayout?IResolvable | GridLayoutConfigurationPropertyA type of layout that can be used on a sheet.
sectionBasedLayout?IResolvable | SectionBasedLayoutConfigurationPropertyA section based layout organizes visuals into multiple sections and has customized header, footer and page break.

freeFormLayout?

Type: IResolvable | FreeFormLayoutConfigurationProperty (optional)

A free-form is optimized for a fixed width and has more control over the exact placement of layout elements.


gridLayout?

Type: IResolvable | GridLayoutConfigurationProperty (optional)

A type of layout that can be used on a sheet.

In a grid layout, visuals snap to a grid with standard spacing and alignment. Dashboards are displayed as designed, with options to fit to screen or view at actual size. A grid layout can be configured to behave in one of two ways when the viewport is resized: FIXED or RESPONSIVE .


sectionBasedLayout?

Type: IResolvable | SectionBasedLayoutConfigurationProperty (optional)

A section based layout organizes visuals into multiple sections and has customized header, footer and page break.