Genpact Cora Knowledge Center

Support

Create an Advanced Tile

v8.3 and later

Overview

The advanced tile is a composite of two or more dashboard tiles that you define in JSON format.

Prerequisites

  • Create a dashboard suite.
  • Add the relevant queries to your data model.

Procedure

  1. In the Dashboard Suite canvas, click the Dashboards tab.
  2. From the dashboard suite drop-down menu, select the dashboard suite that you want to add the dashboard to.
  3. Click the New button.
  4. From the Toolbox panel, select Advanced Tile.
  5. In the dashboard advanced tile, click Edit Details.
    Wizard Section
    Notes
    Dashboard Wizard Tabs
    Properties
    • Define the dashboard Name and Title.
    Content
    • Define the advanced tile in JSON format.

Note: You can click-and-drag a dashboard beyond the tiles that appear on the canvas by default. The dashboard is responsive and automatically adjusts to the display. You cannot manually position the tiles on the board.

Advanced Tile Example

In this example, two regular tiles (Column2DChart1 and BarChart1) are combined to create the advanced tile.

IMPORTANT: Do not customize tiles in the Advanced Tile JSON (see below). To customize a source tile, access the Advanced Options for the tile and define the customizations in the JSON there.



Regular Tiles (before composite)



Composite Tile

JSON Attributes

You define the advanced tile with the following attributes.

  • width: determines the width of the specified tile within the composite tile.
  • visualName: the tile that you want to include in the composite tile.

Data Sources

When you configure the composite tile, there are two scenarios for defining the primaryDataViewName attribute.

  • Single Data Source: If all of the tiles that comprise the composite tile have the same data source, define the primaryDataViewName attribute with the name of an existing tile. Since the tiles have the same data source, it does not matter which tile you select to define the primaryDataViewName attribute.
 "primaryDataViewName": "BarChart1",
 "tiles": [
 {
 "width": "50%",
 "visualName": "FunnelChart1"
 },
 {
 "width": "50%",
 "visualName": "LineColumnChart1"
 }
 ]
}
  • Different Data Sources: If the tiles that comprise the composite tile have different data sources, do not populate the PrimaryDataViewName attribute.
{
 "primaryDataViewName": "",
 "tiles": [
 {
 "width": "50%",
 "visualName": "FunnelChart1"
 },
 {
 "width": "50%",
 "visualName": "LineColumnChart1"
 }
 ]
}