...
However, in order to create reports with this reporting framework, it is important that you're familiar with the concept of Command and Data Pipeline. If not, please follow the link to read more about it and then come back to this guide.
...
In case this pipeline will be run within the next 30 minutes, the data is returned from the cache.
Report Config Attributes
The Report Config is the main configuration file for a report. Here you can define the title, description, charts of the report and from where the report data should be loaded from.
In order to create a new report and show it as a new entry in your apps tiles listing, you have to add the report config as a new property to this path in the property store:
Code Block |
---|
global/app/tld.domain.myapp/report/<reportname> |
Whereas <reportname>
is a lower-case and unique name for the report in a format supported by the property path.
The content type of the report config property must be application/json; type=report
.
You can also create it in the web ui in section LOW CODE -> Properties
using the Report wizard.
The most basic structure of this JSON document must be like this:
Code Block |
---|
{
"title": "The title of your report",
"description": "Description of your report",
"type": "CHART_TYPE",
"data" : {...},
"options": {...}
} |
title
The title
defines the title of the report to be displayed in the web ui and in other locations.
This can be a static text or an i18n uri like $uri:i18n:myTitle
for example. See: Internationalization (i18n)
description
The description
is optional and describes the intention of the report.
This can be a static text or an i18n uri like $uri:i18n:myDescription
for example. See: Internationalization (i18n)
icon
Each report can have an individual icon. This value must be a code name from the Google Material Icons as listed here: https://fonts.google.com/icons
This value is optional. If not given, the default icon is shown.
color
The color of the report icon. If not specified, the secondary color is used, which depends on the style settings. By default this is a blue color like this:
...
The color value can be a hexadecimal value, like this:"color": "#FFA500"
Or it can be a constant selected from the Colors palette.
For example you could use the color palette constant “green” like this:"color": "green"
...
Another example:
"color": "red-8"
...
hidden
This optional attribute defines whether the report should be shown as tile inside the app ("hidden": false
) or not ("hidden": true
).
The list can be still loaded by its URL if required.
If this attribute is missing, "hidden": false
is used as a default.
type
The type of the chart to be displayed. Please refer to the Chart.js sample documentation and select the key of the chart you would like to display. Example keys are: line
, bar
, radar
, doughnut
, bubble
and many more.
data
Defines the data to be consumed by this chart. How this data structure looks like depends on the selected chart. Refer to the Chart.js documentation for the selected chart about it.
This data can be a static JSON embedded here, or a PIPEFORCE URI pointing to a pipeline or property as the data source.
options
This section defines configuration options for the selected chart as documented in Chart.js.