S2

S2 支持在树状结构下，配置折叠/展开的节点，默认展开所有节点.

平铺模式，后续支持

const s2Options = {
  hierarchyType: 'tree',
  style: {
    rowCell: {
      // 折叠节点
      collapseFields: {},
      // 展开层级
      expandDepth: 0,
      // 折叠所有
      collapseAll: true
    }
  },
}

折叠指定节点

配置 collapseFields, 支持 维值 id 和 维度 field 两种方式，即可以是 root[&] 浙江省 和 city

const s2Options = {
  style: {
    rowCell: {
      collapseFields: {},
    },
  },
}

根据节点对应维值 id

指定 id 可以折叠指定节点，如配置为 root[&] 浙江省, 那么 浙江省 下所有节点都会被折叠

const s2Options = {
  style: {
    rowCell: {
      collapseFields: {
        'root[& 浙江省': true
      },
    },
  },
}

根据节点对应维度 field

指定 field 可以折叠节点对应维度的节点，如行头配置了 province, city 两个维度，collapseFields 配置为 ['city'], 那么所有城市都会被折叠

const s2DataConfig = {
  fields: {
    rows: ['province', 'city']
  }
}

const s2Options = {
  style: {
    rowCell: {
      collapseFields: {
        province: false,
        city: true
      }
    },
  },
}

const s2Options = {
  style: {
    dataCell: {
      width: 100,
      height: 90
    },
  },
}

折叠所有节点

配置 collapseAll 即可，优先级小于 collapseFields 和 expandDepth, 详见配置优先级

const s2Options = {
  style: {
    rowCell: {
      collapseAll: true,
    },
  },
}

默认展开层级

表格默认展开全部节点，collapseFields 需要预先知道对应的节点 id 或 field, 当不关心具体节点，只关心节点层级时，可以使用 expandDepth 语法糖，配置展开层级（从 0 开始）优先级小于 collapseFields, 详见配置优先级

const s2Options = {
  style: {
    rowCell: {
      // 展开两层
      expandDepth: 1,
    },
  },
}

配置优先级

S2 提供了三个折叠/展开相关配置，以满足不同的使用场景，优先级如下：

collapseFields > expandDepth > collapseAll

如果想让 collapseAll 生效，可将 collapseFields 和 expandDepth 置为 null 即可

const s2Options = {
  style: {
    rowCell: {
      collapseFields: null, // 无效
      expandDepth: null, // 无效
      collapseAll: true, // 生效
    },
  },
}

如果行头是自定义节点 (CustomTreeNode), 则优先级如下：

collapseFields > expandDepth > collapseAll > CustomTreeNode.collapsed

API 文档

Style

功能描述：样式设置。查看文档和示例

参数	类型	功能描述
layoutWidthType	`adaptive \| colAdaptive \| compact`	单元格宽度布局类型 `adaptive` : 行列等宽，均分整个 `Canvas` 画布宽度 `colAdaptive`：列等宽，行头紧凑布局，列等分画布宽度减去行头宽度的剩余宽度 `compact`：行列紧凑布局，指标维度少的时候无法布满整个画布，列头宽度为实际内容宽度（取当前列最大值，采样每一列前 50 条数据）
dataCell	DataCell	数值单元格配置
rowCell	RowCell	行头单元格配置
colCell	ColCell	列头单元格配置
cornerCell	CornerCell	角头单元格配置
mergedCell	MergedCell	合并单元格配置
seriesNumberCell	SeriesNumberCell	序号单元格配置

DataCell

功能描述：数值单元格配置

参数	说明	类型	默认值	必选
width	单元格宽度（优先级：`colCell.widthByField > colCell.width > dataCell.width`)	`number`	96	-
height	单元格高度（优先级：`rowCell.heightByField > rowCell.height > dataCell.height`)	`number`	30	-
valuesCfg	单元格配置	`{ originalValueField?: string, widthPercent?: number[], showOriginalValue?: boolean }`		-

其他公用配置见 CellTextWordWrapStyle

ColCell

功能描述：列头单元格配置

参数	说明	类型	默认值
width	单元格宽度，可根据当前列头节点动态设置（叶子节点有效）	`number \| (colNode: Node) => number`	96
height	单元格高度，可根据当前列头节点动态设置（叶子节点有效）	`number \| (colNode: Node) => number`	30
widthByField	根据度量值设置宽度（拖拽或者预设宽度场景）, `field` 对应 `s2DataConfig.fields.columns` 中的 `field` 或列头 id （优先级大于 `width`) 查看详情	`Record<string, number>`	-
heightByField	根据度量值设置高度（拖拽或者预设高度场景）, `field` 对应 `s2DataConfig.fields.columns` 中的 `field` 或列头 id （优先级大于 `height`) 查看详情	`Record<string, number>`	-
hideValue	默认数值挂列头，会同时显示列头和数值，隐藏数值，使其更美观。（即 `s2DataConfig.fields.values` 且仅在单数值时有效，多数值时推荐使用隐藏列头)	`boolean`	false

RowCell

功能描述：行头单元格配置

参数	说明	类型	默认值
width	行单元格宽度，可根据当前行头节点动态设置，树状结构同样适用	`number \| (rowNode: Node) => number`
treeWidth	树状模式下行单元格宽度，优先级高于 `width`, 值为空时则默认使用 `width`	`number`
height	行单元格高度，可根据当前行头节点动态设置	`number \| (rowNode: Node) => number`	30
collapseFields	树状模式下行头自定义折叠节点。支持 id (`'root[&] 行头维度值'`) 和维度 field (`'city'`) 两种格式，优先级大于 `collapseAll` 和 `expandDepth`, 设置为 `null` 时优先级最低。查看 demo	`Record<string, boolean>`
collapseAll	在树状结构模式下行头是否默认收起全部。	`boolean`	`false`
expandDepth	在树状结构模式下行头默认展开展开的层级（层级从 0 开始）, 设置为 `null` 时优先级最低	`number`
showTreeLeafNodeAlignDot	树状模式下行头叶子节点是否显示层级占位点	`boolean`	`false`
withByField	根据 `field` 设置每行的宽度。`field` 对应 `s2DataConfig.fields.rows` 中的 `field` 或列头 id （优先级大于 `width`) 查看详情	`Record<string, number>`	-
heightByField	根据 `field` 设置每行的高度。 1. 透视表：`field` 对应 `s2DataConfig.fields.rows` 中的 `field` 或列头 id. 2. 明细表：`field` 对应行序号，从 `1` 开始。（优先级大于 `height`) 查看详情	`Record<string, number>`	-

CornerCell

其他公用配置见 CellTextWordWrapStyle

MergedCell

其他公用配置见 CellTextWordWrapStyle

SeriesNumberCell

其他公用配置见 CellTextWordWrapStyle

CellTextWordWrapStyle

功能描述：单元格换行配置。查看示例

参数	说明	类型	默认值
wordWrap	文本是否自动换行（数值单元格不建议换行）。了解更多	`boolean`	`true`
maxLines	最大行数，文本超出后将被截断，当手动拖拽调整高度或存在自定义单元格高度时，为保证展示合理性，会根据当前文本行高计算出能展示的最大行数，覆盖默认的 `maxLines` 配置。该配置支持配置为 `Infinity`（数值单元格不建议换行），需要配合 `wordWrap` 和 `textOverflow` 一起使用。了解更多	`number`	`1`
maxLines	最大行数，文本超出后将被截断，支持配置为 `Infinity`（数值单元格不建议换行），需要配合 `wordWrap` 和 `textOverflow` 一起使用。了解更多	`number`	`1`
textOverflow	自定义隐藏的文本溢出内容，例如直接裁剪、追加省略号或一个自定义字符串，需要配合 `wordWrap` 和 `maxLines` 一起使用。了解更多	`string`	`ellipsis`

自定义折叠/展开节点

折叠指定节点

根据节点对应维值 id

根据节点对应维度 field

折叠所有节点

默认展开层级

配置优先级

API 文档

Style

DataCell

ColCell

RowCell

CornerCell

MergedCell

SeriesNumberCell

CellTextWordWrapStyle