ActiveReports 14 .NET Edition
ActiveReports 14 User Guide / Samples and Walkthroughs / Walkthroughs / Section Report Walkthroughs / Parameters / Parameters for Charts
In This Topic
    Parameters for Charts
    In This Topic

    Using parameters you can connect your report to the chart control. By setting the parameter on the field that connects the report to the chart, the report passes the data to display in the chart. This walkthrough illustrates how to link report with chart using parameters.

     

    The walkthrough is split up into the following activities:

    When you complete this walkthrough you get a layout that looks similar to the following at run time:

    Using Paramters for Chart at Run Time

    Using Paramters for Chart at Run Time

    Note: This topic uses table from the NorthWind database. The NWIND.mdb file can be downloaded from GitHub: ..\Samples14\Data\NWIND.mdb.

    To add an ActiveReport to the Visual Studio project

    1. Create a new Visual Studio project.
    2. From the Project menu, select Add New Item.
    3. In the Add New Item dialog that appears, select ActiveReports 14 Section Report (code-based) and in the Name field, rename the file as rptChartParams.
    4. Click the Add button to open a new section report in the designer.

    See Quick Start for information on adding different report layouts.

    To connect the report (rptChartParams) to a data source

    1. On the detail section band, click the Data Source Icon.
      Data Source Icon
    2. In the Report Data Source dialog that appears, from the OLE DB tab, create a data source connection. See Bind Reports to a Data Source for further details.
    3. Once the connection string field is populated, in the Query field, enter the following SQL query.
      SQL Query
      Copy Code
      SELECT * FROM Products ORDER BY CategoryID, ProductName
    4. Click OK to save the data source and return to the report design surface.

    To add controls to the report to display data

    1. On the design surface, right click the PageHeader or PageFooter section and select Delete to remove the PageHeader/Footer pair.
    2. Right click on the design surface and insert GroupHeader/Footer section pair.
    3. Click the GroupHeader section to select it and go to the Properties window to set the following properties:
      Property Name Property Value
      Name ghCategoryID
      DataField CategoryID
      GroupKeepTogether All
      Height 5.65 inches
    4. Set Height property of Detail section to 0.23 inches and of GroupFooter section to 0 inch.
    5. From the Visual Studio toolbox, drag and drop the following controls onto the GroupHeader section and set their properties as given below:

      Label1

      Property Name Property Value
      Name lblCategoryID
      Text CategoryID
      Location 1.78, 0

      Label2

      Property Name Property Value
      Name lblProductName
      Text Product Name
      Location 0.23, 5.43

      Label3

      Property Name Property Value
      Name lblUnitsInStock
      Text Inventory stock
      Location 5, 5.43

      TextBox

      Property Name Property Value
      DataField CategoryID
      Name txtCategoryID
      Text CategoryID
      Location 3.72, 0

      Chart

      Property Name Property Value
      Name ChartControl
      Location 0, 0.313
      Size 6.5, 4.66
    6. From the Visual Studio toolbox, drag and drop the following controls onto the detail section and set their properties as given below:

      TextBox1

      Property Name Property Value
      DataField ProductName
      Name txtProductName
      Text ProductName
      Location 0.23, 0

      TextBox2

      Property Name Property Value
      DataField UnitsInStock
      Name txtUnitsInStock
      Text UnitsInStock
      Location 5, 0

    To connect the Chart to a data source

    1. Select the Chart control and at the bottom of the Properties window, select the Data Source command. See Properties Window for further details on accessing commands.
      Tip: If the verb is not visible, right-click an empty space in the Properties Window and select Commands to display verbs.
    2. In the Chart DataSource dialog box that appears, click the Build button.
    3. In the Data Link Properties window, select Microsoft Jet 4.0 OLE DB Provider and click the Next button.
    4. Click the ellipsis button (...) to browse to the NorthWind database. Click Open once you have selected the file.
    5. Click the OK button to close the window and fill in the Connection String.
    6. In the Query field, enter the following parameterized SQL query.
      SQL Query
      Copy Code
      SELECT * FROM Products WHERE CategoryID = <%CategoryID||1%> ORDER BY ProductName
      Note: The chart data cannot be arranged if ORDER is not set in both the SQL statements (report and chart statement).
    7. Click OK to save the data source.

    To configure the appearance of the Chart

    1. With the chart control selected, go to the Properties window, click the ChartAreas (Collection) property and then click the ellipsis button that appears.
    2. In the ChartArea Collection Editor that appears with defaultArea selected under the members list, click its Axes (Collection) property and then click the ellipsis button.
    3. In the AxisBase Collection Editor that appears, set the following properties.

      AxisBase

      1. With AxisX selected under members list, set Angle property of LabelFont to -90.
         
        AxisBase Collection Editor

        AxisBase Collection Editor

      2. Delete text from Title property to make sure that the ProductName label (lblProductName) does not overlap.
      3. Click AxisY under the members list and set its Title property to Unit Stock.
      4. With AxisY selected under the members list, expand the GridLine section under MajorTick property tree view and set its following sub-properties.
        Property Name Property Value
        Style Dot
        Color Silver
        Weight 1

        AxisBase Collection Editor

        AxisBase Collection Editor

      5. Click OK to return back to ChartArea collection editor and then click OK again to return back to report design surface.
    4. With the chart control selected, go to the Properties window, click the ChartSeries (Collection) property and then click the ellipsis button that appears.
    5. In the Series Collection Editor that appears, set the following properties:

      Series

      1. With Series1 selected under the members list, set its following properties:
        Property Name Property Value
        ValueMembersY UnitsInStock
        ValueMembersX ProductName

        Series Collection Editor

        Series Collection Editor

      2. Click OK to return back to report design surface.
    6. With the chart control selected, go to the Properties window, click the Titles (Collection) property and then click the ellipsis button that appears.
    7. In the Title Collection Editor that appears, set the following properties:

      Titles

      1. With Header selected under the members list, set its Text property to Product Inventory.
        Title Collection Editor

        Title Collection Editor

      2. Delete/Remove Footer from the members list.
      3. Click OK to return back to report design surface.
    8. With the chart control selected, go to the Properties window, click the Legends (Collection) property and then click the ellipsis button that appears.
    9. In the Legend Collection Editor that appears, set the following properties:

      Legends

      1. With defaultLegend selected under the members list, set its Visible property to False.
        Legend Collection Editor

        Legend Collection Editor

      2. Click OK to return back to report design surface.

    To view the report

    • Click the preview tab to view the report at design time.

    OR