Skip to main content

Dashboard widgets

Port supports various visualizations in the form of widgets, allowing you to display data from your software catalog using graphic elements, making it easier to make sense of large datasets.

Dashboards are available in the following locations:

  1. The Home page of your Port app - the home page itself is a dashboard, allowing you to add and customize any of the widgets described on this page.
  2. Every entity page can have a dashboard tab with its own widgets.
  3. The software catalog allows you to create customizable dashboard pages.

Widget types​

Pie chart​

You can create a pie chart illustrating data from entities in your software catalog divided by categories and entity properties inside a specific entity page specific entity page.

Pie Chart

Visualization properties​

FieldTypeDescriptionDefaultRequired
TitleStringPie chart titlenulltrue
IconStringPie chart Iconnullfalse
DescriptionStringPie chart descriptionnullfalse
BlueprintStringThe chosen blueprint from which related entities data is visualizednulltrue
Breakdown by propertyStringGroup your chart by a specific propertynulltrue
FiltersArrayFilters to include or exclude specific data based on Port's Search Rules[]false

Number chart​

You can create a number chart visualization from related entities in the specific entity page. You can either count the entities or perform an aggregation function on a number property. You can also filter entities so the aggregation number chart will only apply to a limited set of entities with Port's Search Rules

Number Chart

Number chart properties​

FieldTypeDescriptionDefaultRequired
TitleStringNumber Chart titlenulltrue
IconStringNumber Chart Iconnullfalse
DescriptionStringNumber Chart descriptionnullfalse
BlueprintStringThe chosen blueprint from which related entities data is visualized fromnulltrue
Calculate ByStringAggregate by either counting the entities or perform a function on a property. Possible values: entities, propertyentitiestrue
PropertyStringThe number chart value will be the selected property's aggregated value (according to the chosen function). The property key is only available when Calculate By is equal to propertynulltrue
FunctionStringIn case Calculate By is equal to property the options are: sum, min, max, average and median.
In case Calculate By is equal to entities the options are: count and average.
nulltrue
Average ofStringIn case Calculate By is equal to entities the options are: hour, day ,week and month.
In case Calculate By is equal to property the options are: hour, day, week, month and total (divide the sum by the number of entities).
nulltrue
Measure time byStringUsed to specify an alternative property to use as the time property for the average calculation instead of the default field which is createdAt.nullfalse
FiltersArrayFilters to include or exclude specific data based on Port's search rules[]false
unitStringThe unit of the number chart. Possible Values: %, $, £, €, none, customnulltrue
unitCustomStringText to display below the number value. The unitCustom key is only available when unit equals to customnulltrue
unitAlignmentStringleft, right, bottom.nulltrue
note

When performing calculations of average time intervals, such as by hour, day, week, or month, it is important to note that any partial interval is considered as a full interval. This approach ensures consistency across different time units.

For example, if the dataset includes information spanning across 2 hours and 20 minutes, but the selected average timeframe is hour, then the summed value will be divided by 3 hours.

Markdown​

This widget allows you to display any markdown content you wish in formatted form:

Markdown widget properties​

FieldTypeDescriptionDefaultRequired
TitleStringMarkdown widget titlenulltrue
IconStringMarkdown widget Iconnullfalse
markdownStringMarkdown contentnullfalse

Iframe visualization​

You can create an iframe widget to display an embedded url in the dashboard. The iframe widget is useful to display external dashboards or other external content. It also appends to the iframe URL query params the entity identifier and the blueprint identifier so the embedded page can use it for various purposes.

The entity identifier will be concatenated under the entity query param and the blueprint identifier will be concatenated under the blueprint query param. For example: https://some-iframe-url.com?entity=entity_identifier&blueprint=blueprint_identifier.

iFrame

Widget properties​

FieldTypeDescriptionDefaultRequired
TitleStringIframe widget titlenulltrue
IconStringIframe widget Iconnullfalse
DescriptionStringIframe widget descriptionnullfalse
URLStringIframe widget urlnullfalse
URL typeStringpublic or protectnullfalse
Authorization UrlURL StringIf the URL type is protected this will be required. Read more about it herenullfalse
clientIdStringIf the URL type is protected this will be required. Read more about it herenullfalse
ScopesString ArrayIf the URL type is protected this will be required. Read more about it herenullfalse
Token URLURL StringIf the URL type is protected this will be required. Read more about it herenullfalse

Table​

This widget allows you to create tables displaying all entities based on a selected blueprint.
Tables can be searched, filtered and customized as you wish, using the corresponding buttons in the widget.

Customization​

Just like catalog pages, tables support the following customization options:

Action card​

This widget allows you to execute self-service actions directly from any dashboard (including your homepage).

A single action card can contain one or multiple actions:

Single action
To execute the action, click on the button in the bottom left corner of the widget:



Multiple actions
When choosing multiple actions, you can choose your own title for the widget.
To execute an action, click on the âš¡ button next to it:

Action runs​

This widget allows you to create a table displaying all past runs of a self-service action in your portal.
The table will automatically display data about each run, including status, input parameters, the executing user, and more.

Chart filters​

Pie charts, number charts and tables support filters, which allow you to include or exclude specific data from them. The filters are based on Port's Search Rules, and are set when creating the widget:

Filter example: only deployment entities from the last week​

Let's assume we have a blueprint that is called Service which is related to another blueprint called Deployment, and we want to create visualizations on top of the last week's deployments of this service.

To achieve this desired state, we can go into one of the Service's profile pages and create a new visualization. After selecting the Deployment blueprint in the dropdown, we can add the following filter to the Filters array:

[
{
"property": "$createdAt",
"operator": "between",
"value": {
"preset": "lastWeek"
}
}
]

Dynamic filters​

You can use dynamic properties of the logged-in user when filtering a widget.