【SpreadJS V15.1 新特性介绍】集算表支持多层列头

收藏

本帖最后由 Clark.Pan 于 2022-6-16 12:28 编辑

SpreadJS V15.1中，集算表终于支持多层的列头了，这是多么喜大普奔的一件事情 image.png565998839.png

为什么这么说呢，让我们来看看之前的一个实现：
image.png730988769.png

如上图所示，红框中的数据都是各种涨幅数据。按道理属于一类，应该归类起来，方便查看。但是之前没有多层列头的处理，如果要做到归类的效果，只能用headerFit: "stack" 这样的类型处理。
于是有了如上的效果，堆叠的一层接一层导致列头占了表格中的大部分，感觉特别的臃肿。
另外也没有明显的层级关系，感觉像一层套一层的递进关系，实际上这些数据都是属于涨幅的分类，各自之间是并列的。所以总给人感觉怪怪的。

在V15.1之后，SpreadJS集算表支持了多层列头。这样我们就可以通过多层列头的设置对相关列进行一个分组。
首先，在addView设置的每一列对象中调整了caption属性，用于多层列头的设置。该属性原来是一个字符串，现在是一个数组结构，数组有小到大罗列多层列头每一行的名称。于是我们可以改造成如下代码：

var view = fundDetailTable.addView("fundDetailView", [
...

复制代码

可以看到caption设置成了数组，表示多层列头，多列头的第一行的名称均为单位净值涨幅，第二行为各自维度的涨幅统计。集算表会自动对同名的列头进行合并操作。结果如下所示：
image.png447143248.png

跟上面的对比，很明显表头部分"减肥成功了"，并且简洁明了的表明了这是同一类的数据。
image.png616453551.png

		自动登录	找回密码
密码			立即注册

【SpreadJS V15.1 新特性介绍】集算表支持多层列头

0 个回复

讲师达人

悬赏达人

微信认证勋章

SpreadJS 认证

SpreadJS 高级认证

元老葡萄

【SpreadJS V15.1 新特性介绍】 集算表支持多层列头

0 个回复

讲师达人

悬赏达人

微信认证勋章

SpreadJS 认证

SpreadJS 高级认证

元老葡萄

【SpreadJS V15.1 新特性介绍】集算表支持多层列头