Specify the column type as 'image', headerType can be omitted and defaults to 'text'. Other configuration items are as follows (also applicable to type 'video'):

Required Unique identifier of the dimension, corresponding to the field name of the dataset

Required Dimension name, the angle header can be configured to display the dimension name

Format of the dimension value

type FieldFormat = (title: number|string, col:number, row:number, table:PivotTable) => any;

This property takes effect when the dimension serves as a row header and represents the width of the dimension cell. The column width can be specified as a specific number, 'auto', or a percentage like '20%'. If 'auto' is specified, the column width will be adjusted automatically according to the length of the whole column text; If a percentage is specified, the current column width will be adjusted according to the total width of the table;

This property takes effect when the dimension serves as a row header and represents the maximum width of the dimension cell

This property takes effect when the dimension serves as a row header and represents the minimum width of the dimension cell

Header cell style, type declaration:

headerStyle?: IStyleOption | ((styleArg: StylePropertyFunctionArg) => ITextStyleOption);

The type declaration for the callback function argument StylePropertyFunctionArg is as follows:

interface StylePropertyFunctionArg {
  row: number;
  col: number;
  /** Table instance */
  table: TableAPI;
  /** If format exists, the formatted or calculated value */
  value: string;
  /** Original value */
  dataValue: string;
  /** Specific to ProgressBarType, represents the proportion of the current value in the overall data range */
  percentile?: number;
  /** Path information of cell header */
  cellHeaderPaths: ICellHeaderPaths;
}

IStyleOption type structure is as follows:

Header cell icon configuration

  headerIcon?:
    | string
    | ColumnIconOption
    | (string | ColumnIconOption)[]
    | ((args: CellInfo) => string | ColumnIconOption | (string | ColumnIconOption)[]);

ColumnIconOption specific configuration: https://visactor.io/vtable/option/ListTable-columns-text#icon

Description information for header hover, displayed as a tooltip

 description?: string | ((args: CellInfo) => string);

Description information for hover, displayed as a tooltip

Custom rendering function for header cells, you can specify the rendering method for headers. For details, please refer to Basic table custom rendering configuration

Custom layout element definition for header cells, this customization is suitable for cells with complex content layouts.

(args: CustomRenderFunctionArg) => ICustomLayoutObj;

The type declaration for callback function argument CustomRenderFunctionArg is:

interface CustomRenderFunctionArg {
  row: number;
  col: number;
  table: TableAPI;
  /**Formatted value */
  value: string|number;
  /**Original value */
  dataValue: string|number;
  rect?: RectProps;
}

The ICustomLayoutObj type is defined as follows

export type ICustomLayoutObj = {
  rootContainer: Container | any;
  /**
   * Do you still need to render content by default? Only if the configuration is true, it will be drawn. By default, it will not be drawn.
   */
  renderDefault?: boolean;
  /**
   * Whether to also enable padding in style
   */
  enableCellPadding?: boolean;
};

Detailed configuration instructions are as follows:

Dropdown menu item configuration. Dropdown menu items can be top-level menu items or second-level menu items, and only one configuration is required. The specific type is MenuListItem[].

Angle header cell display drop-down button and drop-down menu item configuration. Dropdown menu items can be top-level menu items or second-level menu items, and only one configuration is required. The specific type is MenuListItem[].

Pivot table corner cell icon configuration

cornerHeaderIcon?:
| string
| ColumnIconOption
| (string | ColumnIconOption)[]
| ((args: CellInfo) => string | ColumnIconOption | (string | ColumnIconOption)[]);

For the specific configuration of ColumnIconOption, please refer to: https://visactor.io/vtable/option/ListTable-columns-text#icon

Whether the header can be dragged

Display drill-down icon, clicking it will trigger a corresponding event

Display drill-up icon, clicking it will trigger a corresponding event

Whether the dimension value cell displays the sort icon. Clicking it does not have data sorting logic.

Whether the corresponding dimension header cell displays the sort icon.

Sorting rules:

If the sorting rules for this dimension are configured in dataConfig.sortRules, the data is sorted according to the rules in dataConfig.sortRules.

If the sorting rules for the dimension are not configured in dataConfig.sortRules, the default is to use the natural sorting of the dimension value string.

Whether to display sorting in the dimension name cell in the corner header. Clicking it does not have data sorting logic

Configuration item exclusive to image type Whether to keep the aspect ratio, default is false

Configuration item exclusive to image type Whether to automatically expand the cell size according to the image size, default is false

Configuration specific to image type Whether to enable click preview.