Skip to content
Deem Docs

Graphs, Tables and KPIs

Overview

Section titled “Overview”

Adding KPI, table and graph widgets are part of the report scripting functionality. These widgets enhance reports by providing visual representations of data, key performance indicators, and structured data tables.

This section provides an overview of the three main widget types:

  • Graphs - Visual charts and graphs for data visualization
  • Tables - Structured data tables with columns and rows
  • KPIs - Key Performance Indicators with targets and trends

All widgets can be customized using various methods and can be positioned on dashboards using Bootstrap grid classes.

Bootstrap Grid System

Section titled “Bootstrap Grid System”

Many of the scripts in these chapters use Bootstrap code to set width of the elements used. Page width is divided in 12 parts, so 4 equal parts are 3-3-3-3 etc. The different screen sizes can be used to create a new row in the layout. Using LG3 (4 parts) on a large screen might look better in two rows on an iPad MD6 (2 parts).

Screen Size Classes:

  • XS_: Size on extra small (phone screen) XS1 to XS12 (XS12 recommended) < 768 pixels
  • SM_: Size on devices with screen width > XS, < 992 px
  • MD_: Size on devices with screen width > SM, < 1200 px
  • LG_: Size on devices with screen width > MD

For more information, see Bootstrap CSS Grid.

Important Preliminary Notes for Methods

Section titled “Important Preliminary Notes for Methods”

Execution Context

Section titled “Execution Context”
  • All methods are executed on the $olap object

Data Source

Section titled “Data Source”
  • The data for any method is retrieved from an external source, typically a table or view in a specific database, that is used for the associated report
  • Columns from this source are referenced using square brackets (e.g., [accounted_amount_dcur])
  • If a different data source is required, it can be specified with methods like setGraphSource, setTableSource, or setKpiSource

Functions and Expressions

Section titled “Functions and Expressions”
  • Several predefined functions (e.g., SUM()), methods (e.g., ?period.getYear()), and SQL expressions (e.g., CASE WHEN [...] THEN [...]) can be used within arguments to process and transform data dynamically

Comments

Section titled “Comments”

Aggregation Order

Section titled “Aggregation Order”

Aggregation Order

When working with expressions that involve multiple aggregation functions, it is important to remember that aggregations are always performed before the expression itself is evaluated. This means that conditions or counts based on aggregated results (e.g., “number of projects with a negative total”) require pre-aggregated data or an additional query step in order to produce correct results.

Quickstart

Section titled “Quickstart”

Adding a Graph

Section titled “Adding a Graph”
$olap.addGraph("1", "Sales Chart", "[time_month]", "", "0");
$olap.addGraphAxis('1', '1', 'Sales','false');
$olap.addGraphData("1", "1", "-", "[product]", "SUM([sales_amount])", "column", "stacked", "", "");

Adding a Table

Section titled “Adding a Table”
$olap.addTable("1", "Top Products", "chart-bar", "", "10");
$olap.addTableColumn("1", "1", "Product", "[product_name]", "string");
$olap.addTableColumn("1", "2", "Sales", "SUM([sales_amount])", "###,###");

Adding a KPI

Section titled “Adding a KPI”
$olap.addKpi("1", "Total Sales", "[time_period]", "YTD",
  "SUM([budget_amount])",
  "SUM([actual_amount])",
  "0.8", "1.0", "1", "");
Section titled “Related Documentation”