SpreadJS 純前端表格控件 - V17.0 Update1 新特性
工作簿增強 / Workbook Enhancement
從右向左 / Right-to-Left
將樣式的 textDirection 屬性設置為 rightToLeft,可以將單元格中的文本方向更改為從右到左。這可以適應從右側編寫和讀取的語言和腳本,并確保這些語言的數據能夠正確、自然地顯示。
同時,可以將某個工作表(Worksheet)的配置 rightToLeft 為 true,將從整體外觀上形成從右到左的形式,如下圖:
富文本支持項目符號列表 / Bulleted List
作為富文本格式的一部分,現在支持使用無序項目符號和有序編號列表。列表項具有 type、level 和 richText 作為其屬性。
文件上傳單元格類型 / FileUpload CellType
在新版本中,我們引入了一個新的 FileUpload CellType,允許用戶通過單擊單元格內的文件上傳按鈕來選擇任何文件。
用戶還可以對這些文件執行操作,包括預覽、下載和清除。默認上傳按鈕在單元格中顯示,如下所示:
文檔自定義屬性 / Custom Properties Support
SpreadJS 現在支持為工作簿設置自定義屬性,包括標題、作者、主題等數據。可以使用API在工作簿中管理這些屬性,也可以使用“高級屬性”窗口在 SpreadJS 表格編輯器管理這些屬性:
通過行列頭拖動 / Move/Insert Column or Row by Dragging Headers
現在可以通過拖動標題來移動或插入列和行。可以通過將排列選項的allowDragHeaderToMove枚舉設置為行、列或兩者都設置來啟用。這也可以在SpreadJS設計器中啟用:
和外部復制粘貼支持格式 / Paste Data Outside of SpreadJS with Formatting
在 17.1 版本中,SpreadJS 現在支持在 SpreadJS 和 Excel 之間復制和粘貼單元格格式。這包括數字和日期格式等選項。
將形狀和圖表復制為圖像 / Copy Shape and Chart as an Image
現在可以將形狀、圖表和切片器復制到剪貼板并另存為圖像。我們向 Shape 和 Shape Base 類添加了一個名為 toImageSrc 的新 API。對于圖表和切片器來說也是如此。對于 SpreadJS Designer,當右鍵單擊任何這些對象時,還提供了一個新的“另存為圖片”選項:
報表插件 / ReportSheet
行高列寬自適應 / ReportSheet AutoFit Row/Column
SpreadJS ReportSheet 現在支持行和列的自動調整。這允許用戶指定行或列的大小是否應根據其中的文本進行更改。這樣,設計器中就有了一個用于設置 AutoFit 屬性的新 API 和一個新界面設置:
頁總計 / Page Total
報表插件的 R.V 函數生成工作表中溢出單元格的值。在新版本中,添加了另一個參數來指定當前頁面。例如:=SUM(R.V(C2,”CurrentPage”)) 將生成當前頁面中所有溢出值的總和。其模板是:
然后,第一頁將如下所示:
計算引擎 / Calculation
公式調整的性能增強 / Formula Adjustment Performance Enhancement
新版本中更新了內部邏輯,以提高插入/刪除行/列時的性能。會在使用這些操作時較之前花費更少的時間地進行計算。
增量計算 / Incremental Calculation
新版本支持增量計算,在執行過程中將整個計算分成多個段。這樣可以在計算任務較大時響應用戶操作,從而防止工作簿包含許多公式時 UI 無響應。開發人員只需將 Workbook 類的incrementalCalculation 屬性設置為 true。還有一個狀態欄項顯示了這個計算過程:
保護狀態下隱藏公式 / Protected Sheets Hidden Option
現在可以使用 Style 類的隱藏屬性或 CellRange 類的隱藏方法來控制受保護工作表中公式單元格的可見性。啟用后,當隱藏單元格處于活動狀態時,編輯欄將不會顯示任何數據,輸入編輯器在編輯模式下將為空,并且公式編輯器面板將不會顯示公式。
利用這個特性,可以保護一些單元格中的公式,避免使用者看到公式或修改。
圖表 / Charts
圖表表結構引用 / Chart Table Structured References
新版本已支持結構化參考公式,并且現在在表格中支持它們作為圖表數據源。如果圖表綁定到完整的表或使用表結構引用的表的某些列,則表中的任何更新都將在運行時自動更新圖表的系列或數據值。
圖表數據標簽“單元格值” / Chart Data Label “Value Of Cell”
圖表數據標簽現在支持使用單元格引用來顯示所選單元格范圍的值。用戶可以為圖表的數據標簽選擇特定的單元格范圍。
源鏈接單元格式化程序 / Source Linked Cell Formatter
在新版本中,用戶現在可以使用鏈接單元格應用單元格格式,以動態更新圖表元素的格式,包括數據標簽、軸和工具提示。
表 / Table
自定義樣式 / Custom Styles Enhancement
新版本中,SpreadJS 允許用戶自定義表格樣式
集算表 / TableSheet
預定義列 / Defined Column Functionality
SpreadJS 集算表新版本支持添加、更新和刪除具有有意義的列類型的列,以幫助輕松設計表格。列類型如下:
列類型 | 數據類型 | 描述 |
數值 | 數值 | 用于大多數具有指定格式的數值 |
文本 | 文本 | 用于常見文本 |
公式 | 取決于結果 | 根據記錄中的其他字段計算值 |
查找 | 取決于相關字段 | 查找相關記錄中的特定字段 |
日期 | 日期 | 便于輸入日期值 |
復選框 | 真假 | 用于選中/取消選中,數據類型為 TRUE/FALSE |
選擇框 | 取決于選項 | 從預設列表中選擇選項 |
貨幣 | 數值 | 以文化格式指示貨幣 |
百分比 | 數值 | 以百分比格式指示數字 |
電話 | 文本 | 以掩碼驗證指示數字字符串 |
郵件 | 文本 | 以掩碼驗證指示電子郵件地址 |
鏈接 | 文本 | 指示 URL 文本 |
創建時間 | 日期 | 在創建記錄時設置日期 |
修改時間 | 日期 | 在記錄字段更新時設置日期 |
附件 | 對象 | 允許直接在記錄上附加文件 |
條碼 | 取決于輸入 | 從字段生成指定的條形碼 |
撤銷重做支持 / Undo/Redo Support
新版本集算表添加了撤消和重做支持,允許用戶撤消/重做以下類別的操作:
- 配置更改:過濾、排序和其他配置設置
- 運行時 UI 操作:類似于工作表操作,如單元格編輯、添加/刪除行/列、剪貼板操作、拖動/移動行/列等
- 集算表 API:大多數更改數據或設置的 API 操作(setDataView 方法除外)
同樣,在表格編輯器中也支持撤銷重做。
大綱分組 / Outline Groups
在新版本中,SpreadJS 集算表現在支持大綱分組,可以在 groupBy 方法中定義多個字段來創建大綱組。這種多重分組允許用戶展開或折疊字段并包括聚合、頁眉和頁腳。
分組還支持在分組和基礎列之間進行排序。
表格編輯器 / Designer
自定義保存文件對話框 / Save File Dialog Customization
在新版本中,用戶可以通過 API 設置保存時的文件格式以及文件名稱,如下代碼所示:
打印邊框選項 / Printing showBorder Option
SpreadJS 中已經存在 showBorder 方法,用于控制打印過程中是否顯示邊框。在此版本中,我們已將該選項添加到表格編輯器:
條件格式規則管理器性能增強 / Conditional Formatting Rules Manager Performance Enhancement
條件格式規則管理器的性能得到了顯著增強,特別是在管理對話框中的多個規則時。
條件格式規則管理器支持當前選擇區域 / Conditional Formatting Rules Manager Current Selection Support
在某些情況下,工作簿可能具有大量條件格式,這可能會使查找特定格式變得復雜。規則管理器對話框現在支持顯示特定區域的規則,例如當前選擇或特定工作表:
透視表 / PivotTable
自定義樣式 / Custom Styles Enhancement
與上面提到的自定義表格樣式增強功能一樣,SpreadJS 現在使用戶能夠在運行時添加、刪除和修改數據透視表樣式。
數據透視表分組兼容性更新 / PivotTable Grouping Compatibility Update
Excel 更改了數據透視表中的分組方式,因此我們更新了 SpreadJS 數據透視表的分組策略以匹配。它經過改進,增強了可用性、靈活性和清晰度:
項目 | 舊行為 | 新行為 |
默認字段源名稱 | 默認字段源名稱直接從間隔(如年/月/季度)中派生。例如,按年份分組會生成名為“年份”的字段。 | 默認字段源名稱結合了原始字段名和間隔。例如,如果原始字段是“battleDate”,并按年份分組,生成的字段將命名為“年份(battleDate)”。 |
原始字段類型 | 當一個字段被分組時,它被視為一個分組字段。 | 即使在分組后,原始字段仍然保持為正常字段。 |
日期字段重新分組 | 重新分組需要使用原始字段的確切名稱。 | 重新分組需要使用原始字段名稱或生成的分組字段名稱。 |
取消分組功能 | 僅使用原始字段名稱來取消分組。 | 可以使用原始字段名稱和生成的字段名稱來取消分組。 |
框架支持 / Framework Support
Angular 17
除了版本 11 - 16 之外,SpreadJS 現在還支持 Angular 17。
Next.js 14
SpreadJS 現在還支持 Next.js 版本 14。
歷史版本
查看更多關于 SpreadJS 純前端表格控件的歷史版本。