JavaScript Spreadsheet Designers
Quickly Design JavaScript Spreadsheets Using the SpreadJS Designers
JavaScript developers can use the Desktop Spreadsheet Designer Application to easily design workbooks and templates with a simple interface that uses all of the SpreadJS features. Users can design a spreadsheet, including cell types and formats, shapes, tables, add data, create charts, add sparklines, and then save the spreadsheet to the Spread (.sjs) file format, or Excel (.xlsx) format, to load into the SpreadJS widget in a JavaScript application.
Developers can offer the same spreadsheet designer components, including the UI toolbar ribbon, formula bar, status bar, side panel, and context menu, functionality to users with the SpreadJS Designer Ribbon Component Add-on. Allowing end-users to create and design beautiful and complex spreadsheets specific to their needs. The SpreadJS Designer Ribbon Component is also fully customizable to fit any applications needs.
JavaScript Spreadsheet Designer Ribbon Component
The SpreadJS Designer Ribbon Component is a separate optional deployment add-on package that provides JavaScript Developers the ability to embed the same UI components and capabilities of the Desktop Spreadsheet Designer in their JS applications. This allows their end-users to easily customize spreadsheets using a familiar UI ribbon, formula bar, status bar, side panel, and context menus directly from their apps interface.
The SpreadJS Designer Ribbon Component is also fully customizable, so developers can add, remove, and re-arrange buttons, tabs, and designer sections by adding, removing, or moving corresponding entries in the configuration file.
To interact with and customize the Designer Ribbon Component, open the downloaded SpreadJS zip file and navigate to the “Designer\Designer Component” folder, for example "\Designer\Designer Component\samples\purejs\index.html”.
Offer Familiar Spreadsheet UI In JavaScript Apps
The SpreadJS Designer Ribbon Component provides users the flexibility to customize a spreadsheet easily in a few clicks. The designer component includes the ribbon, formula bar, status bar, side panel, and context menu. The built-in dialogs and options in the SpreadJS Designer Ribbon Component can be used to define minute details like hyperlink's link color, cell padding, spreadsheet settings, etc.
Full Framework Support
The SpreadJS Designer Ribbon Component includes Angular, React, and Vue wrappers, to embed the designer into your projects easily. Using the Designer in these frameworks is as simple as referencing the required node packages, importing the required modules, and implementing the required framework script code to initialize the designer.
Customize The JavaScript Designer Ribbon
The Designer Ribbon Component provides the DefaultConfig field which contains the default configuration of designer components in a command tree structure. Using this, developers can make desired customizations in the config structure and then, pass the new config structure when initiating the designer component.
Optional License Upgrade for PivotTable Support
SpreadJS offers an optional license add on to include support for PivotTables. A PivotTable Enabled Designer Ribbon Component will show the user the Pivot Area, Pivot Panel, and a PivotTable Analyze Tab on the UI ribbon to easily create the PivotTable and analyze data.
Bind File Import Events
Developers can add functions in the SpreadJS Designer Ribbon Component during file import operations. This allows them to perform complex calculations, data transformations, and validations on the imported spreadsheet data. All-in-all creating more robust, efficient, and tailored solutions for data processing and analysis.
Add a Custom Component
The Designer Ribbon Component supports adding custom components, such as a specialized chart or a custom data input control, to enhance the functionality of the designer. By adding this custom component, you can provide users with advanced data visualization capabilities or enable them to input data in a more intuitive and tailored manner.
Desktop Spreadsheet Designer Application
Easily design JavaScript spreadsheets with SpreadJS’s Desktop Spreadsheet Designer WYSIWYG spreadsheet designer. Quickly design complex spreadsheet layouts using a familiar UI. You can also load existing Excel .xlsx template files and start being productive immediately. Supports creating templates that can populate data at run-time. Export your finished spreadsheet to .ssjson, or .xlsx to load into your SpreadJS application.
To install the Spreadsheet Designer App, open the downloaded SpreadJS zip file, navigate to the “Designer\Designer Runtime” folder, and select “SpreadJS-Designer-x-x-x” application.
Design Spreadsheets with Familiar UI
SpreadJS’s Desktop Designer Application provides users with the flexibility to customize a spreadsheet easily in a few clicks. The designer includes ribbon, formula bar, status bar, side panel, and context menu. The built-in dialogs and options can be used to define minute details like hyperlink's link color, cell padding, spreadsheet settings, etc.
Open and Save Files
The Designer supports opening and saving existing Excel-formatted (.xlsx), comma-delimited (.csv), and Spread files (.ssjson) files. While saving files, SpreadJS remembers the sheet view position whenever a workbook is saved. Just like in Excel, the next time you open the same workbook, it will automatically scroll to the position where you left off previously before saving it.
Printing JavaScript Spreadsheets
SpreadJS Designer provides a print menu that lets you preview and print all or part of a worksheet or workbook with the information you need. The print menu is accessed in the same "File" window as the New, Import, and Export options.
Create Range Template Cells
The Range Template cell type allows custom rendering of cell data based on a cell range template. Data is bound to the template and rendered into the cell. Create custom rendering, such as card view, multi-row, and custom KPI blocks all without extra code.
Excel-Like Context Menus
SpreadJS Designer includes an Excel-like context pop up menu for interacting with the sheet when the mouse is right-clicked on the control.
Easily Create Table Slicers
Similar to filters, Excel-like slicers offer an intuitive visual way to filter your spreadsheet data. You can create a slicer for a table using the SpreadJS Designer.
What's New in SpreadJS v18
SpreadJS v18 is available! This release offers several great new enhancements and features to its JavaScript spreadsheet component and optional add-ons including:
- NEW! DataCharts Add-On
- Right-to-Left Document Mode and Text Direction
- Bind Tables to a Data Manager Table
- Horizontal Scrolling with Shift+Mouse Wheel
- Search Cell Comments
- ComboBox CellType Data Source Binding Support
- New Aggregation Functions (GROUPBY, PIVOTBY, and PERCENTOF)
- Support to Change a PivotTable Data Source
- Show Subtotal in Single Field
- Filter Dialog Keyboard Operations Support
- ReportSheet Chart Support - With NEW DataCharts Add-On
- Expand/Collapse All cells and dependent cells
- PREVIEW! Collaboration Add-On
- Support for Angular v18
- And Much More!
SpreadJS Media and Content
Award-Winning Products and First-Class Support
"I have been using a various form of Spread back to the COM days. Spread is the most reliable spreadsheet that retrieves and stores data, whether interacting with a database or simply an Excel file. Try it out, and you will not go back to any other control"
TRUSTED CUSTOMER
"Great support through evaluation process, Spread is my favorite development add-in, adds great, high value capabilities to applications!"
TRUSTED CUSTOMER
"Excellent Products. I have been using their products for around 15 years. Always there to help."
TRUSTED CUSTOMER
 |
 |
MESCIUS Spread is Trusted by the World's Leading Companies
