This is the most sophisticated example. Instead of showing a field's value as text, you can change its dimensions to create a chart.

Create the Chart

To create a chart, the first thing you need to do is find out the scale, that is, the measurements that will be used to the maximum and minimum values. The "Sales Chart" report has a field designed to do this. It is a report footer field called SaleAmountMaxFld that has the size of the longest bar you want to appear on the chart, and holds the following expression:
=Max([SaleAmount])

Using Code:

To set the maximum value for the chart, set the SaleAmountMaxFld.Text property. Enter the following code:

To write code in Visual Basic

SaleAmountMaxFld.Text = "Max([SaleAmount])"

To write code in C#

SaleAmountMaxFld.Text = "Max([SaleAmount])";

Using C1ReportDesigner:

To set the maximum value for the chart, set the SaleAmountMaxFld.Text property by completing the following steps:

1. Select the SaleAmountMaxFld from the Properties window drop-down list in the Designer. This reveals the field's available properties.
2. Click the empty box next to the Text property, then click the drop-down arrow, and select Script Editor from the list.
3. In the VBScript Editor, simply type the following script in the window: =Max([SaleAmount])

Draw the Chart's Bars

To draw the actual bars, the report has a detail field called BarFld that is formatted to look like a solid box. The Detail section has the following script assigned to its OnPrint property: BarFld.Width = SaleAmountMaxFld.Width * (SaleAmountFld / SaleAmountMaxFld)

This expression calculates the width of the bar based on the width and value of the reference field and on the value of the SaleAmountFld for the current record.

Using Code:

To draw the actual bars for the chart, set the OnPrint property. Enter the following code:

To write code in Visual Basic

c1r.Sections.Detail.OnPrint = & _    
  "BarFld.Width = SaleAmountMaxFld.Width * " & _    
  "(SaleAmountFld / SaleAmountMaxFld)"

To write code in C#

c1r.Sections.Detail.OnPrint = +      
  "BarFld.Width = SaleAmountMaxFld.Width * " +      
  "(SaleAmountFld / SaleAmountMaxFld)";

Using C1ReportDesigner:

To draw the actual bars for the chart, set the OnPrint property by completing the following steps:

1. Select Detail from the Properties window drop-down list in the Designer. This reveals the Detail section's available properties.
2. Click the empty box next to the OnPrint property, then click the drop-down arrow, and select Script Editor from the list.
3. In the VBScript Editor, simply type the following script in the window:BarFld.Width = SaleAmountMaxFld.Width * (SaleAmountFld / SaleAmountMaxFld)

The following screen capture shows a section of the "Sales Chart" report with the special effects:

For the complete report, see report "Sales Chart" in the NWind.xml report definition file, which is available as part of the NorthWind sample in the ComponentOne Samples folder.