找回密码
 立即注册

QQ登录

只需一步,快速开始

Richard.Ma 讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2022-9-13 14:43  /   查看:2048  /  回复:0
本帖最后由 Richard.Ma 于 2022-9-13 15:05 编辑

在此前的版本中,SpreadJS 的切片器基于DOM,V15.2中我们进行了重构,新的切片器基于 Shape。

同时,切片器将以插件的形式单独引入:

npm 名称:@grapecity/spread-sheets-slicers
由于新的切片器基于Shape,因此需要依赖Shape 插件:@grapecity/spread-sheets-shapes


新版本切片器的变化

  • 支持渐变填充(查看悬停效果)
  • 支持多选模式。
  • 优化样式渲染。
  • 性能改进。

image.png39154967.png
新版本
image.png776035461.png
老版本



新版本切片器使用方式的变化

表格切片器

在没有使用切片器插件时,仍然可以使用表格,但无法插入切片器。

在不导入Shape 和Slicer 插件的情况下,使用“sheet.slicers.add”,会抛出异常。

如果需要使用表格切片器,需要添加以下引用。
  1. // npm package usage
  2. import "@grapecity/spread-sheets";
  3. import "@grapecity/spread-sheets-shapes";
  4. import "@grapecity/spread-sheets-slicers";
复制代码

或者
  1. // js package usage
  2. <script src="**/scripts/plugins/gc.spread.sheets.shapes.min.js"></script>
  3. <script src="**/scripts/plugins/gc.spread.sheets.slicers.min.js"></script>
复制代码

需要注意的是
Slicer插件依赖于Shape插件,因此形状必须先导入。

透视表切片器

如果只想使用没有 PivotSlicer 的 PivotTable,则不再需要引用Shape 插件。

如果想要使用 PivotSlicer,需要添加对 Shape插件 和 Slicer插件的引用。

  1. // npm package usage
  2. import "@grapecity/spread-sheets";
  3. import "@grapecity/spread-sheets-shapes";
  4. import "@grapecity/spread-sheets-slicers";
  5. import "@grapecity/spread-sheets-pivot-addon";
复制代码
  1. // js package usage
  2. <script src="**/scripts/plugins/gc.spread.sheets.shapes.min.js"></script>
  3. <script src="**/scripts/plugins/gc.spread.sheets.slicers.min.js"></script>
  4. <script src="**/scripts/plugins/gc.spread.pivot.pivottables.min.js"></script>
复制代码


image.png415148314.png

0 个回复

您需要登录后才可以回帖 登录 | 立即注册
返回顶部