Added gauge charts and support for password-protected worksheets.
May 4, 2023 - 16:24 new version
feature
PivotTable Enhancements
- Subtotal option for individual fields - PivotTable support has been enhanced by adding subtotal options for individual fields. Previously, SpreadJS would change the subtotal position to the bottom of each field. Now you can change the position of each field.
- GetPivotData function for PivotTable references - The "Use GetPivotData function for PivotTable references" option has been added as an option for formulas in the workbook and can be enabled or disabled. This option allows you to refer to PivotTable cells even if the data layout changes.
- PivotTable Sorting - Added sorting functionality, accessible by right-clicking on a cell in a PivotTable.
Table Enhancements
- Bind worksheet tables to Data Manager table views - You can now use views in DataManager as data sources for tables in worksheets.
- Data Source Spread Transformation - In some cases, data in the DataManager may be in the form of nested objects with different properties. Previously, you needed to indicate properties of these objects as fields using computed columns or dot delimiters. With this release, you can simply specify "spread: true" to ensure that an object's first-level children are spread out into separate fields.
- Spreadsheet Filters - TableSheets now allows you to filter multiple columns at the same time.
- Reorder - You can reorder the sheets in a workbook by clicking and dragging the sheet tabs at the bottom of the workbook. In this release, you can now reorder Sheets and TableSheets together, so you can change the order of Sheets and TableSheets if you want.
- Header Style Rules - Column headers in TableSheet now support style rules. By default, if the TableSheet is set to read-only, it automatically adds a lock icon to the column. You can now set specific style rules that display column headers in specific situations.
computing enhancement
- Formula result auto-formatting - After entering a formula in SpreadJS, you can now auto-format the result based on the data in the formula. Auto format will be one of the following types:
- empty - empty/undefined/"general"/"".
- Number - 0 0.00.
- Currency (Accounting) - $#,##0.00.
- Date (time) - m/d/yyyy h:mm or h:mm:ss AM/PM.
- Percent - 0.00%.
- Fraction- # ? /? .
- Science - 0.00E+00.
- letter- @.
- RegEx Functions - Some new RegEx functions have been added to help extract, match and replace text in cells:
- GC.REGEXEXTRACT - Extract matched substrings according to a regular expression.
- GC.REGEXMATCH - Tests whether a piece of text matches a regular expression.
- GC.REGEXREPLACE - replace part of a text string with a different text string using a regular expression.
- Fast entry of formulas across sheets - When entering a formula in SpreadJS, you can select the sheet tab at the bottom of the workbook to include a reference to it in the formula and stay in edit mode. However, there may be too many sheets displayed at one time to be selected. The new AllSheetsList button can now be used to select sheets for references in formulas.
shape enhancement
- Sparkline Functions - Shapes now support the use of sparkline functions as source properties. This can be done with style.fill.src. When used, it creates a sparkline and uses it as the background for the shape.
- Textbox Shapes - SpreadJS now supports textbox shapes, which means you can add textboxes anywhere on your worksheet, with text in them. You can also use the resizeToFitText option to automatically resize the text box to fit the user's input.
- Z-Order method and designer support - SpreadJS and designer components now support Z-Order for changing shapes. This means you can now change the visual order of shapes relative to each other using the following behaviors:
- Move Forward - Moves a shape on top of another shape.
- Bring to Front - Moves the shape on top of all other shapes.
- Send Backward - Moves a shape below another shape.
- Send to Back - Moves the shape below other shapes.
- Form Controls Enabled Property - In previous releases, form controls were added, allowing you to add different types of buttons and interactive UI to a form-like interface. In this release, an enabled attribute has also been added, allowing you to control whether the user can interact with the form controls.
Chart Enhancement
- Gauge Graph - A Gauge graph has been added. This new combo chart lets you create a gauge or speedometer. A gauge chart is a combination of a pie chart and a donut chart that allows you to quantitatively visualize individual data values.
- Invert If Negative - Column and bar charts have been enhanced with the invertIfNegative option. This allows you to format positive and negative values differently, allowing for a clearer visual distinction. You can enable this option on specific series in the chart and SpreadJS will automatically invert the data. You can choose a specific color for the inverted series using the invertColor option.
Workbook Improvements
- Input Mask Style - Added a new masked input feature. This is used to restrict user input to a set of formats, ensuring data integrity while preventing input errors such as entering a formatted phone number. The pattern can be a string pattern or a date pattern, and can be combined with formulas to produce specific results.
- Password Protected Sheets - Sheets in SpreadJS can now be password protected. You can set passwords for specific sheets or entire workbooks to match Microsoft Excel functionality.
- Resizable Filter Window - The drop-down filter dialog can now be resized to suit user needs. Resizing follows the following behavior:
- Tracks the last size set by the user.
- Will not resize below the minimum required size to fit the content.
- Global setting to enable/disable resizable filter dialogs.
- Word Line-Breaking - SpreadJS now supports custom line-breaking, which allows you to define characters that indicate when a line-break should occur.
- ComboBox AllowFloat - In some cases, the user interacts with the ComboBox and depending on the position and content, the full ComboBox does not display correctly. In this release, an allowFloat property has been added on the ComboBoxCellType which, when enabled, allows the ComboBox to float outside of the SpreadJS instance on the page.
- Inserting Cut Cells for Tables - SpreadJS already supports inserting copied or cut cells outside the bounds of a table. Now with this version, copied and cut cells can be inserted into tables.
- Display zeros - Sometimes a worksheet may contain formulas that result in 0s in cells that the user may not want to display any value. To support this, the showZeros option has been added, which can be enabled to display 0 values in cells and disabled to display cell values as blank.
- Checkbox CellType Line Break - Checkboxes is a CellType in SpreadJS that allows you to place a checkbox inside a cell with a label next to the box. In some cases the text can be too long for the cell, that's why support for line breaks in CheckBox CellTypes has been added via the cellStyle.wordWrap property. When set to true, the text will wrap automatically if it is larger than the width of the cell.
- Style Copy Clipboard Content Optimization - SpreadJS now generates optimized HTML content for the clipboard when copying style ranges. This improves the performance and memory consumption of large clipboard operations.
- Preserve WordWrap - As another copy/paste enhancement, SpreadJS now supports preserving cell word wrap when copying from one SpreadJS instance to another or from SpreadJS to Excel. If word wrap is enabled for a cell, that cell word wrap will work automatically when copied.
- Column/Row Header Layout Enhancements - SpreadJS supports addRows/Columns and deleteRows/Columns, and with this release, these functions now work with Column and Row headers. You only need to specify SheetArea.colHeader or SheetArea.rowHeader when calling these functions.
- Style Decoration Icons - The icons property in SpreadJS has been enhanced to support style decoration. These icons are a set of custom icons that can be embedded inside or outside the cell. Since these are implemented using styles, you can specify the source, width, height and position of the icon.
- SetRowCount and SetColumnCount Data Protection - In previous SpreadJS versions, the SetRowCount and SetColumnCount functions could delete rows or columns even if there was data in the row and column being deleted. In this release, a new parameter called guardContent has been added, which allows you to guard the rows and columns containing data using these functions.
framework support
- Next.js support - this should give you all the features you need for production, including hybrid static and server rendering, TypeScript support, smart bundling, route prefetching, and more.
- Nuxt Support - Nuxt, an open-source Vue-based framework that facilitates web development, now supports use with SpreadJS in this release.
- Angular 15 Support - SpreadJS now supports the latest Angular 15 with an Angular wrapper.
Designer Component Accessibility
- Added accessibility options to the designer component. This basic accessibility is based on WAI-ARIA. It should be noted that different screen readers may cause the text to read differently for some options.
designer improvements
- Resizable Conditional Formatting and Named Range Dialogs - The Designer component now supports resizable dialogs. This is just a new "resizable" property added to the dialog template. When this property is set to true, the dialog will support resizing in left, right and bottom directions. Also, the initial size of the dialog is the minimum size of the dialog.
- Font size dropdown menu enhancements - In the designer component, you can change the font size by clicking the dropdown menu and selecting a number. In this release, the dropdown box has been made editable so you can set the font size to include decimals. This is limited to values between 1 and 409, and the decimal point must be a multiple of 0.5.
SpreadJS is a complete enterprise JavaScript spreadsheet solution for creating financial reports and dashboards, budgeting and forecasting models, science, engineering, healthcare, education, science lab notebooks and other similar JavaScript business applications. Utilizes a high-speed calculation engine with over 500 Excel built-in functions in 19 languages, providing a true Excel-like spreadsheet experience with zero dependencies on Excel. Fully customize to your application's needs using SpreadJS' optional deployment add-on for PivotTable UI and Excel-like designer ribbon, allowing your users to perform complex interactive analysis and data visualization. Fully supports React, Vue, Angular and TypeScript.