Pure JS spreadsheet control SpreadJS new version - launch a new Gantt chart plug-in

SpreadJS is a pure front-end table control launched by combining more than 40 years of professional control technology and experience in the field of spreadsheet applications. It is based on HTML5 and is compatible with more than 450 Excel formulas. It has the product features of "high performance, cross-platform, and high compatibility with Excel". It is favored by well-known companies such as Huawei, Mingyuan Cloud, and Yuanguang Software, and has been recognized as "China's Excellent Software Product" by the China Software Industry Association. SpreadJS is highly similar to Excel in terms of interface and function, but it is not limited to Excel. Instead, it provides application scenario support for collaborative editing of table documents, data filling and Excel-like report design for enterprise information systems, which greatly reduces enterprise R&D costs. and project delivery risks.

SpreadJS v16.0 Update1 official version download

Gantt chart is a new plug-in of SpreadJS pure front-end table control, which can convert tabular data such as engineering project management, budget execution and production planning in business scenarios into a more intuitive Gantt chart mode. As a special "Sheet", the Gantt chart can be seamlessly integrated into the existing tables, so that the data can be visualized and displayed, and at the same time, the plan implementation can be displayed more intuitively. The specific effect can be seen in the figure below:

SpreadJS Gantt Chart Atlas

The SpreadJS Gantt chart plugin has the following functions:

1. Display attribute data in the form of Gantt chart

Based on the underlying data model of SpreadJS, the Gantt chart plug-in can display tree data in the form of Gantt chart tables and charts, and supports data containing ID, Level and Children data structures.

// the id-parentId structure
schema: {
hierarchy: {
type: "Parent",
column: "parentId"
},
columns: {
id: { isPrimaryKey: true }, // the primary key is required in Id-ParentId type, so that we could build the hierarchy tree nodes
taskNumber: { dataType: "rowOrder" } // the row order is required in Id-ParentId type, to make sure the you could update the correct data
}
}

// the level structure
schema: {
hierarchy: {
type: "Level",
column: "level"
}
}

// the children tree structure
schema: {
hierarchy: {
type: "ChildrenPath",
column: "children"
}
}