Pages

The default dashboard contains a single page. However, you can easily add pages to a new or existing project.

Add a New Dashboard Page

This creates a new dashboard page from scratch. The page is completely empty until you fill it with appropriate KPIs.

To add a new dashboard page

  1. In the Project Browser, select dashboard.

    Alternatively, you can select main.dashxml in the File Browser.

  2. In the Object Browser, select page-group.

  3. In the Object Palette, select page - New.

    You can also right-click page-group and select Add child tag > page - New.

  4. In the Save File As dialog, specify a name for the new page file and click Save.

    The Preview pane displays a New Page tab, which you can select to see the new page. Another page object is also added to the Object Browser.

    Note: Make sure you have the Currently Viewing drop-down list in the Tool bar set to Entire Dashboard in order to see the effect of adding a page on your entire project.

The new .pagexml file contains only minimal XML, as shown below:

<?xml version="1.0" encoding="ISO-8859-1"?>
<ct:page xmlns:ct="http://www.corda.com/dashboard/namespace"/>

Link to an Existing Dashboard Page

This creates a new dashboard link to an existing page without creating a new page file. This links a single Page file to multiple Page objects in the dashboard object hierarchy, and any changes made to the Page are reflected in all linked Page objects.

Note: The Object Browser identifies a dashboard's multi-linked objects in magenta font to help you avoid making unanticipated changes to your dashboard when modifying a multi-linked object.

To link to an existing dashboard page

  1. In the Project Browser, select dashboard.

    Alternatively, you can select main.dashxml in the File Browser.

  2. In the Object Browser, select page-group.

  3. In the Object Palette, select page - Reference existing.

    Alternatively, you can right-click page-group and select Add child tag > page - Reference existing.

  4. In the Select a Page Definition dialog, browse to and select an existing page file (.pagexml ), then click Open.

    The Preview pane displays a New Page tab in the dashboard navigation. Linking page objects to an existing page file allows you to include the same page throughout the dashboard without having to recreate it each time.

    Another page object is also added to the Object Browser.

    Note: Make sure you have the Currently Viewing drop-down list in the Tool bar set to Entire Dashboard in order to see the effect of adding a page on your entire project.

Copy an Existing Dashboard Page

This creates a new page file using an existing file as a template. The resulting page is not linked to the original and can be modified and changed without affecting the original.

To copy a dashboard page

  1. In the Project Browser, select dashboard.

    Alternatively, you can select main.dashxml in the File Browser.

  2. In the Object Browser, select page-group.

  3. In the Object Palette, select page - Copy existing.

    Alternatively, you can right-click page-group and select Add child tag > page - Copy existing.

  4. In the Select a Page Definition dialog, browse to and select an existing page file (.pagexml), then click Open.

  5. In the Save File As dialog, specify a name for the page file and click Save.

  6. In the Select Files to be Copied dialog, specify if you want to make a copy of all the items referenced by the page being copied.

    If you want to make copies of some of the referenced files, select Yes. Click Cancel in the Save File As dialog for those files you do not want copied.

    Note: The Object Browser identifies a dashboard's multi-linked objects in magenta font to help you avoid making unanticipated changes to your dashboard when modifying a multi-linked object.

    The Preview pane displays a New Page tab, which you can select to see the new page. Another page object is also added to the Object Browser.

    Note: Make sure you have the Currently Viewing drop-down list in the Tool bar set to Entire Dashboard in order to see the effect of adding a page on your entire project.

Configure Dashboard Navigation

CenterView™ Builder creates dashboard navigation automatically when pages are added to the dashboard. However, the default format is a single level of navigation along the top of the dashboard. Although functional for simple dashboards, this navigation layout may not be appropriate in all situations. This section discusses the navigation options available in Corda® CenterView.

Nested Page Groups

Corda CenterView supports multiple levels of navigation through the nesting of page-group objects.

To add a nested page group

  1. In the Project Browser, select dashboard.

    Alternatively, you can select main.dashxml in the File Browser.

  2. In the Object Browser, select page-group.

  3. In the Object Palette, select page-group.

    Alternatively, you can right-click page-group and select Add child tag > page-group.

    The Preview pane displays a Page Group tab, which you can select to see the new page group. A page-group object is also added to the Object Browser.

    Note: Make sure you have the Currently Viewing drop-down list in the Tool bar set to Entire Dashboard in order to see the effect of adding a page on your entire project.

Creating a nested page group creates XML similar to the following:

<ct:page-group start-page-index="2001" page-index="2000" label="Revenue">
<ct:page-group start-page-index="0" label="Widget Revenue"/>

After the nested page group is created, you can add pages to it just as you would any other page group. Further nesting of page groups and associating of pages can be done to achieve additional levels of navigation.

Navigation Layout

After you have created nested page-groups and pages, you need to specify how to access those pages via dashboard navigation. Corda CenterView supports navigation along the top and left side of a dashboard.

Although there is no limit to the number of navigation levels you can create in a dashboard, top navigation supports a maximum of two levels. Left navigation, on the other hand, supports up to ten levels of navigation, although the limits of readability and usability are typically reached long before this.

To change the navigation layout

  1. In the Project Browser, select dashboard.

    Alternatively, you can select main.dashxml in the File Browser.

  2. In the Object Browser, select page-group.

  3. In Object Properties, select the nav-layout attribute, then select the desired navigation layout from the drop-down list.

    The  Preview pane displays the new navigation format as soon as it is selected.

The nav-layout attribute is modified in <ct:dashboard-settings>, as shown below:

<ct:dashboard-settings title="Sales Dashboard" controls-height="20" theme="Business" nav-layout="2-tab-rows" width="850" align="center"/>

Labels

As you create new page groups and pages, the default object labels might not be descriptive enough. The label is used to identify the page or page group in navigation and the Object Browser. You can modify page group and page labels at any time after they are created.

To change a label

  1. In the Project Browser, select dashboard.

    Alternatively, you can select main.dashxml in the File Browser.

  2. In the Object Browser, expand the page-group.

  3. Select the page or page-group you want to rename.

  4. In Object Properties, select the label attribute, and specify the desired label value.

    Labels support a maximum of about 40 characters.

This modifies the label attribute in the selected <ct:page-group> or <ct:page-ref> property as shown below:

<ct:page-group start-page-index="2001" page-index="2000" label="Revenue">
<ct:page-ref page-index="2001" label="Geography" src="pages/revenue_geo.pagexml" request-vars="drillto:2002"/>

Object and attribute changes are written out as soon as focus is taken off the changed object, either by pressing the <Tab> or <Enter> keys or by clicking another object with the mouse. The Preview pane, Object Browser, and any other relevant dashboard views update immediately.

Page Organization

Pages are the shells into which you put dashboard information. As such, a page can potentially have many sub-elements, and these elements need to be organized into a coherent presentation. Corda CenterView provides layout and cell objects to accomplish this. Layout objects are similar to an HTML <table> object and are added to a page to define the overall page organization. Cell objects contain specific page elements, such as KPIs, and are used within the layout object to place specific elements in specific locations.

Layout objects can be nested to provide further flexibility in organizing dashboard page elements.

For example, the default dashboard includes a single page with a single KPI, a drop-down list, and a label. To organize these elements to appear as they do, a vertical layout is used to position the KPI cell below the label and drop-down cell. Then a second layout object is used within the label and drop-down cell to position the label and drop-down next to each other horizontally.

The example below shows sample XML for layout and cell objects.

Sample XML for layout and cell objects

<ct:layout arrange="grid:2,2">

<ct:cell location="1,1" ><ct:kpi-ref src="kpis/rev_mkt_5day.kpixml" title="Five Day report" request-vars="select:Units"/></ct:cell>

<ct:cell location="1,2"><ct:kpi-ref src="kpis/rev_mkt_qtd.kpixml" title="QTD Revenue" request-vars="select:Units"/></ct:cell>

<ct:cell location="2,1"><ct:kpi-ref src="kpis/rev_mkt_pof.kpixml" title="Percentage of Forecast" request-vars="select:Units"/></ct:cell>

<ct:cell location="2,2"><ct:kpi-ref src="kpis/rev_mkt_growth.kpixml" title="QTD Growth" request-vars="select:Units"/></ct:cell>

</ct:layout>

Comprehensive information on the layout and cell objects, including the specific attributes each supports, is available in the Corda CenterView Object Reference.