Coordinate Card

This layout offers an absolute layout design structure.

This is the default card layout when you start to design application pages. You can drag and drop plug-in objects to an absolute position on the card. The end application reflects the same as in the coordinate card page design.
Field Name Description
Columns The card occupies the specified number of columns on the page grid.
Rows The card occupies the specified number of rows on the page grid.
Position X Applies to the horizontal placement of the card on the page. When the value is 0, the card is placed on the left-most side of the page. As you increase the value, the card moves away from the left side of the page.
Position Y Applies to the vertical placement of the card on the page. When the value is 0, the card is placed at the top of the page. As you increase the value, the card moves away from the top of the page.
Layout Type Choose from the following card layouts before starting to design your pages:
  • Coordinate: Objects dropped on this layout stay where they are on the page.
  • Flexbox: Objects dropped on this layout are automatically arranged on a single line. See Flexbox Card.
Style Select these check boxes to format the objects:
  • Rounded Corners: Adds a rounded corner instead of a pointed corner.
  • Custom Colors: Adds color.
Function Layout functionalities:
  • Card: This is the regular flexbox layout option without any additional functionalities.
  • Interactive Map: This flexbox layout includes an interactive map functionality. See Interactive Map.
scale Line Connector Scale Line Connectors checkbox option: - We need to set 'Scale Line' connector option at card level and with this setting the line connector will work similar to %. All the other plugins that are connected using line connector needs to be in % when user is expecting to scale based on br*oswer page dynamic height and width changes.
Show/Hide Select +Add Conditions to create conditions to show or hide the card.

Scroll bars will display for the card when card size is smaller than the plugin size.

Value display: - In new designer, Height & width will consider from widget properties not from the plugin manifest/properties (Height & Width).

Breadcrumb: - Breadcrumb combination with any other plugins used in coordinated layout , should follow the higher z-index properties than breadcrumb. ( Ex: Set the Breadcrumb z-index '0' and Alarm Card/Trend card should be z-index '1' )