Skip to main content

Obtain and Set Values in Chart Views

  • 7 minutes to read

This topic describes how you can get and set category values and series values in a Chart View. For information on getting and setting cell values in a (Banded) Table View or a Card View please refer to the Obtain and Set Cell Values topic.

Items in a Chart View are represented by categories and data series. In a data-aware View items refer to the fields in the data source. Since a Chart View simply displays the data in the form of graphical shapes (for instance, bars or columns) it doesn’t provide facilities for an end-user to supply additional values or edit the values of the items used to render the Chart View. That is the values should be provided and edited in code. The methods used to get and set the category values and series values are described below and can be used for both data-aware and non data-aware Chart Views.

Every Chart View has Categories and Series properties which provide access to the categories and data series created within the View. The Categories properties refer to the items of the TcxGridChartCategories and TcxGridDBChartCategories classes. The Series properties represent an indexed collections of the series and address the items of the TcxGridChartSeries and TcxGridDBChartSeries classes. A specific series in the Series collections can be addressed by its index (position) within the collection.

Please refer to the Create and Delete Series topic for details on managing the series within the Chart View.

The category values can be accessed via the Categories.Values property which represents an indexed collection. Similarly, the Values indexed collection contains the series values of a specific series. Note that the View’s ViewData.Categories and ViewData.Values properties provide access to the same collections of category values and series values. The ViewData.Values property provides the series values for all the series. To address the value of a specific series, you need to pass the index of the series as the first parameter.

Since each series provides a series value for each category the total number of series values within each series is equal to the total number of category values and can be determined via the View’s ViewData.CategoryCount property (or either via the ValueCount property of a series or the View’s Categories.ValueCount property which provides the same resulting value). In other words, adding a new category automatically assumes specifying series values for this category and vice versa. These properties are not read-only and this allows you to modify the number of series and category values used to render the Chart View.

Adding new category values and series values by increasing one of the abovementioned properties and subsequently initializing the corresponding entries in the Categories.Values and the Values collections of series with new values is one of the possible ways to insert series data into the Chart View. The other possible and straightforward method is to call the AddValue function of a series which adds a new series value and returns its index (position) within the Values collection of this series. The index can then be used to specify the category value and series values of the other series within the category for example.

Get/set values in unbound mode

Consider the example shown in the Chart View Tutorial topic. Use the suggestions in the Chart View Tutorial. Step 1: View Creation topic as general instructions for creating a non data-aware Chart View. Sequentially select the grid control, the created View and the existing level to use the Object Inspector to set their Name properties to Grid, chvCars and lvCars, respectively. Here’s the look of the form so far:

The following code creates two series in the chvCars View, adds a category by adding a new series value and specifies a category value and a series values for the second series in the created category.

var
  ASeries: TcxGridChartSeries;
  ACategoryIndex: Integer;
begin
  chvCars.ClearSeries;
  ASeries := chvCars.CreateSeries;
  ASeries.DisplayText := 'Cyl';
  ASeries.DataBinding.ValueType := 'Smallint';
  ACategoryIndex := ASeries.AddValue(6);
  ASeries := chvCars.CreateSeries;
  chvCars.ViewData.Values[ASeries.Index, ACategoryIndex] := 3;
  ASeries.DisplayText := 'Liter';
  chvCars.Categories.Values[ACategoryIndex] := 'BMW 530i';
end;

Note that the series value of the second series is addressed via the ViewData.Values property, which uses the index of the second series to specify the series for which the value is being set. Here we need to specify the values of the DisplayText properties for the series. As for a data-aware series, the descriptive text for the series is by default determined from the bound field’s display name.

The resulting View is shown in the screenshot below:

Get/set values in bound mode

The principles of getting and setting values in bound mode are the same as the technique described above for unbound mode. For data-aware Views, you are also able to access the values of the records which correspond to categories and series using the TDataSet and TField members. Below, how to connect the data-aware Chart View to a dataset and use the DataBinding objects to access to the data in the underlying database is explained.

For demonstration purposes, a data-aware Chart View needs to be created. Use the suggestions in the Chart View Tutorial. Step 1: View Creation topic as general instructions for creating a data-aware Chart View. Instead of using a query to access the CARS table that is shipped with the EQGrid demos we will use a TTable. Activate the BDE tab of the component palette, place a TTable component on the form and set its properties as follows:

  • DatabaseName to DemosDB

  • Name to tableCars

  • TableName to Cars.DB

  • Active to True. Note that the Active property must be set after all the other properties have been set.

Then switch to the Data Access tab of the component palette and place a TDataSource component on the form. Rename the component to dsCars. Do not connect it to tableCars as this will be done in code. Sequentially select the grid control, the created View and the existing level to use the Object Inspector and set their Name properties to Grid, chvDBCars and lvCars respectively. Here’s the look of the form so far:

The following code connects the View to the CARS table, filters the data in the table by a car category (so as to display saloon cars only), creates two series and binds a category and the created series to the fields of the CARS table. This connects the View to the data so it can be properly displayed within chart diagrams. After that the code inserts the data for a new category by inserting a new record into the table and initializing the record according to the category value and series values.

var
  ASeriesCyl: TcxGridDBChartSeries;
  ASeriesLiter: TcxGridDBChartSeries;
begin
  tableCars.Filter := 'Category = ''SALOON''';
  tableCars.Filtered := True;
  dsCars.DataSet := tableCars;
  chvDBCars.DataController.DataSource := dsCars;
  chvDBCars.ClearSeries;
  ASeriesCyl := chvDBCars.CreateSeries;
  ASeriesCyl.DataBinding.FieldName := 'CYL';
  ASeriesLiter := chvDBCars.CreateSeries;
  ASeriesLiter.DataBinding.FieldName := 'LITER';
  chvDBCars.Categories.DataBinding.FieldName := 'Model';
  chvDBCars.DataController.Append;
  tableCars.FindField('Category').AsString := 'SALOON';
  ASeriesCyl.DataBinding.Field.AsInteger := 6;
  ASeriesLiter.DataBinding.Field.AsFloat := 3.0;
  chvDBCars.Categories.DataBinding.Field.AsString := '530i';
  chvDBCars.DataController.Post;
end;

Note that the Category field in the inserted record is initialized with the ‘SALOON’ string so that the data can be displayed within the column diagram of the View.

The resulting View is shown in the screenshot below:

See Also