BackPrevious Page Next PageNext

Track 1: Self-service Dashboard with JReport

Dashboard is a new way of information delivery. Users can create, edit and browse dashboards from the JReport Server user console using JDashboard. With pre-built library components, users can freely choose the objects they want to display in a dashboard, without having to know how these objects were created, what data sources to use, what styles to set, etc. Report data components and Visual Analysis templates can also be inserted in dashboards directly. A dashboard can hold multiple library components so that when browsing the dashboard users are able to see multiple data aspects. Within a dashboard, library components are able to communicate with each other via the message mechanism. This allows actions such as common filters to be applied to all the components of a dashboard even when coming from different data sources so as to achieve data synchronization. Furthermore, users can run reports and Visual Analysis templates directly by invoking the report studio and Visual Analysis inside JDashboard, without having to switch to the user console. This allows analyzing with different tools in just one JDashboard window.

Task 1: Create a dashboard and insert library components

Task 2: Insert a report component into dashboard

Task 3: Synchronize the components

Task 4: Use a slider to filter on Quantity

Task 5: Insert a third party gadget (stock widget)

Task 6: Export the library components

Task 7: Use the configuration panel to change parameters

Task 8: Share parameters among components

Task 9: Run a report in JDashboard

Task 10: Set a dashboard as the server home page

Note: A JDashboard license for JReport Server is required in order to perform this track. If you do not have the license, please contact your Jinfonet Software account manager to obtain it first.

Task 1: Create a dashboard and insert library components

  1. On the JReport Server Start Page, click Dashboards in the Create category. JDashboard is then displayed in a new window tab, with a blank dashboard created.

    Create Dashboard

  2. Click the Resources button Resources button on the toolbar to display the Resources panel, which lists all the data resources and components that can be inserted in dashboards.
  3. Expand the Component Library > Public Components > SampleReports folder and drag Sales by Category.lc to the dashboard body.
  4. Drag Crosstab.lc in the same folder to the right of the first component.
  5. Click Close button on the top right of the Resources panel to hide the panel.
  6. Click the Arrange button Arrange button on the toolbar to align the two library components.

    Insert Library Components to Dashboard

  7. Click the Save button Save button on the toolbar.
  8. In the Save As dialog, replace Dashboard 1 with Products in the File Name text box, then click OK to save the dashboard into the My Reports folder in the server resource tree..

Task 2: Insert a report component into dashboard

Report components created from business views can be inserted in dashboards directly.

  1. Click Resources button on the toolbar to display the Resources panel.
  2. Go to the Reports > Public Reports > SampleReports folder, expand Shipment Status Report.wls and drag TableComp to the dashboard body below the existing components. Hide the Resources panel.

    Insert Report Component to Dashboard

  3. Save the dashboard.

Task 3: Synchronize the components

In this task, we want to click any value of the Category field in the crosstab to automatically update the chart. This is achieved by delivering a filter synchronization message between the two library components.

  1. Right-click on any Category value in the crosstab column header, Blends for example, and select Send Sync > Filter from the shortcut menu.

    Define Send Sync

  2. The chart automatically receives the synchronization message because it is created based on the same business view as the crosstab and contains the field Category too. To view details of the message, right-click the chart and select Receive Sync. The filter message is shown in the Receive Sync dialog. Close the dialog.

    Define Receive Sync

  3. Click any value in the crosstab column header, for example Bold. The chart is filtered to show data of the Bold category only after it receives the synchronization message.

    You may find that the crosstab is also filtered. This is because at report design time, the library component designer has predefined to make it receive a filter message too. You can right-click on the crosstab and select Receive Sync to view the details if you want.

    Synchronize Components

  4. We will remove the filters from the components. Click the Clear Filters button Clear Filters button on the toolbar.
  5. Click Save button on the toolbar to save the dashboard.

Task 4: Use a slider to filter on Quantity

  1. Click Resources button on the toolbar to display the Resources panel, then from the Toolbox node, drag Filter Control to the dashboard body below the table.
  2. In the Insert Filter Control dialog, input Sales Quantity in the Title text box and select Range Slider as the control type.
  3. Expand the Select Fields drop-down list. The two business views used by the three data components in the dashboard are listed. You can select a common field in both business views to filter the three data component at the same time via the slider. Here we only want to filter data components that use WorldWideSalesBV.

    Select Field for Slider Filter Control

  4. Check Quantity in WorldWideSalesBV, then click outside of the drop-down list to close it. Click OK to insert the slider.

    Insert Slider Filter Control

  5. Hide the Resources panel.

Next, we will use the slider to show the data for Quantity between 5000 and 8000 only.

  1. Uncheck the All checkbox on the slider. Drag the left arrow to set a minimum range 4983 and the right arrow to set a maximum range 8031. The chart and crosstab are filtered. The table uses the other business view so it is not changed.

    Filter by Silder

  2. Save the dashboard.

Task 5: Insert a third party gadget (stock widget)

  1. Click Resources button on the toolbar to display the Resources panel, then drag URL Frame from the Toolbox node to the dashboard body on the right of the slider. The Insert URL Frame dialog is displayed.
  2. In the Title text field, input My Stocks, and in the URL text box, type in http://edulifeline.com/includes/stocks_widget/.

    Insert URL Frame

  3. Click OK. The specified web page is then inserted into the dashboard.

    Insert Web Page

  4. Hide the Resources panel and save the dashboard.

Task 6: Export the library components

  1. Click the Export button Export button on the toolbar. The Export dialog appears.
  2. Select Customize Layout from the Layout drop-down list.

By default, all the exportable library components are arranged using a tabular style according to their positions in the dashboard in the Design tab on the right. Each tabular cell can hold no more than one component. Sliders and gadgets cannot be exported so they are not available here. Next, we will change the layout of the components a little bit by removing the crosstab on the right of the chart and adding it below the table.

  1. Right-click anywhere in the cell containing the crosstab, select Remove from the shortcut menu.

    Remove Crosstab

  2. Scroll down to the blank cell below the table. Drag Crosstab from the Resources box to the cell.

    Add Crosstab Below Table

When exporting tables and crosstabs, by default only the data currently displayed in the dashboard will be exported. In our dashboard the table contains several pages and we can view only one page at a time, that is to say only the currently displayed page will be exported. We want to get the full data of the table in the exported result so we need a further setting.

  1. Right-click in the cell holding the table, select Filter from the shortcut menu, then choose the All option and click OK.
  2. Click the Export button Export button on the toolbar. In the Export dialog, keep the default settings to export the dashboard to a PDF file.

    Export dialog

  3. Click OK. The exporting process begins. When finished, you can open the PDF file to view the result.
  4. Close the Export dialog and save the dashboard.

Task 7: Use the configuration panel to change parameters

When a library component uses parameters and its configuration panel is enabled, you can make use of the configuration panel to change its parameter values.

  1. On the table, place the mouse anywhere on the title bar, then click the Options button Options button that appears on the title bar and select Edit Setting from the drop-down list to display the configuration panel.

    Display Configuration Panel

  2. Click Choose button in the value box for the Shipper parameter. The Enter Values dialog appears.
  3. Check the Custom radio button, select UBS Uniform Logistics and click Add button to add it to the right box, then click OK.

    Enter Parameter Values

  4. Click OK in the configuration panel. The table now shows records of this shipper only.

    Apply Parameter Values to Table

  5. Save the dashboard.

Task 8: Share parameters among components

When two or more library components in a dashboard contain parameters that meet the following cases, the parameters can be shared among them. After sharing parameters, you just need to provide values to one group of the parameters and all related components will be able to receive them.

In this task, we will insert two library components having similar parameters and see the difference between before and after the parameters are shared.

  1. Click Add Dashboard button on the dashboard title bar to add a new dashboard. A new tab is created, labeled Dashboard 2.
  2. Click Resources button on the toolbar to display the Resources panel.
  3. Expand Component Library > Public Components > SampleReports and drag Shipment Status Overview.lc and Shipments by Status.lc one by one to the dashboard body. Hide the Resources panel.
  4. Click the Options button Options button on the toolbar and select Share Parameter. The displayed dialog shows that the two library components have shared parameters. Close the dialog.

    Set Share Parameters

  5. Click the Enter Parameter Values button Enter Parameter Values button on the toolbar. The Enter Parameter Values dialog lists the following parameters. Close the dialog.

    Shared Parameters

Next we will remove the parameter share between the two components to see how many parameters we need to specify.

  1. Click Options button on the toolbar and select Share Parameter. In the displayed dialog, select either component and click the Cancel Share button on the top right, then click OK.
  2. Click Enter Parameter Values button on the toolbar to access the Enter Parameter Values dialog again. Now it lists separate pairs of the Start Date, End Date, and Territory/Shipper parameters used by the two library components. Close the dialog.

    Separated Parameters

  3. Click Save button on the toolbar to save the dashboard as Shipment.

Task 9: Run a report in JDashboard

A report can run in the corresponding report studio within JDashboard. In this task we will run a web report inside JDashboard without going to the server resource tree on the user console.

  1. Keep the Shipment dashboard active.
  2. From the Resources panel, drag Sales Detail Report.wls in the Reports > Public Reports > SampleReports folder to the dashboard body, then hide the panel.
  3. The report is loaded into a separate tab via Web Report Studio within JDashboard.

    Run Report in JDashboard

Task 10: Set a dashboard as the server home page

  1. In the web browser, change from the JDashboard tab to the JReport Start Page tab.
  2. Click Profile in the Manage category.
  3. In the Customize Server Preferences > General tab of the Profile page, check the Use a Dashboard checkbox for the Home Page option, then click OK. Click OK in the prompt message.

    Set Home Page

  4. Click Resources on the system toolbar, then go to the My Reports folder.
  5. Click Shipment.dsh in the folder, the dashboard is loaded into a new JDashboard window.
  6. Click Options button on the toolbar and you can see Set as Server Home is enabled on the menu list. Click the option to set the Shipment dashboard as the server home page.
  7. Refresh the JReport Console page and a Home label is added beside Resources on the system toolbar. Click it and you can access the Shipment dashboard immediately.

    Use Dashboard as Home Page

BackPrevious Page Next PageNext