UOC Content Library Widgets-WebClient

From the Navigation menu, select UOCContentWidgets to display the desired widget information in the Main View.

For all widgets, through the following properties, respective changes can be made. The table below contains descriptions of properties in widgets:

UOC Content Library Widgets consists of the following widgets:

Collection 1

This dashboard consists of:

Gantt Chart-GanttChart Widget

The project Gantt Chart is the schedule view of the portfolio, program, and project. The Gantt chart displays project plans and actuals based on the dynamic hierarchy selected.

For Gantt Chart, you can configure the following namespace variables for the Data, Options, Style Sheet, and Theme fields:

• UOCCore_Widgetdata>>Data

• UOCCore_Widgetdata>>Options

• UOCCore_Widgetdata>>StyleSheet

• brand-light

To update style, configure the StyleSheet namespace:

• UOCCore_Widgetdata>>GanttStyleSheet

Windrose-Windrose Widget

The windrose chart is often used to visualize wind patterns. In this example, the chart shows the wind speed distribution. A polar stacked column chart is used to accomplish this.

For Windrose, you have to configure the longitude and latitude fields that are exposed in the widget properties.

• UOCCore_Widgetdata>>Latitude

• UOCCore_Widgetdata>>Longitude

To update style, configure the StyleSheet namespace:

• UOCCore_Widgetdata>>WindroseStyleSheet

Collection 2

This dashboard consists of:

Pie 3D-FlexChart Widget

For the Pie 3D, you can configure namespace variables with their respective strings for Click, Data, Default Options, Imports, Options, Stylesheet, X Range, and Y Range.

• UOCCore_Widgetdata>>PI3DClick

• UOCCore_Widgetdata>>PI3DData

• UOCCore_Widgetdata>>PI3DDefaultOptions

• UOCCore_Widgetdata>>PI3DImports

• UOCCore_Widgetdata>>PI3DOptions

• UOCCore_Widgetdata>>PI3DStyle

• UOCCore_Widgetdata>>PI3DXrange

• UOCCore_Widgetdata>>PI3DYrange

Donut Charts-FlexChart Widget

A Pie chart showing a hollow semi-circle. This is a compact visualization, often used in dashboards.

For the Donut chart, you can configure namespace variables with their respective strings for Click, Data, Default Options, Imports, Options, Stylesheet, X Range, and Y Range.

• UOCCore_Widgetdata>>DonutClick

• UOCCore_Widgetdata>>DonutData

• UOCCore_Widgetdata>>DonutDefaultOptions

• UOCCore_Widgetdata>>DonutImports

• UOCCore_Widgetdata>>DonutOptions

• UOCCore_Widgetdata>>DonutStyleSheet

• UOCCore_Widgetdata>>DonutXRange

• UOCCore_Widgetdata>>DonutYRange

Pie Widget-FlexChart Widget

Pie charts are very popular for showing a compact overview of a composition or comparison. While they can be harder to read than column charts, they remain a popular choice for small datasets.

For the Pie widget, you can configure namespace variables with their respective strings for Click, Data, Default Options, Imports, Options, Stylesheet, X Range, and Y Range.

• UOCCore_Widgetdata>>PieWidgetclick

• UOCCore_Widgetdata>>PieWidgetData

• UOCCore_Widgetdata>>PieWidgetdefaultoptions

• UOCCore_Widgetdata>>Imports

• UOCCore_Widgetdata>>PieWidgetOptions

• UOCCore_Widgetdata>>PieWidgetStyleSheet

• UOCCore_Widgetdata>>PieWidgetXrange

• UOCCore_Widgetdata>>PieWidgetYrange

3D Pie-FlexChart Widget

For the 3D Pie, you can configure namespace variables with their respective strings for Click, Data, Default Options, Imports, Options, Stylesheet, X Range, and Y Range.

• UOCCore_Widgetdata>>3DPieClick

• UOCCore_Widgetdata>>3DPieData

• UOCCore_Widgetdata>>3DPieDefaultOptions

• UOCCore_Widgetdata>>Imports

• UOCCore_Widgetdata>>3DPieOptions

• UOCCore_Widgetdata>>3DPieStyle

• UOCCore_Widgetdata>>3DPieXRange

• UOCCore_Widgetdata>>3DPieYRange

Collection 4

Flextree Widget

The Flextree presents hierarchical data in a dynamic, interactive, collapsible tree structure with checkbox and radio button support.

This dashboard consists of Flex tree widget.

Collection 5

Master Details Chart-MasterDetail Widget

Chart showing how a second chart can be added to approach Highcharts Stock Navigator functionality in Highcharts. Select and drag the lower chart to zoom in on the upper chart.

For the Master Details Chart, you can configure the following field in the widget properties that are exposed as per the application requirements:

• UOCCore_Widgetdata>>MasterDetailsData

To update style, configure the StyleSheet namespace:

• UOCCore_Widgetdata>>StyleSheet

Tree Map Widget-FlexChart Widget

This chart shows a tree map with a hierarchy, where the groups are labelled with a different text style from the child nodes and the nodes are grouped together by color. Select any area to display detailed information based on the data configured.

For a Tree Map widget, you can configure namespace variables with their respective strings for Click, Data, Default Options, Imports, Options, Stylesheet, X Range, and Y Range.

• UOCCore_Widgetdata>>TreemapClick

• UOCCore_Widgetdata>>TreeData

• UOCCore_Widgetdata>>TreemapDefaultOptions

• UOCCore_Widgetdata>>Treemapimports

• UOCCore_Widgetdata>>TreeOptions

• UOCCore_Widgetdata>>TreeStylesheet

• UOCCore_Widgetdata>>TreemapXRange

• UOCCore_Widgetdata>>TreemapYRange

Collection 6

This dashboard consists of a grid showing CONNECT data service views.

The DataGrid Widget lets you view the data in tabular form and allows you to sort and filter the data. To access the full features of the application, you need to log into the OMI application with administrator credentials.

The visual appearance of the DataGrid can be customized. The data formats that are supported are CSV and JSON strings.

Provide the Start Index and End Index from the calendar, and then select Get DataViews.

That data is displayed on the grid with Timestamp and Value.

For CONNECT data service Views, you have to pass their stream data to the following namespace variable:

• UOCCore_Stream>>StreamData