S2 🙏透视表、明细表希望支持按维度+数值的列宽自适应，且能设置最大宽度并兼容自动换行

Describe the feature / 功能描述

一、需求

透视表、明细表，能够设置列宽自适应，按维度和数值实际宽度显示
能设置最大宽度（如200），超过最大宽度，默认用…，hover展示tooltip完整信息
如果设置了自动换行，则换行显示，超出最大宽度时自动换行，最大100字符，超过仍然显示“…”

二、现状

1. 关于列宽自适应

2.0版本已支持 layoutWidthType: 'compact' 实现数值单元格列宽自适应，但不支持行头列头的列宽自适应，某些情况会无法完全显示列头的文本
列宽自适应时，貌似不支持设置最大宽度

2. 关于自动换行

没有看到超出最大字符即省略的配置，好像只有maxLines设置超出行数省略。
最好能配合列宽自适应设置的最大宽度使用，当设置自动换行时，超出最大宽度时即自动换行，否则正常用...省略

三、官网自测示例

import { PivotSheet } from '@antv/s2';
 
Promise.resolve({
  "describe": "标准交叉表数据。",
  "fields": {
    "rows": [
      "province",
      "city"
    ],
    "columns": [
      "type",
      "sub_type"
    ],
    "values": [
      "number"
    ],
    "valueInCols": true
  },
  "meta": [
    {
      "field": "number",
      "name": "数量"
    },
    {
      "field": "province",
      "name": "省份"
    },
    {
      "field": "city",
      "name": "城市"
    },
    {
      "field": "type",
      "name": "类别"
    },
    {
      "field": "sub_type",
      "name": "子类别"
    }
  ],
  "data": [
    {
      "number": 'sdfwerwegerg1asdwergregwerqwresdgfsg',
      "province": "浙江省",
      "city": "杭州市",
      "type": "家具",
      "sub_type": "桌子"
    },
    {
      "number": 2367,
      "province": "浙江省",
      "city": "绍兴市",
      "type": "家具",
      "sub_type": "桌子"
    },
    {
      "number": 5343,
      "province": "浙江省",
      "city": "杭州市",
      "type": "家具",
      "sub_type": "沙发"
    },
    {
      "number": 632,
      "province": "浙江省",
      "city": "绍兴市",
      "type": "家具",
      "sub_type": "沙发"
    },
    {
      "number": '345',
      "province": "浙江省",
      "city": "杭州市",
      "type": "办公用品",
      "sub_type": "笔"
    },
    {
      "number": 1304,
      "province": "浙江省",
      "city": "绍兴市",
      "type": "办公用品",
      "sub_type": "笔"
    },
  ],
})
  .then((dataCfg) => {
    const container = document.getElementById('container');
 
    // 详情请查看: https://s2-v1.antv.antgroup.com/zh/docs/manual/advanced/custom/cell-size
    const s2Options = {
      width: 600,
      height: 480,
      hierarchyType: 'grid',
      style: {
        layoutWidthType: 'compact',
        dataCell: {
          width: 100,
          height: 90,
          // 最大行数，文本超出后将被截断
          maxLines: 2,
          // 文本是否换行
          wordWrap: true,
          // 可选项见：https://g.antv.antgroup.com/api/basic/text#textoverflow
          textOverflow: 'ellipsis',
        },
      },
    };
 
    const s2 = new PivotSheet(container, dataCfg, s2Options);
    s2.render();
  });

四、其他说明

目前我们还在用s2 1.0，有比较多的需求不能满足，但是升级的工作量不小，所以迟迟没有升级，希望能确认系列需求能够支持之后，我们再一次性升级到最新的版本
目前我们还在同步使用s2-vue 1.x版本中的SheetComponent，但是官网提示该版本2.x也不再维护，如果本需求能够支持，是否s2-vue 2.x版本也能支持
希望能确认下能否支持，以及支持的大概排期时间，感谢🙏

Design the API / API 设计

不成熟的几个api设想

const s2Options = {
  ......,
  style: {
    layoutWidthType: {
      type: 'compact',
      maxWidth: 200,
    },
    dataCell: {
      width: 100,
      height: 90,
      // 文本换行配置
      wordWrapConfig: {
        isWrap: true,
        // 最大宽度，超过即换行
        maxWidth: 200,
        // 最大字符数，文本超出后将...省略
        maxLength: 100,
        textOverflow: 'ellipsis',
      },

    },
  },
};

Are you willing to contribute? / 是否愿意参与贡献？

❌ No / 否

Feb 10 '25 06:02 DantinZhang

你好 @DantinZhang:

提 Issue 须知

⚠️ 在提出问题前，请确保你已经仔细阅读👓/搜索🔍过官方文档和常见问题以及图表示例, 并且已经搜索查阅过相关 Issues 列表和 Discussions 列表. 当你确定自己的问题没有解决方案时，请提交 issue。 ⚠️

如果是使用问题，不知道怎么用，移步 Discussions 讨论区并提供有效信息进行提问。

参与社区共建

这是一个开源项目, 我们也有繁忙的业务要做, 是用自己的业余时间在维护, 为爱发电, 精力有限, 所以有时候 issue 响应速度不是那么及时, 如果你遇到了问题, 或者对 Issues 和 Discussions 列表的问题感兴趣, 可以直接认领并尝试修复 (贡献指南)，帮助 S2 变得更好, 而不是一味的埋怨和催促, 我们不是甲方乙方的关系.

Feb 10 '25 06:02 github-actions[bot]

这个功能可以在CustomFacet中重写getAdaptGridColWidth方法实现，根据自己的具体需求实现

Feb 18 '25 02:02 Create-Peace