如何实现SpreadJS 的切片器设置

发布时间:2025-05-20 01:52:34 发布人:远客网络

如何实现SpreadJS 的切片器设置

一、如何实现SpreadJS 的切片器设置

1、可以通过以下参数来设置SpreadJS的切片器：

2、disableResizingAndMoving:当'disableResizingAndMoving'为 true时,无法通过鼠标来改变切片器位置和大小，但是切片器依然可以通过鼠标来筛选数据。

3、isLocked:当表单未被保护时，切片器的'isLocked'属性不起作用。当表单被保护时并且切片器'isLocked'为 true时，切片器无法被鼠标选中，此时，切片器也不能通过鼠标来筛选数据。

4、fixPosition:当'fixPosition'为 true时，切片器的位置不会因为滚动，行列可见性，行列高宽改变，行列移动等改变自己的位置。

5、sortState:表明切片器中数据排序的状态。类型为GC.Spread.Sheets.SortState。默认值为GC.Spread.Sheets.SortState.ascending。

6、dynamicMove and dynamicSize:当表单的行列宽度改变时，切片器的位置行为会因这两个属性不同而不同。

7、style: Spread.Sheets支持14种内置切片器样式。

8、具体的代码实现，请参考下面的博客

9、

二、如何设置SpreadJS表单的单元格

下面介绍如何设置SpreadJS的表格样式。

1. Spread.Sheets提供了很多有关表格的公用接口。通过这些公用接口你可以很容易的管理和分析相互关联的数据。

2.你可以控制是否要显示表格的表头和表尾，是否要以一种行（列）交替的样式显示表格，是否要把第一列或者最后一列高亮。

3. Spread.Sheets支持一些内置的表格样式，你也可以自己定制样式。

三、spread js 中如何隐藏sheet页

首先添加相关的JS,CSS引用以及部署授权

<!DOCTYPE html><html xmlns=""><head>

<title>Spread HTML Page</title>

GC.Spread.Sheets.LicenseKey="<Your Deployment Key>";</script>

之后设置承载spread的div，注意这里需要设置两个一个是隐藏起来不显示的。

var hiddenWorkbook, excelIO, spread;

excelIO= new GC.Spread.Excel.IO();

hiddenWorkbook= new GC.Spread.Sheets.Workbook(document.getElementById("hiddenWorkbook"));

spread= new GC.Spread.Sheets.Workbook(document.getElementById("ss"));

首先，我们需要建立相关导入��按钮

function ImportFileStart(){ var excelFile= document.getElementById("fileDemo").files[0];

excelIO.open(excelFile, function(json){ var workbookObj= json;

hiddenWorkbook.fromJSON(workbookObj);

并将需要合并的Sheet所在的Excel导入至hiddenWorkbook中去。

接下来我们需要创建一个下拉菜单来供用户选择需要导入的Sheet

<p style="display:inline">Select sheet to load:</p>

function CreateSheetSelect(){ var sheetSelectionDiv= document.getElementById('sheetSelection');

sheetSelectionDiv.style.display="inline"; var dropDown= document.getElementById('sheetSelect'); for(var s= 0; s< hiddenWorkbook.getSheetCount(); s++){

dropDown.options[dropDown.options.length]= new Option(hiddenWorkbook.sheets[s].name(), s);

之后在初始化的代码中调用该方法：

SpreadJS本身支持通过sheet.toJSON()方法来序列化指定的工作表，但是有些样式不是设置在sheet上，而是设置在样式表中的，这时候单纯序列化sheet导出，就无法满足了。还需要将样式表中的样式循环拷贝。代码如下：

spread.addSheet(); var sheetNumber= document.getElementById('sheetSelect').value; var sheetJson= JSON.stringify(hiddenWorkbook.getSheet(sheetNumber).toJSON());

hiddenWorkbook.getNamedStyles().forEach(function(namedStyle){

spread.addNamedStyle(namedStyle);

spread.getSheet(0).fromJSON(JSON.parse(sheetJson));