HTML Dashboard Item

The HTML Dashboard Item template is used in the HTML Dashboard template to configure the dashboards introduced in QualiWare 10.8 and the Desktops introduced in QualiWare 10.10

The DashboardItems can show many types of data in different ways which makes them a flexible tool.

Title: The title shown on the dashboard tile. If no title in inserted the name of the HTMLDashboardItem will be shown on the web. As seen in the example above, it is possible to insert a property name in {} . In the example above the name of the Template is shown.

Placement:

  • Position X and Position Y: the position of the item on the dashboard (0,0) is in the top left corner of the dashboard.
    As default the dashboard contains 12 coloumns (this can be modified on the Settings tab on the HTMLDashboard)

Size:

  • Width and Height: the size of the dashboard item.

Icon source:

  • Select the icon to be shown on the dashborditem (see more)

Method:

  • The is a comprehensive list of Methods available (see more)

Reference Link(s)

  • Links associated to the DashboardItem, this is depending on the selected Method

Icon Source

The icon source attribute allows you to select from a predefined list of symbols that are available for use.

A screenshot of a computer Description automatically generated with low confidence

Please refer to the DashboardItem Icon Source Cheat Sheet in the Appendix (below) for the keyword mapping list. The Method attribute (combined with the Parameters and Reference Link(s) attributes) determine the behaviour of the DashboardItem.

Example: Custom Image on a DashboardItem

It is possible to use a custom icon on a DashboardItem. The URL can be any image file supported by browsers and it must be fetched through HTTP/s protocol.

Put the image file in the GeneratedHTML folder in your IIS-application. In this example I have put the image into the Images-folder.

Graphical user interface, text, application, email Description automatically generated

Graphical user interface, text, application Description automatically generated

DashboardItem – ContextInfo

Using the ContexInfo-method will make the item responsive and display information about the selected object.

Graphical user interface Description automatically generated with medium confidence

It is set up in the following way:

Graphical user interface, application Description automatically generated

Alternatively, it is possible to display the content of an already existing HTMLContentTable:

Graphical user interface, application Description automatically generated

In QualiWare 10.9 context dependency was introduced, making the tile content dependent, e.g. showing relevant properties of the object type selected in the diagram view, using the “CurrSel” filter.

DashboardItem – ContextView

Shows the context view in a tile.

It is a standard method where no other configuration is needed.

DashboardItem – ObjectAttribute

Shows a set of attribute to the “main”object in the dashboard, e.g. the diagram in a diagram dashboard.

Thus, compared to the ContextInfo method this item is not responsive/dependent upon what is selected in the diagram.

DashboardItem – BusinessChartView

This method is used to insert a dashboard item to link to e.g. a BusinessChart

You insert the BusinessChart under Reference links.

DashboardItem – BusinessChartDataView (10.10)

This method is new in QualiWare 10.10 and shows a businesschart side-by-side to a query, and when a selection is made on the businesschart, the query updates and lists the objects “behind” the selected part on the businesschart.

The dashboarditem is used in the new Document Management Desktop and Contract Management Desktop.

DashboardItem – BusinessChartEmbedded

This method shows a businesschart in a dashboard tile.

DashboardItem – BusinessChartEmbedded – Context (10.10)

This method shows a businesschart in a dashboard tile.

This method is context dependent, i.e. the businesschart is updated based upon what is selected (responsive).

DashboardItem – DiagramView

This method shows the diagram in the tile and is used as default on the different diagram dashboards.

In this method the different object on the diagram are selectable (to support responsiveness, and show details of the selected object on the diagram).

DashboardItem – HierarchyView

The HierarchyView-method will show the Hierarchy based on the HierarchyView-object in the Reference Link(s).

Graphical user interface Description automatically generated

Example:

Graphical user interface, application Description automatically generated

It is not possible to configure the HierarchyViews presentation on the DashboardItem.

DashboardItem – HighlightView

The HighlightView-method is used to highlight object based upon a query.

As seen above it is possible to have multiple highlight parameters in the item, it is important that the sequence of the queries listed under reference link(s) corresponds to the same sequence of the parameters. Each of the parameters are configured using HTMLParameters.

DashboardItem – NewsAll (10.10)

This method list all current newsitem in the repository, i.e. all wher the current date is between the release data and archive date specified on the NewsItem.

This method is similar to the NewsDesktop method, showing all news items and not only the subset related to a specific desktop.

DashboardItem – NewsDesktop (10.10)

This method list all current newsitem that are related to the specific desktop and where the current date is between the release data and archive date specified on the NewsItem. It is used on the desktops.

The parameters enable the user to create news related to the desktop.

DashboardItem – RASCI

This method shows a standard RASCI responsibility matrix derived from the digram and symbols on the diagram.

RASCI is a standard method where no other configuration is needed.

DashboardItem – Ratings

This method shows the ratings of the content.

Ratings is a standard method where no other configuration is needed.

DashboardItem – SpreadSheetView

This method links to a Spreadsheet and opens it in a maximum IFrame in the dashboard.

It is possible link to 1 spreadsheet with this method, if you what to have multiple Spreadsheets in a list, you should use the TableListView.

DashboardItem – QueryResultView

This method links to QueryResultView, and opens it in a maximum IFrame in the dashboard.

It is possible link to 1 HTMLQueryResultView with this method, if you what to have multiple HTMLQueryResultViews in a list, you should use the TableListView.

DashboardItem – QueryResultEmbedded (10.10)

This method shows the linked QueryResultView in the DashbordItem, so it is possible to have the QRV side by side with a diagram on a Dashboard.

DashboardItem – QueryResultEmbedded – Context (10.10)

This method shows a QueryResultEmbedded in a dashboard tile.

This method is context dependent, i.e. the QueryResultEmbedded  is updated based upon what is selected (responsive).

 

DashboardItem – QuickSearch (10.10)

This method shows a QuickSearch tile on a Dashboard.

The Search parameters are specified via the HTMLParameter.

In the example above “*” has been inserted as search criteria for the templates, it is possible to configure the template list by inserting Template names, seperated with “,” to focus the search.

DashboardItem – TableListView

This method shows the linked content in a list.

It is possible to links multiple references and to different types of content, such as HTMLQueryResultView / Spreadsheets / HTMLFeatures / HTMLContentBoxes.

It is possible to group content in on or more HTMLContentBoxes.

DashboardItem – TableOverview

The TableOverView-method is used to display a list of objects based on a GenericQuery.

Example:

The tile is expandable and can contain more coloums when shown in “full” view (this is specified as part of the underlying Query).

It is set up in the following way:

The reference Link(s)-object is a generic query showing data about a collection of objects.

The parameter is HTMLParameter containing a mapping string. The mapping will only change the label shown on the web page.

Note the method is not context dependent, i.e. responsive based upon when is selected in the diagram, to get this functionality the TableOverView – Context should be used instead.

DashboardItem – TableOverview – Context

The TableOverView – Context-method is used to display a list of objects based on a GenericQuery.

Examples:

Graphical user interface, application Description automatically generated Graphical user interface, text, application Description automatically generated

It is set up in the following way:

Graphical user interface, text, application Description automatically generated

The reference Link(s)-object is a generic query showing data about a collection of objects.

The parameter is HTMLParameter containing a mapping string. The mapping will only change the label shown on the web page.

Graphical user interface, text, application, email Description automatically generated

If the HTMLParameter is empty the count of different templates will be hidden:

Example of empty parameter:

Graphical user interface, text, application, chat or text message Description automatically generated

Graphical user interface, application Description automatically generated

DashboardItem – Visualization

The Visualization method is used to display a link to one visualization, using the ModelVisualizer.

Note if you what to list multiple ModelVisualizations (and other links) in the same DashboardItem you should use the TableListView method.

DashboardItem – ExternalSource (10.10)

The Visualization method is used to display a link to an external source.

This can be e.g. an external web-page or a Power BI report.

Under reference target you can choose between different targets:

  • NewWindow – Opens the reference url in a new window
  • IFrame – Opens the reference url in an IFrame
  • IFrameOnMaximize – Link to the reference url and opens a maximized IFrame when clicked

DashboardItem – GovernanceHistory

This method shows the governance history of the content.

Governance History is a standard method where no other configuration is needed.

DashboardItem – AcknowledgeHistory

This method shows the AcknowledgeHistory of the content, using the Acknowledge List.

Acknowledge History is a standard method where no other configuration is needed.

Appendix

DashboardItem Icon Source Cheat Sheet

(Empty) A picture containing text, screenshot Description automatically generated Ability Diagram Description automatically generated with low confidence Approve Icon Description automatically generated
Capability Chart, scatter chart Description automatically generated Change A picture containing icon Description automatically generated Chart A picture containing writing implement Description automatically generated
Collaboration Icon Description automatically generated Comment Icon Description automatically generated Context Chart Description automatically generated
Cost A picture containing toy, vector graphics Description automatically generated Cycle Icon Description automatically generated with medium confidence Dashboard A picture containing text, electronics, display, screenshot Description automatically generated
Deleted Icon Description automatically generated Edit Icon Description automatically generated Feedback Icon Description automatically generated
Heatmap A close-up of a smart phone Description automatically generated with medium confidence Highlight Box and whisker chart Description automatically generated with low confidence Image A picture containing icon Description automatically generated
Improvement Icon Description automatically generated Information A picture containing application Description automatically generated Items Icon Description automatically generated
Link Icon Description automatically generated List A picture containing tool, screenshot Description automatically generated People Chart, icon, bubble chart Description automatically generated
Plan Icon Description automatically generated Process A picture containing funnel chart Description automatically generated Query Icon Description automatically generated
Rating A picture containing text Description automatically generated Report Chart, funnel chart Description automatically generated Risk Icon Description automatically generated
Score Chart Description automatically generated Spreadsheet Shape Description automatically generated Visualization Chart, scatter chart Description automatically generated

In QualiTube, you can find videos about how to configure the Dashboards

Leave a Comment