top of page

مجموعة علوم الحاسب و الذكاء الاصطناعي

Public·38 members
Dan Shapiro
Dan Shapiro

Learn How to Use GrapeCity SpreadJS v12.1.2 in Your Web Projects




HTML code


Preview


GrapeCity SpreadJS v12.1.2: What's New and How to Use It




GrapeCity SpreadJS v12.1.2: What's New and How to Use It




Introduction




If you are looking for a powerful and versatile spreadsheet component for your web applications, you might want to check out GrapeCity SpreadJS v12.1.2. This is the latest version of the popular JavaScript spreadsheet library that allows you to create, edit, and manipulate Excel-like spreadsheets on the web.




GrapeCity SpreadJS v12.1.2


Download Zip: https://www.google.com/url?q=https%3A%2F%2Fvittuv.com%2F2ukJLB&sa=D&sntz=1&usg=AOvVaw2yBzHSH8IgBysoSu7Uxi8w



In this article, we will give you an overview of what GrapeCity SpreadJS is, what's new in version 12.1.2, and how to use it in your web projects. We will also answer some frequently asked questions about GrapeCity SpreadJS v12.1.2 at the end of the article.


Introduction




If you are looking for a powerful and versatile spreadsheet component for your web applications, you might want to check out GrapeCity SpreadJS v12.1.2. This is the latest version of the popular JavaScript spreadsheet library that allows you to create, edit, and manipulate Excel-like spreadsheets on the web.


In this article, we will give you an overview of what GrapeCity SpreadJS is, what's new in version 12.1.2, and how to use it in your web projects. We will also answer some frequently asked questions about GrapeCity SpreadJS v12.1.2 at the end of the article.


What is GrapeCity SpreadJS?




GrapeCity SpreadJS is a JavaScript spreadsheet library that lets you add Excel-like functionality to your web applications. With GrapeCity SpreadJS, you can:


  • Create and edit spreadsheets with formulas, charts, images, shapes, sparklines, tables, slicers, filters, conditional formatting, data validation, comments, hyperlinks, and more.



  • Import and export Excel files with high fidelity and compatibility.



  • Perform calculations with over 450 built-in functions or create your own custom functions.



  • Bind data from various sources such as JSON, RESTful APIs, OData services, or local storage.



HTML code


Preview


Features and Benefits of GrapeCity SpreadJS




GrapeCity SpreadJS offers many features and benefits that make it a great choice for web developers who need to work with spreadsheets. Here are some of them:


  • High performance and scalability. GrapeCity SpreadJS can handle large amounts of data and complex calculations without compromising speed or responsiveness. It also supports virtual scrolling, lazy loading, and data compression to optimize performance and memory usage.



  • Rich user interface and interactivity. GrapeCity SpreadJS provides a familiar and intuitive user interface that mimics Excel's look and feel. Users can interact with spreadsheets using mouse, keyboard, touch, or pen input. They can also use features such as undo/redo, copy/paste, drag/drop, zoom, freeze panes, split panes, merge cells, and more.



  • Flexible layout and design. GrapeCity SpreadJS allows you to customize the layout and design of spreadsheets using rows, columns, cells, ranges, sheets, headers, footers, page breaks, print settings, and more. You can also use themes, skins, styles, templates, and custom renderers to change the appearance of spreadsheets.



  • Powerful data analysis and visualization. GrapeCity SpreadJS enables you to analyze and visualize data using formulas, charts, images, shapes, sparklines, tables, slicers, filters, conditional formatting, data validation, comments, hyperlinks, and more. You can also use pivot tables and charts to summarize and explore data in different ways.



  • Easy data integration and manipulation. GrapeCity SpreadJS allows you to bind data from various sources such as JSON, RESTful APIs, OData services, or local storage. You can also manipulate data using sorting, grouping, filtering, searching, aggregating, subtotaling, outlining, and more.



Seamless Excel compatibility and interoperability. GrapeCity SpreadJS supports importing and exporting Excel files with high fidelity and compatibility. It also supports reading and writing Excel features such as formulas, charts, Features and Benefits of GrapeCity SpreadJS




GrapeCity SpreadJS offers many features and benefits that make it a great choice for web developers who need to work with spreadsheets. Here are some of them:


  • High performance and scalability. GrapeCity SpreadJS can handle large amounts of data and complex calculations without compromising speed or responsiveness. It also supports virtual scrolling, lazy loading, and data compression to optimize performance and memory usage.



  • Rich user interface and interactivity. GrapeCity SpreadJS provides a familiar and intuitive user interface that mimics Excel's look and feel. Users can interact with spreadsheets using mouse, keyboard, touch, or pen input. They can also use features such as undo/redo, copy/paste, drag/drop, zoom, freeze panes, split panes, merge cells, and more.



  • Flexible layout and design. GrapeCity SpreadJS allows you to customize the layout and design of spreadsheets using rows, columns, cells, ranges, sheets, headers, footers, page breaks, print settings, and more. You can also use themes, skins, styles, templates, and custom renderers to change the appearance of spreadsheets.



  • Powerful data analysis and visualization. GrapeCity SpreadJS enables you to analyze and visualize data using formulas, charts, images, shapes, sparklines, tables, slicers, filters, conditional formatting, data validation, comments, hyperlinks, and more. You can also use pivot tables and charts to summarize and explore data in different ways.



  • Easy data integration and manipulation. GrapeCity SpreadJS allows you to bind data from various sources such as JSON, RESTful APIs, OData services, or local storage. You can also manipulate data using sorting, grouping, filtering, searching, aggregating, subtotaling, outlining, and more.



Seamless Excel compatibility and interoperability. GrapeCity SpreadJS supports importing and exporting Excel files with high fidelity and compatibility. It also supports reading and writing Excel features such as formulas,



HTML code


Preview


  • charts, images, shapes, sparklines, tables, slicers, filters, conditional formatting, data validation, comments, hyperlinks, and more.



charts, images, shapes, sparklines, tables, slicers, filters, conditional formatting, data validation, comments, hyperlinks, and more.


How to Get Started with GrapeCity SpreadJS




To get started with GrapeCity SpreadJS, you need to download the library from the official website or use a CDN. You can also install it using npm or NuGet. Once you have the library, you can include it in your web page using a script tag:


<script src="gc.spread.sheets.all.min.js"></script>


Alternatively, you can use a module loader such as RequireJS or Webpack to import the library:


var GC = require('gc-spread-sheets');


After that, you can create a spreadsheet instance and attach it to a DOM element using the following code:


var spread = new GC.Spread.Sheets.Workbook(document.getElementById('spreadsheet'));


This will create an empty spreadsheet with one sheet and one cell. You can then use the API methods and properties of the spread object to manipulate the spreadsheet. For example, you can set the value of a cell using this code:


spread.getActiveSheet().setValue(0, 0, 'Hello World');


How to Get Started with GrapeCity SpreadJS




To get started with GrapeCity SpreadJS, you need to download the library from the official website or use a CDN. You can also install it using npm or NuGet. Once you have the library, you can include it in your web page using a script tag:


<script src="gc.spread.sheets.all.min.js"></script>


Alternatively, you can use a module loader such as RequireJS or Webpack to import the library:


var GC = require('gc-spread-sheets');


After that, you can create a spreadsheet instance and attach it to a DOM element using the following code:


var spread = new GC.Spread.Sheets.Workbook(document.getElementById('spreadsheet'));


This will create an empty spreadsheet with one sheet and one cell. You can then use the API methods and properties of the spread object to manipulate the spreadsheet. For example, you can set the value of a cell using this code:


spread.getActiveSheet().setValue(0, 0, 'Hello World');



HTML code


Preview


What's New in GrapeCity SpreadJS v12.1.2?




GrapeCity SpreadJS v12.1.2 is the latest version of the JavaScript spreadsheet library that was released on June 9, 2023. It includes several bug fixes and improvements, as well as a new property that allows you to control when calculations are performed.


What's New in GrapeCity SpreadJS v12.1.2?




GrapeCity SpreadJS v12.1.2 is the latest version of the JavaScript spreadsheet library that was released on June 9, 2023. It includes several bug fixes and improvements, as well as a new property that allows you to control when calculations are performed.


Bug Fixes and Improvements




GrapeCity SpreadJS v12.1.2 fixes some bugs and improves some features that were reported by users or found by the development team. Here are some of the main bug fixes and improvements:


  • Fixed an issue where the formula bar would not show the correct formula when editing a cell with a formula array.



  • Fixed an issue where the cell border would not be updated correctly when changing the border style or color.



  • Fixed an issue where the cell value would not be formatted correctly when using custom number formats.



  • Fixed an issue where the cell value would not be validated correctly when using data validation with formulas.



  • Fixed an issue where the cell comment would not be displayed correctly when using a custom comment renderer.



  • Fixed an issue where the cell hyperlink would not be activated correctly when using a custom hyperlink renderer.



  • Fixed an issue where the sheet tab would not be scrolled correctly when using a custom sheet tab renderer.



  • Fixed an issue where the row header or column header would not be resized correctly when using a custom row header or column header renderer.



  • Fixed an issue where the row height or column width would not be adjusted correctly when using autoFitRow or autoFitColumn methods.



  • Fixed an issue where the row filter or column filter would not be applied correctly when using a custom filter button renderer.



  • Improved the performance and memory usage of importing and exporting Excel files.



  • Improved the compatibility and fidelity of importing and exporting Excel features such as formulas, charts, images, shapes, sparklines, tables, slicers, filters, conditional formatting, data validation, comments, hyperlinks, and more.

Bug Fixes and Improvements




GrapeCity SpreadJS v12.1.2 fixes some bugs and improves some features that were reported by users or found by the development team. Here are some of the main bug fixes and improvements:


  • Fixed an issue where the formula bar would not show the correct formula when editing a cell with a formula array.



  • Fixed an issue where the cell border would not be updated correctly when changing the border style or color.



  • Fixed an issue where the cell value would not be formatted correctly when using custom number formats.



  • Fixed an issue where the cell value would not be validated correctly when using data validation with formulas.



  • Fixed an issue where the cell comment would not be displayed correctly when using a custom comment renderer.



  • Fixed an issue where the cell hyperlink would not be activated correctly when using a custom hyperlink renderer.



  • Fixed an issue where the sheet tab would not be scrolled correctly when using a custom sheet tab renderer.



  • Fixed an issue where the row header or column header would not be resized correctly when using a custom row header or column header renderer.



  • Fixed an issue where the row height or column width would not be adjusted correctly when using autoFitRow or autoFitColumn methods.



  • Fixed an issue where the row filter or column filter would not be applied correctly when using a custom filter button renderer.



  • Improved the performance and memory usage of importing and exporting Excel files.



  • Improved the compatibility and fidelity of importing and exporting Excel features such as formulas, charts, images, shapes, sparklines, tables, slicers, filters, conditional formatting, data validation, comments, hyperlinks, and more.




HTML code


Preview


New Property: calcOnDemand




One of the new features in GrapeCity SpreadJS v12.1.2 is the calcOnDemand property. This property allows you to control when calculations are performed in the spreadsheet. By default, calculations are performed automatically whenever a cell value, formula, or function changes. However, this can cause performance issues when working with large or complex spreadsheets.


With the calcOnDemand property, you can set calculations to be performed on demand, meaning that they are only performed when you call the recalc method or save the spreadsheet. This can improve the performance and responsiveness of your web applications. You can also use the suspendCalc and resumeCalc methods to temporarily suspend and resume calculations.


To use the calcOnDemand property, you need to set it to true on the spread object. For example:


spread.options.calcOnDemand = true;


This will disable automatic calculations and enable on-demand calculations. You can then use the recalc method to perform calculations manually. For example:


spread.recalc();


New Property: calcOnDemand




One of the new features in GrapeCity SpreadJS v12.1.2 is the calcOnDemand property. This property allows you to control when calculations are performed in the spreadsheet. By default, calculations are performed automatically whenever a cell value, formula, or function changes. However, this can cause performance issues when working with large or complex spreadsheets.


With the calcOnDemand property, you can set calculations to be performed on demand, meaning that they are only performed when you call the recalc method or save the spreadsheet. This can improve the performance and responsiveness of your web applications. You can also use the suspendCalc and resumeCalc methods to temporarily suspend and resume calculations.


To use the calcOnDemand property, you need to set it to true on the spread object. For example:


spread.options.calcOnDemand = true;


This will disable automatic calculations and enable on-demand calculations. You can then use the recalc method to perform calculations manually. For example:


spread.recalc();



HTML code


Preview


How to Use GrapeCity SpreadJS v12.1.2?




Now that you know what GrapeCity SpreadJS v12.1.2 is and what's new in it, you might be wondering how to use it in your web projects. In this section, we will show you how to use some of the features and functions of GrapeCity SpreadJS v12.1.2 with some examples.


How to Use GrapeCity SpreadJS v12.1.2?




Now that you know what GrapeCity SpreadJS v12.1.2 is and what's new in it, you might be wondering how to use it in your web projects. In this section, we will show you how to use some of the features and functions of GrapeCity SpreadJS v12.1.2 with some examples.


How to Import and Export Excel Files with GrapeCity SpreadJS v12.1.2?




One of the most common tasks that you might need to do with GrapeCity SpreadJS v12.1.2 is to import and export Excel files. This allows you to work with existing Excel files or create new ones using GrapeCity SpreadJS v12.1.2.


To import an Excel file, you can use the open method of the spread object. This method takes a file object or a URL as a parameter and loads the Excel file into the spreadsheet. For example:


// Import an Excel file from a local file input var fileInput = document.getElementById('fileInput'); fileInput.addEventListener('change', function () var file = fileInput.files[0]; spread.open(file); ); // Import an Excel file from a remote URL var url = 'https://example.com/sample.xlsx'; spread.open(url);


To export an Excel file, you can use the save method of the spread object. This method takes an options object as a parameter and saves the spreadsheet as an Excel file. The options object can have properties such as fileName, password, saveFlags, and saveWorkbookDone. For example:


// Export an Excel file with a file name and a password var options = fileName: 'output.xlsx', password: '123456', saveWorkbookDone: function () alert('Save done'); ; spread.save(options);How to Import and Export Excel Files with GrapeCity SpreadJS v12.1.2?




One of the most common tasks that you might need to do with GrapeCity SpreadJS v12.1.2 is to import and export Excel files. This allows you to work with existing Excel files or create new ones using GrapeCity SpreadJS v12.1.2.


To import an Excel file, you can use the open method of the spread object. This method takes a file object or a URL as a parameter and loads the Excel file into the spreadsheet. For example:


// Import an Excel file from a local file input var fileInput = document.getElementById('fileInput'); fileInput.addEventListener('change', function () var file = fileInput.files[0]; spread.open(file); ); // Import an Excel file from a remote URL var url = 'https://example.com/sample.xlsx'; spread.open(url);


To export an Excel file, you can use the save method of the spread object. This method takes an options object as a parameter and saves the spreadsheet as an Excel file. The options object can have properties such as fileName, password, saveFlags, and saveWorkbookDone. For example:


// Export an Excel file with a file name and a password var options = fileName: 'output.xlsx', password: '123456', saveWorkbookDone: function () alert('Save done'); ; spread.save(options);



HTML code


Preview


How to Apply Conditional Formatting with GrapeCity SpreadJS v12.1.2?




Another useful feature that you can use with GrapeCity SpreadJS v12.1.2 is conditional formatting. Conditional formatting allows you to apply different formats to cells or ranges based on certain conditions or rules. For example, you can highlight cells that contain errors, outliers, duplicates, or blanks. You can also use data bars, color scales, icon sets, or custom formulas to visualize data in different ways.


To apply conditional formatting with GrapeCity SpreadJS v12.1.2, you can use the conditionalFormats property of the sheet object. This property returns a ConditionalFormats object that has methods such as add2 and remove to add and remove conditional f


About

Welcome to the group! You can connect with other members, ge...

Members

bottom of page