GanttSheet IO

You can import and export GanttSheet in various formats, such as JSON, SJS, and Excel. SpreadJS also supports printing and exporting to PDF format.

To support the GanttSheet IO features (except JSON serialization/deserialization), it is necessary to add specific script files based on the IO operations for reference. For example,

<script src="scripts/gc.spread.sheets.tablesheet.x.x.x.min.js"></script>
<script src="scripts/gc.spread.sheets.ganttsheet.x.x.x.min.js"></script>
<script src="scripts/gc.spread.sheets.print.x.x.x.min.js"></script>
<script src="scripts/gc.spread.sheets.pdf.x.x.x.min.js"></script>
<script src="scripts/gc.spread.sheets.io.x.x.x.min.js"></script>

Open and Import

For GanttSheet JSON serialization and deserialization you need to use the toJSON and the fromJSON methods of the Workbook class. GanttSheet JSON data is stored in workbookJSONData.sheetTabs and the specified properties of GanttSheet are stored in ganttSheetTabData.gantt. Additionally, the sheetType property is required for distinguishing between TableSheet and GanttSheet during the fromJSON process.

You can open and import different file types. To open the SJS file type, use the spread.open() method with openOptions. If the file type is SSJson or Excel, use spread.import() method with importSSJsonOptions or importXlsxOptions for importing.

The code below depicts how to open and import files to the Spread control.

function openFile(e) {
    var fileNameItem = document.getElementById("file-name");
    var fileInput = document.getElementById("file-input");
    fileNameItem.value = 'Loading file...';
    var file = fileInput.files[0];
    if (!file) {
        alert("Upload a file first.");
        return;
    }

    const fileName = file.name;
    const extensionName = fileName.substring(fileName.lastIndexOf(".") + 1);

    // Define options to open an SJS file.
    const openOptions = {
        "openMode": GC.Spread.Sheets.OpenMode.normal,
        "includeStyles": true,
        "includeFormulas": true,
        "fullRecalc": false,
        "dynamicReferences": true,
        "calcOnDemand": false,
        "includeUnusedStyles": true
    }

    // Define options to import an SSJson file.
    const importSSJsonOptions = {
        "includeStyles": true,
        "includeFormulas": true,
        "frozenColumnsAsRowHeaders": false,
        "frozenRowsAsColumnHeaders": false,
        "fullRecalc": false,
        "incrementalLoading": false
    }

    // Define options to import an Excel file.
    const importXlsxOptions = {
        "openMode": GC.Spread.Sheets.OpenMode.normal,
        "includeStyles": true,
        "includeFormulas": true,
        "frozenColumnsAsRowHeaders": false,
        "frozenRowsAsColumnHeaders": false,
        "fullRecalc": false,
        "dynamicReferences": true,
        "calcOnDemand": false,
        "includeUnusedStyles": true,
        "password": ""
    }

    // Import SJS file type.
    if (extensionName === 'sjs') {
        spread.open(file, function () {
            fileNameItem.value = fileName;
            fileInput.value = '';
        }, function () { }, openOptions);
    }

    // Import SSJson file type.
    else if (extensionName === 'ssjson') {
        spread.import(file, function () {
            fileNameItem.value = fileName;
            fileInput.value = '';
        }, function () { }, importSSJsonOptions);
    }

    // Import Excel file type.
    else if (extensionName === 'xlsx') {
        spread.import(file, function () {
            fileNameItem.value = fileName;
            fileInput.value = '';
        }, function () { }, importXlsxOptions);
    }
}

Save and Export

To save GanttSheet data to SJS format, you need to use the spread.save() method, specifying the necessary saveOptions. If the file type is SSJson or Excel, use the spread.export() method with exportSSJsonOptions or exportXlsxOptions for exporting.

Notes:
Ensure that the serialization option includeBindingSource is set to true on exporting.
While exporting, the GanttSheet data column is exported as a table and the Gantt chart column is exported as a picture in Excel.

The code below depicts how to save and export files from the Spread control:

function exportFile(fileName) {
    const extensionName = fileName.substring(fileName.lastIndexOf(".") + 1);

    // Define options to export an SSJson file.
    const exportSSJsonOptions = {
        "includeBindingSource": true,
        "includeStyles": true,
        "includeFormulas": true,
        "saveAsView": false,
        "rowHeadersAsFrozenColumns": false,
        "columnHeadersAsFrozenRows": false,
        "includeAutoMergedCells": false,
        "fileType": GC.Spread.Sheets.FileType.ssjson
    }

    // Define options to save an SJS file.
    const saveOptions = {
        "includeBindingSource": true,
        "includeStyles": true,
        "includeFormulas": true,
        "saveAsView": false,
        "includeAutoMergedCells": false,
        "includeCalcModelCache": false,
        "includeUnusedNames": true,
        "includeEmptyRegionCells": true
    }

    // Define options to export an Excel file.
    const exportXlsxOptions = {
        "includeBindingSource": true,
        "includeStyles": true,
        "includeFormulas": true,
        "saveAsView": false,
        "rowHeadersAsFrozenColumns": false,
        "columnHeadersAsFrozenRows": false,
        "includeAutoMergedCells": false,
        "includeCalcModelCache": false,
        "includeUnusedNames": true,
        "includeEmptyRegionCells": true,
        "fileType": GC.Spread.Sheets.FileType.excel
    }

    // Export SJS file type.
    if (extensionName === 'sjs') {
        spread.save(function (blob) { saveAs(blob, fileName); }, function () { }, saveOptions);
    }

    // Export SSJson file type.
    else if (extensionName === 'ssjson') {
        spread.export(function (blob) { saveAs(blob, fileName); }, function () { }, exportSSJsonOptions);
    }

    // Export Excel file type.
    else if (extensionName === 'xlsx') {
        spread.export(function (blob) { saveAs(blob, fileName); }, function () { }, exportXlsxOptions);
    }
}

Save PDF

Export GanttSheet to PDF using the workbook's savePDF() method.

The code below depicts how to export PDF files from the Spread control:

function ExportToPDF(spread) {
            spread.savePDF(function (blob) {
                var url = URL.createObjectURL(blob);
                pwin = window.open(url);
            });
}

Print GanttSheet

GanttSheet printing is done with the print() method of the Workbook class. Generally, the Gantt chart column is large and cannot be printed on a single page. Hence, it is printed near the last normal column.

The code below depicts how to print of GanttSheet from the Spread control:

function functionPrint(spread) {
    spread.print();
}