KevinChen 发表于 2021-5-8 18:29:31

SpreadJS V14 Update1 新特性 - 透视表增强 - 表格样式

阅读本篇前,推荐先了解透视表镜像区域的概念和接口,详情点击:
《SpreadJS V14 Update1 新特性 - 数据透视表-获取透视表区域(getRange)》

在透视表中,常常需要通过样式来高亮、标记某些区域,或者针对不同的字段、维度来设置不同的样式。
SpreadJS V14 Update1发布之前,需要把样式直接设置在单元格上。
但是样式不会随字段更改发生变化,无法与字段或透视区域产生“联动”效果。

SpreadJS V14 Update1 推出了PivotArea的概念,这样Style可以直接设置在PivotArea上,
自动实现与数据字段联动的效果。如图所示:



代码示例如下:
var AmericaAndBritainStyle = new GC.Spread.Sheets.Style();
AmericaAndBritainStyle.backColor = '#00AFEF';
AmericaAndBritainStyle.foreColor = '#ffffff';
var AmericaAndBritainPivotArea = {
    dataOnly: true,
    references: [{
      fieldName: "Country",
      items: ["America", "Britain"]
    }]
}
pivotTable.setStyle(AmericaAndBritainPivotArea, AmericaAndBritainStyle);

API描述如下:

///* function setStyle (pivotArea: GC.Spread.Pivot.IPivotArea, style: GC.Spread.Sheets.Style): void
/**
* @description 设置或清除指定透视区域的样式.
* @param {GC.Spread.Pivot.IPivotArea} pivotArea 指定的透视区域
* @param {GC.Spread.Sheets.Style} style 要设置的样式对象, 传入 null 或 undefined 可以清除指定透视区域的样式.
*/
setStyle (pivotArea: IPivotArea, style: Style): void

///* function getStyle (pivotArea: GC.Spread.Pivot.IPivotArea): GC.Spread.Sheets.Style
/**
* @description 获取指定区域的样式对象.
* @param {GC.Spread.Pivot.IPivotArea} pivotArea 指定的透视区域
* @returns GC.Spread.Sheets.Style 样式对象
*/
getStyle (pivotArea: IPivotArea): Style


页: [1]
查看完整版本: SpreadJS V14 Update1 新特性 - 透视表增强 - 表格样式