单元格自动合并

收藏

本帖最后由 Ellia.Duan 于 2024-9-4 09:10 编辑

很多用户在数据填报后，希望合并内容相同的单元格。SpreadJS实现了自动合并，如下图
image.png343242797.png

用代码怎么实现了，主要是autoMerge这个API，主要参数有：
image.png967763366.png

下面将分别介绍这几个参数：
一、range
range就是数据源区域，如果想对这个sheet区域设置自动合并，可以使用这个区域代码：

let range = new GC.Spread.Sheets.Range(-1, -1, -1, -1);

复制代码

二、direction
Sheets.AutoMerge.AutoMergeDirection包括五个值，分别是：

当设置在none方向合并时：
image.png934590148.png

当设置在column方向合并时：
image.png629324035.png

当设置在row方向合并时：
image.png803921508.png

当设置在columnRow方向合并时,在行方向上优先于列方向应用自动合并
image.png643523864.png

当设置在rowColumn方向合并时,在行方向上优先于列方向应用自动合并

三、mode
Sheets.AutoMerge.AutoMergeMode有两个值，分别是free、restricted。
Sheets.AutoMerge.AutoMergeMode.restricted在相邻单元格具有相同值并且自动合并前一行或前一列中的相应单元格时应用自动合并
怎么理解呢？
image.png355901793.png

如上图所示，“product”列红色框住的内容一致，但是没有合并，因为他的左列“city”列内容不一致。
Sheets.AutoMerge.AutoMergeMode.free在相邻单元格具有相同值时应用自动合并
image.png604700927.png

如上图所示：当AutoMergeMode模式为free时，可以发现“city”列不受“product”列影响

四、sheetArea
自动合并的范围区域可以是viewport(默认)，也可以在行标题位置，也可以在列标题位置
image.png48611449.png

五、selectionMode

在新版本我们实现了自动合并选择模式，默认为source，即默认选中源数据，如下图所示：
image.png345115966.png

当选择merge时，单元格选中的是合并单元格后的区域，见下图：
image.png794857787.png

这一点与真正单元格合并后的选中区域一致。

导出Excel问题
最后，有用户反馈，在导出excel后，怎么自动合并单元格不生效了呢？
可以加一个导出选项。
UI上可以勾选这个选项：
image.png454303588.png

代码上可以添加这个导出选项，includeAutoMergedCells设置为true
完整代码是：

$("#exportExcel").click(function () {
const fileName = 'exportExcel.xlsx';
spread.export(function (blob) {
saveAs(blob, fileName);
}, e => {
console.log('失败', e.errorMessage);
}, {
includeBindingSource: true,
saveAsView: true,
includeAutoMergedCells: true,
fileType: GC.Spread.Sheets.FileType.excel,
});
});

复制代码

完整项目可以参考附件。

ln123 · ln123

您写的很好我怎么在我的工程项目里加上列自动合并呢

Ellia.Duan · Ellia.Duan

您好，您可以执行下下面的这行代码
  sheet.autoMerge(range, GC.Spread.Sheets.AutoMerge.AutoMergeDirection.column,
         GC.Spread.Sheets.AutoMerge.AutoMergeMode.restricted,
         GC.Spread.Sheets.SheetArea.viewport,
         GC.Spread.Sheets.AutoMerge.SelectionMode.merged);

ypge · ypge

Ellia.Duan 发表于 2023-11-9 15:52
您好，您可以执行下下面的这行代码
sheet.autoMerge(range, GC.Spread.Sheets.AutoMerge.AutoMergeDirec ...

你好，后端gc会自动合并不？我怎么在后端导出pdf没有自动合并

Ellia.Duan · Ellia.Duan

您好，在导出sjs文件时，要勾选“包含自动合并的单元格”
image.png800296020.png

然后在GcExcel导入此sjs文件，导出pdf是正常的，如下图所示：
image.png316535033.png

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

单元格自动合并

4 个回复

SpreadJS 认证

SpreadJS 高级认证