Polotno
Design Format

TableElement

Documentation for the TableElement type in the Polotno design JSON Schema.

Type Information

Base Type: object

Properties

PropertyTypeDescription
idstringUnique identifier for the element.
type"table"Element type identifier.
namestringDisplay name for the element.
customunknownCustom data attached to the element.
xnumberX position in pixels.
ynumberY position in pixels.
widthnumberWidth in pixels.
heightnumberHeight in pixels.
rotationnumberRotation angle in degrees.
opacitynumberOpacity level (0-1).
animationsArray<Animation>Animation configurations.
visiblebooleanWhether the element is visible.
draggablebooleanWhether the element can be dragged.
resizablebooleanWhether the element can be resized.
selectablebooleanWhether the element can be selected.
removablebooleanWhether the element can be removed.
contentEditablebooleanWhether the element content can be edited.
styleEditablebooleanWhether the element style can be edited.
alwaysOnTopbooleanWhether the element stays on top of others.
showInExportbooleanWhether the element appears in exports.
rowsnumberNumber of rows.
colsnumberNumber of columns.
colWidthsArray<number>Column width fractions (sum to 1).
rowHeightsArray<number>Row height fractions (sum to 1).
cellsArray<TableCell>Flat cell array in row-major order.
borderColorstringDefault border color for the table grid.
borderWidthnumberDefault border width in pixels.
borderStyle"solid" | "dashed" | "dotted" | "none"Default border style.
fontSizenumberDefault font size in pixels for cells.
fontFamilystringDefault font family name for cells.
fontWeightstringDefault font weight: 'normal', 'bold', or numeric string.
fontStylestringDefault font style: 'normal' or 'italic'.
textDecorationstringDefault text decoration (e.g. underline, line-through).
textTransformstringDefault text transform: uppercase, lowercase, capitalize, none.
fillstringDefault text color for cells.
alignstringDefault horizontal alignment: left, center, right, justify.
verticalAlignstringDefault vertical alignment: top, middle, bottom.
lineHeightnumber | stringDefault line height multiplier or 'auto'.
letterSpacingnumberDefault letter spacing as a fraction of font size.
strokeWidthnumberDefault stroke width in pixels.
strokestringDefault stroke color.
cellBackgroundstringDefault cell background color.
cellPaddingnumberDefault cell padding in pixels.

JSON Schema

{
  "type": "object",
  "properties": {
    "id": {
      "type": "string",
      "description": "Unique identifier for the element."
    },
    "type": {
      "type": "string",
      "const": "table",
      "description": "Element type identifier."
    },
    "name": {
      "default": "",
      "description": "Display name for the element.",
      "type": "string"
    },
    "custom": {
      "description": "Custom data attached to the element."
    },
    "x": {
      "default": 0,
      "description": "X position in pixels.",
      "type": "number"
    },
    "y": {
      "default": 0,
      "description": "Y position in pixels.",
      "type": "number"
    },
    "width": {
      "default": 300,
      "description": "Width in pixels.",
      "type": "number"
    },
    "height": {
      "default": 200,
      "description": "Height in pixels.",
      "type": "number"
    },
    "rotation": {
      "default": 0,
      "description": "Rotation angle in degrees.",
      "type": "number"
    },
    "opacity": {
      "default": 1,
      "description": "Opacity level (0-1).",
      "type": "number"
    },
    "animations": {
      "default": [],
      "description": "Animation configurations.",
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "delay": {
            "default": 0,
            "description": "Delay before the animation starts, in milliseconds.",
            "type": "number"
          },
          "duration": {
            "default": 500,
            "description": "Animation duration in milliseconds.",
            "type": "number"
          },
          "enabled": {
            "default": true,
            "description": "Whether the animation is enabled.",
            "type": "boolean"
          },
          "type": {
            "type": "string",
            "enum": [
              "enter",
              "exit",
              "loop"
            ],
            "description": "Animation phase."
          },
          "name": {
            "default": "none",
            "description": "Animation name identifier.",
            "type": "string"
          },
          "data": {
            "default": {},
            "description": "Animation-specific data."
          }
        },
        "required": [
          "type"
        ]
      }
    },
    "visible": {
      "default": true,
      "description": "Whether the element is visible.",
      "type": "boolean"
    },
    "draggable": {
      "default": true,
      "description": "Whether the element can be dragged.",
      "type": "boolean"
    },
    "resizable": {
      "default": true,
      "description": "Whether the element can be resized.",
      "type": "boolean"
    },
    "selectable": {
      "default": true,
      "description": "Whether the element can be selected.",
      "type": "boolean"
    },
    "removable": {
      "default": true,
      "description": "Whether the element can be removed.",
      "type": "boolean"
    },
    "contentEditable": {
      "default": true,
      "description": "Whether the element content can be edited.",
      "type": "boolean"
    },
    "styleEditable": {
      "default": true,
      "description": "Whether the element style can be edited.",
      "type": "boolean"
    },
    "alwaysOnTop": {
      "default": false,
      "description": "Whether the element stays on top of others.",
      "type": "boolean"
    },
    "showInExport": {
      "default": true,
      "description": "Whether the element appears in exports.",
      "type": "boolean"
    },
    "rows": {
      "default": 3,
      "description": "Number of rows.",
      "type": "number"
    },
    "cols": {
      "default": 3,
      "description": "Number of columns.",
      "type": "number"
    },
    "colWidths": {
      "default": [],
      "description": "Column width fractions (sum to 1).",
      "type": "array",
      "items": {
        "type": "number"
      }
    },
    "rowHeights": {
      "default": [],
      "description": "Row height fractions (sum to 1).",
      "type": "array",
      "items": {
        "type": "number"
      }
    },
    "cells": {
      "default": [],
      "description": "Flat cell array in row-major order.",
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "id": {
            "type": "string",
            "description": "Unique identifier for the cell."
          },
          "type": {
            "default": "tablecell",
            "description": "Cell type identifier.",
            "type": "string",
            "const": "tablecell"
          },
          "text": {
            "default": "",
            "description": "Visible text shown in the cell.",
            "type": "string"
          },
          "opacity": {
            "description": "Opacity level (0-1).",
            "type": "number"
          },
          "rowSpan": {
            "description": "Number of rows this cell spans.",
            "type": "number"
          },
          "colSpan": {
            "description": "Number of columns this cell spans.",
            "type": "number"
          },
          "mergedInto": {
            "description": "Id of the cell this one is merged into, if any.",
            "type": "string"
          },
          "name": {
            "description": "Display name for the cell.",
            "type": "string"
          },
          "custom": {
            "description": "Custom data attached to the cell."
          },
          "borders": {
            "description": "Per-side border overrides for this cell.",
            "type": "object",
            "properties": {
              "top": {
                "description": "Top border override for this cell.",
                "type": "object",
                "properties": {
                  "color": {
                    "description": "Border color for this side.",
                    "type": "string"
                  },
                  "width": {
                    "description": "Border width in pixels for this side.",
                    "type": "number"
                  },
                  "style": {
                    "description": "Border style for this side.",
                    "type": "string",
                    "enum": [
                      "solid",
                      "dashed",
                      "dotted",
                      "none"
                    ]
                  }
                }
              },
              "right": {
                "description": "Right border override for this cell.",
                "type": "object",
                "properties": {
                  "color": {
                    "description": "Border color for this side.",
                    "type": "string"
                  },
                  "width": {
                    "description": "Border width in pixels for this side.",
                    "type": "number"
                  },
                  "style": {
                    "description": "Border style for this side.",
                    "type": "string",
                    "enum": [
                      "solid",
                      "dashed",
                      "dotted",
                      "none"
                    ]
                  }
                }
              },
              "bottom": {
                "description": "Bottom border override for this cell.",
                "type": "object",
                "properties": {
                  "color": {
                    "description": "Border color for this side.",
                    "type": "string"
                  },
                  "width": {
                    "description": "Border width in pixels for this side.",
                    "type": "number"
                  },
                  "style": {
                    "description": "Border style for this side.",
                    "type": "string",
                    "enum": [
                      "solid",
                      "dashed",
                      "dotted",
                      "none"
                    ]
                  }
                }
              },
              "left": {
                "description": "Left border override for this cell.",
                "type": "object",
                "properties": {
                  "color": {
                    "description": "Border color for this side.",
                    "type": "string"
                  },
                  "width": {
                    "description": "Border width in pixels for this side.",
                    "type": "number"
                  },
                  "style": {
                    "description": "Border style for this side.",
                    "type": "string",
                    "enum": [
                      "solid",
                      "dashed",
                      "dotted",
                      "none"
                    ]
                  }
                }
              }
            }
          },
          "fontSize": {
            "description": "Font size in pixels (inherits from the table when omitted).",
            "type": "number"
          },
          "fontFamily": {
            "description": "Font family name (inherits from the table when omitted).",
            "type": "string"
          },
          "fontWeight": {
            "description": "Font weight: 'normal', 'bold', or numeric string (inherits from the table when omitted).",
            "type": "string"
          },
          "fontStyle": {
            "description": "Font style: 'normal' or 'italic' (inherits from the table when omitted).",
            "type": "string"
          },
          "textDecoration": {
            "description": "Text decoration, e.g. underline, line-through (inherits from the table when omitted).",
            "type": "string"
          },
          "textTransform": {
            "description": "Text transform: uppercase, lowercase, capitalize, none (inherits from the table when omitted).",
            "type": "string"
          },
          "fill": {
            "description": "Text color (inherits from the table when omitted).",
            "type": "string"
          },
          "align": {
            "description": "Horizontal alignment: left, center, right, justify (inherits from the table when omitted).",
            "type": "string"
          },
          "verticalAlign": {
            "description": "Vertical alignment: top, middle, bottom (inherits from the table when omitted).",
            "type": "string"
          },
          "lineHeight": {
            "description": "Line height multiplier or 'auto' (inherits from the table when omitted).",
            "anyOf": [
              {
                "type": "number"
              },
              {
                "type": "string"
              }
            ]
          },
          "letterSpacing": {
            "description": "Letter spacing as a fraction of font size (inherits from the table when omitted).",
            "type": "number"
          },
          "strokeWidth": {
            "description": "Stroke width in pixels (inherits from the table when omitted).",
            "type": "number"
          },
          "stroke": {
            "description": "Stroke color (inherits from the table when omitted).",
            "type": "string"
          },
          "cellBackground": {
            "description": "Cell background color (inherits from the table when omitted).",
            "type": "string"
          },
          "cellPadding": {
            "description": "Cell padding in pixels (inherits from the table when omitted).",
            "type": "number"
          }
        },
        "required": [
          "id"
        ]
      }
    },
    "borderColor": {
      "default": "#000000",
      "description": "Default border color for the table grid.",
      "type": "string"
    },
    "borderWidth": {
      "default": 1,
      "description": "Default border width in pixels.",
      "type": "number"
    },
    "borderStyle": {
      "default": "solid",
      "description": "Default border style.",
      "type": "string",
      "enum": [
        "solid",
        "dashed",
        "dotted",
        "none"
      ]
    },
    "fontSize": {
      "default": 30,
      "description": "Default font size in pixels for cells.",
      "type": "number"
    },
    "fontFamily": {
      "default": "Roboto",
      "description": "Default font family name for cells.",
      "type": "string"
    },
    "fontWeight": {
      "default": "normal",
      "description": "Default font weight: 'normal', 'bold', or numeric string.",
      "type": "string"
    },
    "fontStyle": {
      "default": "normal",
      "description": "Default font style: 'normal' or 'italic'.",
      "type": "string"
    },
    "textDecoration": {
      "default": "",
      "description": "Default text decoration (e.g. underline, line-through).",
      "type": "string"
    },
    "textTransform": {
      "default": "none",
      "description": "Default text transform: uppercase, lowercase, capitalize, none.",
      "type": "string"
    },
    "fill": {
      "default": "black",
      "description": "Default text color for cells.",
      "type": "string"
    },
    "align": {
      "default": "center",
      "description": "Default horizontal alignment: left, center, right, justify.",
      "type": "string"
    },
    "verticalAlign": {
      "default": "middle",
      "description": "Default vertical alignment: top, middle, bottom.",
      "type": "string"
    },
    "lineHeight": {
      "default": 1.2,
      "description": "Default line height multiplier or 'auto'.",
      "anyOf": [
        {
          "type": "number"
        },
        {
          "type": "string"
        }
      ]
    },
    "letterSpacing": {
      "default": 0,
      "description": "Default letter spacing as a fraction of font size.",
      "type": "number"
    },
    "strokeWidth": {
      "default": 0,
      "description": "Default stroke width in pixels.",
      "type": "number"
    },
    "stroke": {
      "default": "black",
      "description": "Default stroke color.",
      "type": "string"
    },
    "cellBackground": {
      "default": "transparent",
      "description": "Default cell background color.",
      "type": "string"
    },
    "cellPadding": {
      "default": 4,
      "description": "Default cell padding in pixels.",
      "type": "number"
    }
  },
  "required": [
    "id",
    "type"
  ]
}

On this page