Difference between revisions of "Widgets"

From Hornbill
Jump to navigation Jump to search
 
(25 intermediate revisions by 3 users not shown)
Line 1: Line 1:
__NOTOC__[[Main Page|Home]] > [[Administration]] > [[Reporting]] > Widgets
+
This document can now be found at its new location in the [https://docs.hornbill.com/esp-config/advanced-analytics/widgets/ Hornbill Document Library].
==Introduction==
+
 
 +
[[file:hornbill-document-library.png|Widgets|link=https://docs.hornbill.com/esp-config/advanced-analytics/widgets/]]
 +
 
 +
<!--
 +
 
 +
<div style="border:1px solid #90C0FF; background:#D0E0FF; width:99%; padding:4px; margin-bottom:10px;">
 +
__NOTOC__
 +
{| style="width:100%"
 +
|[[Main Page|Home]] > [[Administration]] > [[Advanced Analytics]] > Widgets
 +
|style="text-align:right;"|[[:Category:Service Manager Administration|Index]]
 +
|}
 +
</div>
 +
{|style="width: 100%"
 +
|- valign="top"
 +
|style="width:73%"|
 +
== Introduction ==
 
Widgets are provided to create plug in data that can be used to build Dashboards. Some widget types make use of existing measures and provide the ability to display them in a more appealing format. Certain widget types allow you to return and display data based on configuration carried out within the widget.
 
Widgets are provided to create plug in data that can be used to build Dashboards. Some widget types make use of existing measures and provide the ability to display them in a more appealing format. Certain widget types allow you to return and display data based on configuration carried out within the widget.
 +
 +
|style="width:5%"|
 +
|
 +
|style="width:22%; border-style: solid; border-width: 1px; border-color:#e6e6e6; background-color:#f2f2f2;"|
 +
 +
== Related Articles ==
 +
:* [[Application_Entity_Viewer|Application Entity Viewer]]
 +
:* [[Reports]]
 +
 +
|}
  
 
====Creating a new Widget====
 
====Creating a new Widget====
  
Select the '''+ Create New Widget''' button, give the new Widget a name, and choose which type of Widget you wish to create.  Configuration options and an example video for each of the Widget types is given below.
+
Select the '''+ Create New Widget''' button, give the new Widget a name, and choose which type of Widget you wish to create.  Configuration options and an '''example video''' for each of the Widget types is given below.
  
 
==Widget Types==
 
==Widget Types==
Line 22: Line 47:
  
 
====Measured Sample====
 
====Measured Sample====
<div class="mw-collapsible-content">{{#ev:youtube|TyH55xdnvuU|400|right}}
+
<div class="mw-collapsible-content">{{#ev:youtube|dDcG4r-XRZw|400|right}}
 
'''Data Source Details'''
 
'''Data Source Details'''
 
:* '''Data Type''' - Choose '''Measured Sample'''
 
:* '''Data Type''' - Choose '''Measured Sample'''
Line 31: Line 56:
 
::* Change the Series Display name, Colour and Measure to use from the available fields if required.
 
::* Change the Series Display name, Colour and Measure to use from the available fields if required.
 
:* '''Add new series''' - Add additional Series to the chart by selecting this optionand again choosing a Display name for the series and a Measure to use.
 
:* '''Add new series''' - Add additional Series to the chart by selecting this optionand again choosing a Display name for the series and a Measure to use.
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Chart Settings'''
 
'''Chart Settings'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 40: Line 65:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Axis Options'''
 
'''Axis Options'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 46: Line 71:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Grid Options'''
 
'''Grid Options'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 52: Line 77:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Legend Options'''
 
'''Legend Options'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 58: Line 83:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Target Lines'''
 
'''Target Lines'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 69: Line 94:
 
</div>
 
</div>
 
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
 
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
 +
 
====Measured Group By====
 
====Measured Group By====
<div class="mw-collapsible-content">{{#ev:youtube|LVvlfzte2AA|400|right}}
+
<div class="mw-collapsible-content">{{#ev:youtube|Oz9Zb50Gcoc|400|right}}
 
'''Data Source Details'''
 
'''Data Source Details'''
 
:* '''Date Type''': Choose '''Measure Group By'''
 
:* '''Date Type''': Choose '''Measure Group By'''
Line 82: Line 108:
 
<br>
 
<br>
 
<br>
 
<br>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Chart Settings'''
 
'''Chart Settings'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 93: Line 119:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Axis Options - Bar Chart Only'''
 
'''Axis Options - Bar Chart Only'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 99: Line 125:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Grid Options - Bar Chart Only'''
 
'''Grid Options - Bar Chart Only'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 105: Line 131:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Target Lines - Bar Chart Only'''
 
'''Target Lines - Bar Chart Only'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 116: Line 142:
 
</div>
 
</div>
 
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
 
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
 +
 
====Measure Sample Group By====
 
====Measure Sample Group By====
<div class="mw-collapsible-content">{{#ev:youtube|TVF1w-zY-Sg|400|right}}
+
<div class="mw-collapsible-content">{{#ev:youtube|-eGM_d77Z7A|400|right}}
 
'''Data Source Details'''
 
'''Data Source Details'''
 
:* '''Data Type''' - Choose '''Measure Sample Group By'''
 
:* '''Data Type''' - Choose '''Measure Sample Group By'''
Line 128: Line 155:
 
<br>
 
<br>
 
<br>
 
<br>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Chart Settings'''
 
'''Chart Settings'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 137: Line 164:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Axis Options'''
 
'''Axis Options'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 143: Line 170:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Grid Options'''
 
'''Grid Options'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 149: Line 176:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Legend Options'''
 
'''Legend Options'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 155: Line 182:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Target Lines'''
 
'''Target Lines'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 168: Line 195:
  
 
====Sql Group By====
 
====Sql Group By====
<div class="mw-collapsible-content">{{#ev:youtube|TVF1w-zY-Sg|400|right}}
+
<div class="mw-collapsible-content">{{#ev:youtube|iV5NLChvnnc|400|right}}
 
'''Data Source Details'''
 
'''Data Source Details'''
 
:* '''Data Type''' - Choose '''Sql Group By'''
 
:* '''Data Type''' - Choose '''Sql Group By'''
Line 192: Line 219:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Axis Options - Bar Chart Only'''
 
'''Axis Options - Bar Chart Only'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 198: Line 225:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Grid Options - Bar Chart Only'''
 
'''Grid Options - Bar Chart Only'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 204: Line 231:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1000px">
+
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:800px">
 
'''Target Lines - Bar Chart Only'''
 
'''Target Lines - Bar Chart Only'''
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
Line 220: Line 247:
 
====Scorecard====
 
====Scorecard====
 
A Scorecard widget can be used to display one or more Measures which have previously been defined.  
 
A Scorecard widget can be used to display one or more Measures which have previously been defined.  
<div class="mw-collapsible-content"> {{#ev:youtube|gYn8VgYbgGM|400|right}}
+
<div class="mw-collapsible-content"> {{#ev:youtube|hOo25gzp-vY|400|right}}
  
 
'''Data Measure / Data Formatter'''
 
'''Data Measure / Data Formatter'''
Line 241: Line 268:
 
</div>
 
</div>
 
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1100px">
 
<div class="mw-collapsible mw-collapsed" data-collapsetext="Show Less" data-expandtext="Read More" style="width:1100px">
 +
 
====Target Counter====
 
====Target Counter====
 
This type of widget is used to display how a single measure is performing against it's target.
 
This type of widget is used to display how a single measure is performing against it's target.
<div class="mw-collapsible-content">{{#ev:youtube|B_qsurEg5VE|400|right}}
+
<div class="mw-collapsible-content">{{#ev:youtube|jRINnOpKgMA|400|right}}
  
 
'''Counter Data Measure'''
 
'''Counter Data Measure'''
Line 269: Line 297:
 
====List of Data====
 
====List of Data====
 
Allows you to populate a widget with a list of data based on a user defined table query.
 
Allows you to populate a widget with a list of data based on a user defined table query.
<div class="mw-collapsible-content">{{#ev:youtube|X1Ra3h37mFs|400|right}}
+
<div class="mw-collapsible-content">{{#ev:youtube|IcYA8udihs4|400|right}}
  
 
There are two options for defining the content which will appear on your datalist and these can be chosen from the '''Widget settings'''.
 
There are two options for defining the content which will appear on your datalist and these can be chosen from the '''Widget settings'''.
Line 299: Line 327:
 
====List of Counters====
 
====List of Counters====
 
This widget allows you to display one or a list of metrics that are based on an aggregate value such as count, average, max, and min.
 
This widget allows you to display one or a list of metrics that are based on an aggregate value such as count, average, max, and min.
<div class="mw-collapsible-content">{{#ev:youtube|3z-k_EO-I9U|400|right}}
+
<div class="mw-collapsible-content">{{#ev:youtube|rfwOpQ9YNXk|400|right}}
  
 
'''Widget settings'''
 
'''Widget settings'''
Line 332: Line 360:
 
====Custom====
 
====Custom====
 
The custom widget type allows you to specify a URL and display the content as an image, in an iframe or div.
 
The custom widget type allows you to specify a URL and display the content as an image, in an iframe or div.
<div class="mw-collapsible-content">{{#ev:youtube|kxQNupQmpNw|400|right}}
+
<div class="mw-collapsible-content">{{#ev:youtube|PfOMn199s9s|400|right}}
  
 
You may wish to compliment the Hornbill data which can displayed in Widgets, with that of content from external sources. The Custom widget option allows you to either add an image via a specific URL, or display the content from an external source via a URL.  
 
You may wish to compliment the Hornbill data which can displayed in Widgets, with that of content from external sources. The Custom widget option allows you to either add an image via a specific URL, or display the content from an external source via a URL.  
Line 357: Line 385:
 
</div>
 
</div>
 
</div>
 
</div>
 +
 +
==Pre-Defined Date Settings==
 +
 +
When creating widgets within Hornbil Advanced Analytics, some widget types provide the ability to set the sampling type and the sampling period. The sample period when using predefined date settings consist of multiple options to provide you the flexibility to set the widget to report on a specific period in time. Some of these options relate to the beginning of a week (this week or last week), and because the week start day can be different for organisations based in different countries Hornbill have also provided a setting to enable this to be set per Hornbill instance within the System -> Settings -> Advanced section from your Hornbill admin portal. Search for '''system.regionalSettings.weekStartDay''' to set it for your instance. By default this setting is set to Sunday as the start of the week. There are also settings for the beginning of the calendar year - '''reporting.calendarYearStart''' which by default is set to 01/01, and a setting for the beginning of the financial year - '''reporting.financialYearStart''' which by default is set to 01/04.
 +
 +
The pre-defined date settings are explained here:
 +
 +
*'''Start Of This Week''' - 00:00:00 hours on the last Sunday before today
 +
*'''Start Of This Month''' - 00:00:00 hours on the first day of the current month
 +
*'''Start Of Financial Year''' - 00:00:00 hours on the first day of the current financial year
 +
*'''Start Of This Year''' - 00:00:00 hours on the first day of the current year
 +
*'''Start Of Calendar Quarter''' - 00:00:00 hours on the first day of the current quarter. A quarter can start in January, April, July or October
 +
*'''Start Of Financial Quarter''' - 00:00:00 hours on the first day of the current financial quarter. A quarter can start in January, April, July or October
 +
*'''Start Of Last Week''' - 00:00:00 hours on last week's Sunday
 +
*'''Start Of Last Month''' - 00:00:00 hours on the first day of the last month
 +
*'''Start Of Last Financial Year''' - 00:00:00 hours on the first day of the last financial year
 +
*'''Start Of Last Year''' - 00:00:00 hours on the first day of the last year
 +
*'''Start Of Last Calendar Quarter''' - 00:00:00 hours on the first day of the last quarter
 +
*'''Start Of Financial Quarter''' - 00:00:00 hours on the first day of the last financial quarter
 +
*'''Last Calendar Years Samples''' - 00:00:00 hours on the first day of the last year to 23:59:59 hours on the last day of last year
 +
*'''Last Financial Years Samples''' - 00:00:00 hours on the first day of the last financial year to 23:59:59 hours on the last day of last financial year
 +
*'''Last Calendar Quarter Samples''' - 00:00:00 hours on the first day of the last quarter to 23:59:59 hours on the last day of the last quarter. A quarter can end in March, June, September or December
 +
*'''Last Financial Quarter Samples''' - 00:00:00 hours on the first day of the last financial quarter to 23:59:59 hours on the last day of the last financial quarter. A quarter can end in March, June, September or December
 +
*'''Last Months Samples''' - 00:00:00 hours on the first day of last month to 23:59:59 hours on the last day of last month
 +
*'''Last Weeks Samples''' - 00:00:00 hours on last week's Sunday to 23:59:59 hours on last week's Saturday
 +
 +
[[Category:Administration]][[Category:Videos]][[Category:HDOC]]
 +
<!-- /esp-config/advanced-analytics/widgets -->
 +
[[Category:HDOC]]

Latest revision as of 18:12, 10 April 2024

This document can now be found at its new location in the Hornbill Document Library.

Widgets