Data Binding Settings

The Data Binding tab in the Data Chart Panel provides various settings that help you bind your Data Chart to the DataManager table or a specific cell. The data displayed in the Data Chart is set up through this part.

Table Binding

When binding a Data Chart to a table in the DataManager, you need to bind the table name and the fields you want to display. If you switch the bound table, all the previously bound fields in the Data Chart will be cleared, and users need to bind them again.

To add a data source, use the DataSource button from the DATA > Data Binding tab group. In the Data Source, you can add tables and provide the external URL for CRUD operations. You can further fetch the table's column using the Columns tab.

After fetching the data source using SpreadJS Designer, you can now bind the table's data into the Data Chart through the Data Chart Panel. To do this, select the table from the Selected Table dropdown.

Drag and drop the fields of the table to the binding area to complete the binding. While binding, ensure that the Value area in the Data Chart must be bound to the fields. Without this, the Data Chart will display default data instead of the bound data. When binding fields, multiple Value and Colors fields cannot coexist if the current Data Chart has both fields.

Use the Filter Icon to set up filter rules to filter the field data in the table. Note that you can only filter the fields from the currently bound table.

After binding data to the Data Chart, click on the Settings button next to the bound field for additional configurations.

Note: Different Data charts require different binding fields. (e.g. the binding (X/Y) is required in the Scatter Data chart)

Cell Binding

If you are binding a Data Chart in the ReportSheet, you can also bind data to an individual expandable cell by selecting the Cell Binding option from the Binding Mode dropdown.

Then, click the upper right (+) button in each bound data area to bind the cell. Each bound cell has a Display Name, which acts as the alias of the bound cell and is also displayed on the Data Chart.

Note:

• When binding fields, multiple Value and Colors fields cannot coexist if the current Data Chart has both fields. If multiple Value fields are set, no additional Color fields can be set, or vice versa.

• In a ReportSheet, if the Data Chart is bound to a cell reference, the Data Chart will only render the default data binding provided by SpreadJS during the design phase of the ReportSheet. Switch to ReportSheet’s Preview or Paginate mode to see the actual bound data.