SpreadJS 是一款基于 HTML5 的純前端電子表格控件，兼容 450 種以上的 Excel 公式，憑借其 “高性能、跨平臺(tái)、與 Excel 高度兼容”的產(chǎn)品特性，備受以華為、蘇寧易購、天弘基金等為代表的企業(yè)用戶青睞。SpreadJS 為用戶帶來親切的 Excel 使用體驗(yàn)的同時(shí)，滿足 Web Excel 組件開發(fā)、表格文檔協(xié)同編輯、數(shù)據(jù)填報(bào)、Excel 類報(bào)表設(shè)計(jì)等業(yè)務(wù)場(chǎng)景，極大降低了企業(yè)研發(fā)成本和項(xiàng)目交付風(fēng)險(xiǎn)。

SpreadJS v17.0 Update1正式版下載

V17.0 Update1 現(xiàn)已發(fā)布，新特性如下：

工作簿增強(qiáng) / Workbook Enhancement

• 從右向左 / Right-to-Left

將樣式的 textDirection 屬性設(shè)置為 rightToLeft，可以將單元格中的文本方向更改為從右到左。這可以適應(yīng)從右側(cè)編寫和讀取的語言和腳本，并確保這些語言的數(shù)據(jù)能夠正確、自然地顯示。

同時(shí)，可以將某個(gè)工作表（Worksheet）的配置 rightToLeft 為 true，將從整體外觀上形成從右到左的形式，如下圖：

• 富文本支持項(xiàng)目符號(hào)列表 / Bulleted List

作為富文本格式的一部分，現(xiàn)在支持使用無序項(xiàng)目符號(hào)和有序編號(hào)列表。列表項(xiàng)具有 type、level 和 richText 作為其屬性。

• 文件上傳單元格類型 / FileUpload CellType

在新版本中，我們引入了一個(gè)新的 FileUpload CellType，允許用戶通過單擊單元格內(nèi)的文件上傳按鈕來選擇任何文件。

用戶還可以對(duì)這些文件執(zhí)行操作，包括預(yù)覽、下載和清除。默認(rèn)上傳按鈕在單元格中顯示，如下所示：

• 文檔自定義屬性 / Custom Properties Support

SpreadJS 現(xiàn)在支持為工作簿設(shè)置自定義屬性，包括標(biāo)題、作者、主題等數(shù)據(jù)。可以使用API在工作簿中管理這些屬性，也可以使用“高級(jí)屬性”窗口在 SpreadJS 表格編輯器管理這些屬性：

• 通過行列頭拖動(dòng) / Move/Insert Column or Row by Dragging Headers

現(xiàn)在可以通過拖動(dòng)標(biāo)題來移動(dòng)或插入列和行。可以通過將排列選項(xiàng)的allowDragHeaderToMove枚舉設(shè)置為行、列或兩者都設(shè)置來啟用。這也可以在SpreadJS設(shè)計(jì)器中啟用：

• 和外部復(fù)制粘貼支持格式 / Paste Data Outside of SpreadJS with Formatting

在 17.1 版本中，SpreadJS 現(xiàn)在支持在 SpreadJS 和 Excel 之間復(fù)制和粘貼單元格格式。這包括數(shù)字和日期格式等選項(xiàng)。

• 將形狀和圖表復(fù)制為圖像 / Copy Shape and Chart as an Image

現(xiàn)在可以將形狀、圖表和切片器復(fù)制到剪貼板并另存為圖像。我們向 Shape 和 Shape Base 類添加了一個(gè)名為 toImageSrc 的新 API。對(duì)于圖表和切片器來說也是如此。對(duì)于 SpreadJS Designer，當(dāng)右鍵單擊任何這些對(duì)象時(shí)，還提供了一個(gè)新的“另存為圖片”選項(xiàng)：

報(bào)表插件 / ReportSheet

• 行高列寬自適應(yīng) / ReportSheet AutoFit Row/Column

SpreadJS ReportSheet 現(xiàn)在支持行和列的自動(dòng)調(diào)整。這允許用戶指定行或列的大小是否應(yīng)根據(jù)其中的文本進(jìn)行更改。這樣，設(shè)計(jì)器中就有了一個(gè)用于設(shè)置 AutoFit 屬性的新 API 和一個(gè)新界面設(shè)置：

• 頁總計(jì) / Page Total

報(bào)表插件的 R.V 函數(shù)生成工作表中溢出單元格的值。在新版本中，添加了另一個(gè)參數(shù)來指定當(dāng)前頁面。例如：=SUM(R.V(C2,”CurrentPage”)) 將生成當(dāng)前頁面中所有溢出值的總和。其模板是：

然后，第一頁將如下所示：

計(jì)算引擎 / Calculation

• 公式調(diào)整的性能增強(qiáng) / Formula Adjustment Performance Enhancement

新版本中更新了內(nèi)部邏輯，以提高插入/刪除行/列時(shí)的性能。會(huì)在使用這些操作時(shí)較之前花費(fèi)更少的時(shí)間地進(jìn)行計(jì)算。

• 增量計(jì)算 / Incremental Calculation

新版本支持增量計(jì)算，在執(zhí)行過程中將整個(gè)計(jì)算分成多個(gè)段。這樣可以在計(jì)算任務(wù)較大時(shí)響應(yīng)用戶操作，從而防止工作簿包含許多公式時(shí) UI 無響應(yīng)。開發(fā)人員只需將 Workbook 類的incrementalCalculation 屬性設(shè)置為 true。

• 保護(hù)狀態(tài)下隱藏公式 / Protected Sheets Hidden Option

現(xiàn)在可以使用 Style 類的隱藏屬性或 CellRange 類的隱藏方法來控制受保護(hù)工作表中公式單元格的可見性。啟用后，當(dāng)隱藏單元格處于活動(dòng)狀態(tài)時(shí)，編輯欄將不會(huì)顯示任何數(shù)據(jù)，輸入編輯器在編輯模式下將為空，并且公式編輯器面板將不會(huì)顯示公式。

利用這個(gè)特性，可以保護(hù)一些單元格中的公式，避免使用者看到公式或修改。

圖表 / Charts

• 圖表表結(jié)構(gòu)引用 / Chart Table Structured References

新版本已支持結(jié)構(gòu)化參考公式，并且現(xiàn)在在表格中支持它們作為圖表數(shù)據(jù)源。如果圖表綁定到完整的表或使用表結(jié)構(gòu)引用的表的某些列，則表中的任何更新都將在運(yùn)行時(shí)自動(dòng)更新圖表的系列或數(shù)據(jù)值。

• 圖表數(shù)據(jù)標(biāo)簽“單元格值” / Chart Data Label “Value Of Cell”

圖表數(shù)據(jù)標(biāo)簽現(xiàn)在支持使用單元格引用來顯示所選單元格范圍的值。用戶可以為圖表的數(shù)據(jù)標(biāo)簽選擇特定的單元格范圍。

• 源鏈接單元格式化程序 / Source Linked Cell Formatter

在新版本中，用戶現(xiàn)在可以使用鏈接單元格應(yīng)用單元格格式，以動(dòng)態(tài)更新圖表元素的格式，包括數(shù)據(jù)標(biāo)簽、軸和工具提示。

表 / Table

• 自定義樣式 / Custom Styles Enhancement

新版本中，SpreadJS 允許用戶自定義表格樣式

集算表 / TableSheet

• 預(yù)定義列 / Defined Column Functionality

SpreadJS 集算表新版本支持添加、更新和刪除具有有意義的列類型的列，以幫助輕松設(shè)計(jì)表格。

• 撤銷重做支持 / Undo/Redo Support

新版本集算表添加了撤消和重做支持，允許用戶撤消/重做以下類別的操作：

• 配置更改：過濾、排序和其他配置設(shè)置
• 運(yùn)行時(shí) UI 操作：類似于工作表操作，如單元格編輯、添加/刪除行/列、剪貼板操作、拖動(dòng)/移動(dòng)行/列等
• 集算表 API：大多數(shù)更改數(shù)據(jù)或設(shè)置的 API 操作（setDataView 方法除外）

同樣，在表格編輯器中也支持撤銷重做。

• 大綱分組 / Outline Groups

在新版本中，SpreadJS 集算表現(xiàn)在支持大綱分組，可以在 groupBy 方法中定義多個(gè)字段來創(chuàng)建大綱組。這種多重分組允許用戶展開或折疊字段并包括聚合、頁眉和頁腳。

分組還支持在分組和基礎(chǔ)列之間進(jìn)行排序。

表格編輯器 / Designer

• 自定義保存文件對(duì)話框 / Save File Dialog Customization

在新版本中，用戶可以通過 API 設(shè)置保存時(shí)的文件格式以及文件名稱，如下代碼所示：

• 打印邊框選項(xiàng) / Printing showBorder Option

 SpreadJS 中已經(jīng)存在 showBorder 方法，用于控制打印過程中是否顯示邊框。在此版本中，我們已將該選項(xiàng)添加到表格編輯器：

• 條件格式規(guī)則管理器性能增強(qiáng) / Conditional Formatting Rules Manager Performance Enhancement

條件格式規(guī)則管理器的性能得到了顯著增強(qiáng)，特別是在管理對(duì)話框中的多個(gè)規(guī)則時(shí)。

• 條件格式規(guī)則管理器支持當(dāng)前選擇區(qū)域 / Conditional Formatting Rules Manager Current Selection Support

在某些情況下，工作簿可能具有大量條件格式，這可能會(huì)使查找特定格式變得復(fù)雜。規(guī)則管理器對(duì)話框現(xiàn)在支持顯示特定區(qū)域的規(guī)則，例如當(dāng)前選擇或特定工作表：

透視表 / PivotTable

• 自定義樣式 / Custom Styles Enhancement

與上面提到的自定義表格樣式增強(qiáng)功能一樣，SpreadJS 現(xiàn)在使用戶能夠在運(yùn)行時(shí)添加、刪除和修改數(shù)據(jù)透視表樣式。

• 數(shù)據(jù)透視表分組兼容性更新 / PivotTable Grouping Compatibility Update

Excel 更改了數(shù)據(jù)透視表中的分組方式，因此我們更新了 SpreadJS 數(shù)據(jù)透視表的分組策略以匹配。它經(jīng)過改進(jìn)，增強(qiáng)了可用性、靈活性和清晰度。

框架支持 / Framework Support

• Angular 17

除了版本 11 - 16 之外，SpreadJS 現(xiàn)在還支持 Angular 17。

• Next.js 14

SpreadJS 現(xiàn)在還支持 Next.js 版本 14。