Working with Widgets

What are Widgets?

A widget is a container of the graphs. Web Dashboard is widget based UI. Each widget keeps graph(s) inside it to show in different way depends upon widget type and chart type. There are many operations to do on each widget, such as adding/removing a widget, show/hide graph legends, minimize/maximize widgets, and so on.

Types of Widgets

There are following types of widgets:

  • Data Widget: This displays only one value of graph whether it is Average, Maximum, Minimum, Standard Deviation, Last Sample, or Sample count along with the graph name and display name. Different color icons represent different graphs. Vector count is also supported data widget.

  • Graph Widget: This displays only graph on that widget. Graph can be of any type, such as Normal, percentile. Based on the graph type, there are chart type, such as Line, Bar, Area, Percentile, Slab, Meter, Geo Map and so on. In Geo map, locations can be displayed by city and state (for US only). 

  • Tabular Widget: This displays data in tabular form. The data contains Average, Maximum, Minimum, Standard-Deviation, Last Sample, and Sample Count by choice. 

  • System Health: This is used to configure the threshold values for system health based on various columns displayed in the lower pane of the graph, such as min, max, avg, and so on. Based on the threshold values defined, system health, such as minor, major, or critical is computed and displayed on the graph panel. 

To understand this better, let us take an example:

Here, various values are represented, such as:

Minimum - 12.00,
Maximum - 45.00, and
Average - 19.85

Now, we are configuring the threshold values in the System health section based on the ‘Average’ field:

Based on the above settings, the graph is displayed with the ‘Critical’ status as the threshold value for critical condition is configured greater than or equal to 19, which actually exists. As there is only one graph, the critical and major percentage is defined as 100%. If there would be multiple graphs (merged graphs), then we need to specify the percentage value accordingly.

In case of merged graphs, user can also specify the health rules. If the percentage of graphs exceeds the threshold values, the system health is considered based on the criteria and changed accordingly, whenever there is a dip or rise in the percentage of graphs.

Here, there are 11 graphs in the graph panel with different average values. If we apply the same settings as we did for single graph, but change percentage to 20% for critical and major both then it means that if 20% of the graphs exceeding the critical threshold average valued i.e. 19 then it is termed as critical.

The status displayed in the graph panel as critical.

Favorite parameterization is now supported for Tabular, Data, and Health widget. This can be achieved by selecting a particular row in tabular widget and then using “Page Dashboard” drill down option. For other Data and Health widgets, user can directly select the “Page Dashboard” option under Drilldown menu.

Dynamic Color in Lower Panel based on Severity

Along with the graph, the colors in the lower panel also change based on the severity. The servers that are in Critical condition are displayed in red color.

The servers that are in Major condition are displayed in orange color.

The servers that are in Normal condition are displayed in green color.

Layouts

Web dashboard introduced various types of layouts. One layout is a combination of different types of widgets of different sizes. There are predefined Layouts bundled with the product. User can create a new custom layout also.

Types of Layout

There are following types of layout available in Web Dashboard:

GraphThis contains various layouts for graph type widgets, such as 2X2, 3X3, 4X4, and so on.
DataThis contains various categories for 3X3 data widgets, such as last sample, max data, avg data, stddev data, and so on.
TabularThis contains various layouts for tabular widgets, such as 2X2, 3X3, 2X1.
MixedThis is a combination of graph, data, and tabular widgets.
CustomThis contains some custom created layouts.

Create Layout

User can select the predefined metrics (such as 2X2, 3X3) from the layout types (as mentioned above) or can define the metrics using the Add New Layout icon . within the Advanced Settings section. On clicking this icon, the Add New Layout window is displayed.

Specify the number of rows and columns. To eliminate scrolling and allow widgets fit to screen, select the Fit To Screen check box. Read the rules for layout creation and click the Create button. The layout is created and displayed on the panel.

Save Layout

User can save a layout for future reference. To do this, click the Save Layout icon . The Save Layout window is displayed. Enter the layout name and its description. Then, click OK. The layout is saved in the Custom Layout section.

Auto Fit Layout

This feature fits all widgets in visible area by resizing them automatically. To view all the widgets in panel without scrolling, user can use this option. It automatically decreases the size of widgets to fit it in visible area and eliminates scrolling. To apply this, click the  icon within the Advanced Settings section. In the below image, the scrolling is eliminated after Auto Fit Layout option is selected.

Monochromatic Colors

Monochromatic color theme is available and uses different shades of single color for multiple graphs. The monochromatic theme is an extension to the existing pre-bundled color themes in the web dashboard.

  • User can apply this feature for all widgets or on specific widget.
  • There are many color sets available to apply. If user applies this feature then a default color set based on theme is applied.
  • User has an option to have few widgets with multi-color and few with mono colors.
  • This feature is not applicable for default template.

Apply Monochromatic Colors (for all widgets)

To apply monochromatic color for all widgets, click the Monochromatic Color icon  within the Advanced Settings at the top-right corner of the window. This displays a section with monochromatic color patterns. Select a color pattern to apply the monochromatic colors to all widgets.

This applies the selected monochromatic color pattern to all widgets. If  icon is not visible, enable it via Configurations > Configuration Settings > Dashboard Settings > Graph Settings > Enable Monochromatic Color check box.

Apply Monochromatic Colors (for selected widget)

User can also apply monochromatic colors for selected widgets only. To do this, follow the below mentioned steps:

  1. Select a widget, go to panel setting, and click the Widget Settings option.

2. On the Widget Settings dialog box, go to the Advance Settings section, select the Monochromatic Color check box, click the icon, and select the monochromatic color pattern from the list.

  1. Click the Save This sets the selected monochromatic color to that widget.

Performance Dashboard / Infrastructure View

Performance dashboard provides an insight into the performance of the application. To access the performance dashboard, go to Advanced > Infrastructure View.

Upon clicking this link, the Performance Dashboard is displayed with  various sections related to the performance of system that includes – summary, environment, release details, disk usage, inventory sheet, report, and configurations.

Summary

  • Details of ongoing tests: This includes details, such as appliance IP, controller name, test run number, test run name, scenario name, start time, run time, started by, and so on.

  • Graphs: This displays graphs of overall disk stats, such as used disk space and available disk space for various tiers.

 

  • Running Projects: This provides details of running projects, such as environment details and channel details.

  • Upcoming Projects: This provides details of upcoming projects, such as environment details and channel details.

Environment

This displays graphs of various environments.

Release Details

This provides release history based on environment and channel.

Disk Usage

This provide disk usage details, such as available memory in value and percentage based on the tier and server.

Inventory Sheet

This provides inventory details based on the appliance. The details include – Appliance name, IPMI, OS version, Environment, Data Center, CPU Utilization, Total RAM, and Total Disk.

Upon clicking the appliance name, it displays information, such as controller, port, project, purpose, build product, and backup controller.

Reports

In this section, the user can generate and download reports. To generate a new report, provide start date and time, end date and time, and click the Generate Report button.

To download a report, click the PDF icon () within the download section.

Note: Reports are auto generated on day change.

Configuration

In this section, the user can configure (Add / Delete / Update) the following details:

  • Controller Info
  • Environment Details
  • Upcoming Projects
  • Running Projects
  • Released Details
  • Inventory Sheet

Controller Info

In this section, a user can configure (add, update, and delete) the controller information (such as IP address and datacenter name).

To add a controller info, click the Add button. This displays the Add Controller Info window. The user needs to provide the following details and click the Save button.

  • Controller IP Address
  • Data Center (server name, such as Mosaic or SCS)

The provided controller details are added in the Controller Info list.

Note:

  • To delete a controller detail, select the controller and click the Delete
  • To update a controller detail, such as IP address and DC name, select the controller and click the Update button.

Environment Details

In this section, a user can configure (add, update, and delete) the environment details (such as environment name and channel).

To add an environment details, click the Add button. This displays the Add Environment Details window. The user needs to provide the environment name and channel name.

  • Environment Name: Click the Browse icon () for the selection of favorite which is to be added in Environment details.

Note: In case of Performance Dashboard, favorites with .fav extension only are supported.

  • Channel Name: Select the favorite and provide the channel name, then click Save. The added favorite is displayed in Environment list.

Upcoming Projects

In this section, a user can configure (add, update, and delete) the details (release version, sign-off date, and project to be delivered) for upcoming projects.

To add an upcoming project, user needs to select the environment and the channel. Then, click the Add button. This displays Add Upcoming Project window.

Note: The user can associate only one project with a channel.

Provide the following details and click Save:

  • Release: Release information, such as release build and version.
  • Sign-Off Date: The estimated sign-off date of the project to be delivered.
  • Project: Project name and a brief description.

 The upcoming project details is displayed in the list.

The user can delete / update details of upcoming project by selecting the project and clicking the Delete / Update button respectively.

The details of the added project is displayed in the Upcoming Projects section in the Home page.

Running Projects

In this section, a user can configure (add, update, and delete) the details (release number, detail info, ongoing project, build number, and Sign-off date) for running projects.

To add details of a running project, user needs to select the environment and the channel. Then, click the Add button. This displays Add Running Project window.

Provide the following details and click Save:

  • Release Number: Release number, such as 4.1.14, 4.1.15 of the running project.
  • Detail Info: Detailed information about the running project.
  • Ongoing Project: Name of the running project.
  • Build Number: Build number of the current release, such as 27, 28 and so on.
  • Sign-off Date: Date at which the running project is to be signed off and ready for delivery.

 The upcoming project details is displayed in the list.

The user can delete / update details of running project by selecting the project and clicking the Delete / Update button respectively.

Released Details

In this section, a user can configure (add, update, and delete) the released details (build number, Sign-Off date, Ongoing project, and release).

To add released details, user needs to select the environment and the channel. Then, click the Add button. This displays Add Released Details window.

Provide the following details and click Save:

  • Build Number: Build number of the current release, such as 27, 28 and so on.
  • Sign-off Date: Date at which the running project is to be signed off and ready for delivery.
  • Ongoing Project: Name of the ongoing project.
  • Release: Details of the release.

The release details is displayed in the list.

The user can delete / update details of release by selecting it and clicking the Delete / Update button respectively.

Inventory Sheet

In this section, a user can configure (add, update, and delete) the inventory sheet (appliance, IPMI, environment, data center, controller, port, project, purpose, and back-up controller).

To add inventory details, user needs to click the Add button. This displays Add Inventory Data window.

Provide the following details and click Save:

  • Appliance
  • Controller / Port
  • IPMI
  • Environment
  • Data Center
  • Project
  • Purpose
  • Backup Controller

 The release details is displayed in the list.

The user can delete / update details of inventory sheet by selecting it and clicking the Delete / Update button respectively.

Compare Trend Analysis

Trend compare shows aggregated any specified statics data (Avg/ Min/ Max/ Last/ nth Percentile) value of all measurements and draw a graph of any type.

To apply compare, user needs to select multiple test runs from the test run window and click Compare button.

This displays the Compare Settings window. There are two categories for comparison i.e. side-by-side compare and trend compare. On the top right corner, it displays the selected test runs in a drop down list. The side-by- side compare provide comparison with multiple test runs. Further, there are two major categories, such as Dashboard and Reports. Within the Dashboard section, there are three options i.e. whole test duration, by phase, and advance settings. In whole test duration, it compares between the selected tests for complete duration. In “By Phase” option, it compares between the selected tests for the specified phase only. In the “Advance Settings” option, user can define all the measurements according to the requirement. User can also set the “Preset” options and “View By” options and apply the compare mode.

In the Reports section, user can compare test runs based on all transactions, by template, or can perform some advance settings. In the “Advance Settings” option, user can define all the measurements according to the requirement. User can also set the “Preset” options and “View By” options and apply the compare mode.

Trend compare is performed to obtain a pattern from the already collected information i.e. data from the events that have already been occurred. This helps in predicting future events. From all the specified data, it can display graphs of any type. Trend compare also contains two major categories, such as Dashboard and Reports. Within the Dashboard section, there are three options i.e. whole test duration, by phase, and advance settings. In whole test duration, it compares between the selected tests for complete duration. In “By Phase” option, it compares between the selected tests for the specified phase only. In the “Advance Settings” option, user can define all the measurements according to the requirement. User can also set the “Preset” options and “View By” options and apply the compare mode. Based on the selected option, it displays the trend compare between the selected tests.

Trend Compare – Whole Test Duration (Dashboard)

After selecting the test runs, go to Trend Compare and click the Whole Test Duration radio button. Then, click the Apply button. This displays trend compare analysis for the whole test duration based on the selected test runs.

Trend Compare – Advance Settings (Dashboard)

After selecting the test runs, go to Trend Compare and click the Advance Settings radio button. Then, click the Apply button. This displays the Compare Settings window with advanced options. User needs to provide a measurement name, scenario, test run, preset option, and click the Add button. User can also edit the ‘view by’ and ‘view by value’. Click the Apply button.

This displays trend compare graphs along with the added measurement.

Trend Compare – All Transactions (Reports)

Upon selecting the All Transactions option within the Reports section, Trend Compare Report window is displayed with various sections, comparison of transactions having low, medium, and high response time in graphical format. It also displays various other comparisons in tabular format.

Widget Operations

What are Widget Operations

User can perform following operations on widgets

  • Stop Session
  • Pause Dashboard
  • Add Widget
  • Remove Widget
  • Minimize Widget
  • Maximize Widget
  • Move Widget
  • Resize Widget

Stop Session

  • Clicking ‘Stop Session’ aborts the current running session.

Pause / Resume Dashboard

  • Clicking the ‘Pause Dashboard’ pauses to capture the data from metrics. The data until the dashboard is paused is not displayed on Dashboard. Once the user clicks the ‘Resume’ button, it resumes the data capturing.

Add Widget

To add a widget, follow the below mentioned steps:

  1. On the top-right corner of the Web Dashboard, click the Advance Settings icon  and then go to Add Widget icon .

  1. The widget is added on the widget panel at the last. If there are many widgets already, user may need to scroll down to the newly added widget.

Remove Widget

To remove a widget, click the Remove Layout Widget icon 59corresponding to widget. The widget gets removed from the panel.

Maximize Widget

To maximize a widget, click the Maximize Widget icon   corresponding to the widget. The widget is maximized. To restore it, click the  icon.

Minimize Widget

To minimize a widget, click the Minimize Widget icon  corresponding to the widget. The widget is minimized.

Move Widget

To move the widget anywhere to the widget panel, drag it from the title.

Resize Widget

To change the size of the widget, stretch it from any of its edge.

Panel Settings

User can also perform some operations on panel via panel setting option. To open the panel settings, click the Panel Settings icon 64  or right-click over the graph.

User can perform following actions with the panel settings:

  • Widget Settings
  • Time Period
  • View By
  • Show Graph Data
  • Pattern Matching
  • Add to Custom Metrics
  • Show Graph in Tree
  • Reports
  • Run Command
  • Download
  • Advanced Settings / Open Merge
  • Overlay
  • Monochromatic Color

Widget Settings

Here, user can perform some settings on widget, such as selection of widget type and other details based on the widget type selected.

  1. To open the Widget settings panel, click the Widget Settings menu item. The Settings dialog box is displayed where user can perform the panel setting. Here, user can select the widget type and its corresponding details. User can also configure whether to show legend or not. Apart from this, user can edit caption, enable widget drill down, and can apply monochromatic color to that widget. Widget drill down is used for parameterization according to the selected panel.

  1. Select the Widget type, such as Graph, Data, Tabular, or System Health. The next selection is based on the Widget type selected. Here, we are describing about further options that are displayed on the selection of a particular widget type.

Widget Type – Graph

On selecting Graph as Widget type, user needs to select the other further fields.

Graph Type: There are following options under this:

  • Normal: This contains all the graphs. In case of normal graph only, user needs to select the formula type too, such as average, min, max, count, and sum count. User can add multiple formulas also. When a user selects graph type other than ‘Normal’ graph type, the ‘Graph Sample Filter’ option is disabled.
  • Percentile: This contains only the percentile graphs. A percentile is the value of a variable below which a certain percent of observations fall.
  • Slab count: Slab count graph is used to count number of samples in a particular time interval.
  • Category: The graphs belongs to this category are – Stacked area chart and stacked bar chart.
  • Correlated: Using correlated graphs, user can observe a correlated trend of specific graphs. This graph can be plotted into three chart type, such as Time Series, Bar, and Area chart. Upon selecting this option, user also needs to provide the correlated properties that includes minimum bucket, maximum bucket, total buckets, baseline graph, and left position.

  • Chart Types: There are following chart types:

Line Chart: The charts displayed in the form of lines.

Bar Chart: In this case, line chart is converted to Bars. User need to specify the criteria, such as Avg All, Avg Top 5, Avg Top 10, or Avg Bottom 10.

Pie Chart: It is useful in case of multiple graphs. If one graph is converted into Pie, then a simple circle filled with one color is displayed. It is needed to take average value or Last value of graph. If graph type is cumulative then system takes last sample value otherwise average value.

Area Chart: An area chart displays graphically quantitative data. The area between axis and line are commonly emphasized with colors and textures. Area chart is used to represent cumulative data using numbers or percentages over time. Use the area chart for showing trends over time among related attributes. The area chart is like the plot chart except that the area below the plotted line is filled in with color to indicate volume.

Stacked Area Chart: Stacked Area chart means area chart of each graph is stacked on each other.

Stacked Bar Chart: In this case, graph is converted to Stacked Bar chart. Stacked bar chart means bar of each graph is stacked on each other. It is useful in case of multiple graphs. If one graph is converted into Stacked Bar, then it looks like normal Bar graph.

Dial Chart: Purpose of Dial Graph is to easily analyse the data in online mode how data variation is coming and to view samples of data in Dial Chart except Line Chart. Sample of data is shown in dial chart through Dial Tick Interval. User need to specify the criteria, such as By last value or By Avg value. User also need to set the properties, such as – Minimum, Maximum, Threshold, Warning, and Critical.

Meter Chart: Purpose of Meter graph is to easily analyse the data in online mode how data variation is coming and to view samples of data in Meter Chart except Line Chart. Sample of data is shown in meter chart through Dial Tick Interval. User need to specify the criteria, such as By last value or By Avg value. User also need to set the properties, such as – Minimum, Maximum, Threshold, Warning, and Critical.

Donut Chart: Donut chart is represented in the form of a donut. User needs to specify the criteria either last or average.

Dual Axis Chart: Dual Axis charts are useful for comparing trends in two data sets whose numeric range differs greatly. A dual Axis chart allows a user to summarize or plot two y-axis variables that have different domains. For example, user can plot the available memory on one axis and the free memory on another axis.

Note: User can edit label of Y-axis in Dual Graph from Advance settings of Widget Setting.

Dual Axis Bar Chart: A dual bar chart allows a user to summarize or plot two y-axis variables that have different domains. For example, user can plot the Available Memory on one axis with Bar graph and the CPU Utilization on another axis with line graph.

Line Stacked Chart: If user wants to see combined graphs of a stacked bar and line chart, then Line Stacked chart is used. In Line Stacked chart, first selected graph displays as line graph and other displays as Stacked bar graph.

Dual Axis Area Chart:  In this type of graph, one graph is displayed as area chart and another graph is displayed as line chart. It is also known as multi-line area graph.

Dual Axis Stacked Bar Chart: This chart provides the data in the widget as one of the data being Dual axis line and another being Stacked bar.

Widget Type – Data

On selecting Data as Widget type, user needs to select the Data Field name, such as minimum, maximum, average, and so on. The data field name is filled in the display name field. User can change the display name according to requirements.

Widget Type – Tabular

On selecting Tabular as Widget type, user needs to select table type (Graph based stats/vector based stats) and the fields, such as minimum, maximum, average, and so on. In case of vector-based stats, user can enable the view of rank and score.

  1. User can edit the caption of the graph using the Edit Caption section.
  2. Click the Save button to save the settings.
noteTo delete the settings, click the Delete button.To cancel the settings, click the Cancel button.
  1. For illustration purpose, we have selected Widget type as graph, graph type is normal graph, formula type as Avg, and chart type as Stacked bar chart.

Widget Type – System Health

Top/Bottom Value

This drop-down is used to see Top/Bottom graphs based on Average, Minimum, Maximum or Last value. Earlier, Top/Bottom feature was supported for Bar and Pie chart only but now it is supported for all widget types and chart types.

Correlated Graphs

Using correlated graphs, user can observe a correlated trend of specific graphs.For example, user wants to analyze the Page Response Time as per Page Load increase.

Let’s understand this implementation by an example- Let we have 2 graphs Page Response Time (G1) and Page Load (G2) and their data are:

[00:00:00   00:00:10   00:00:20   00:00:30   00:00:40   00:00:50   00:00:60]

[   1    ,             4    ,             2   ,            5     ,          1    ,           4   ,             6   ] G1

[   20   ,          50   ,            20  ,           50    ,         10   ,         40  ,            60  ] G2

Let’s count for each sample is 1.From above data, we can observe the Page response against Load.We have to plot a correlated chart so we’ll packetize the data as follows:User has given min value of bucket 10, max is 50 and number of bucket are 5.X -axis will look like

10   20   30   40   50

Here all Load whose value is greater than 50 will fall in this bucket.Values that lie in bucket are as follows – Bucket       Values

10            4

20            1, 2

30            No values

40            4

50            4, 5, 6

Now we’ll draw a series using weighted average of values on each bucket.That is, if we have to plot a sample for 50th bucket then we’ll calculate weighted average like (4 *1 + 5 *1 + 6*1) / (1 + 1+ 1) = 4.66.We’ll do this for all graphs. For this, we have introduced a new graph type Correlated and this graph can be plotted into three chart types – Time Series, Bar, and Area chart. This also have a configuration GUI where user can define the Base line graph, min, and max value of bucket, number of buckets. This bucket values are representing the baseline graph values. Now, user can also specify the Y – axis graphs and can also set which graphs should be shown on left Y- axis and which on right Y -axis.

In correlated graph, we can see the value of a graph with respect to the baseline graph buckets.

If two graphs are there ‘Free memory’ and ‘CPU utilization’, where ‘CPU utilization’ is the baseline graph.

Then, average of the values of ‘Free memory’ that falls in the Bucket range of ‘CPU utilization’ is shown in the graph.

Steps for creating correlated graph

  1. Select a widget and merge two or more graphs on the widget.

  1. Open widget settings and select graph type as “Correlated Graph”.

  1. Select Baseline graph and values of minimum bucket, maximum bucket, and Total bucket.
  2. Select “Left position” and “Right position”, and save it.

Widget Settings – Legend Position

This is used to set the legend position for graph(s) on a widget. To enable this, select the Show Legend check box and then select the legend position (left / right / bottom) from the drop-down list.

The legend position is set based on the selection.

Widget Settings – Advance Settings

In this section, user can perform following operations:

  • Edit Caption: Here, user can edit the default caption of the graphs.
  • Widget Drill Down: Widget drill down is used for parameterization according to the selected panel.
  • Monochromatic Color: Using this, user can apply monochromatic color for the selected widget.
  • Disable Parameterization: Using this, the user can disable parameterization applied on the scripts.
  • Compare with: According to baseline, it creates three lines CRITICAL, MAJOR, and MINOR. For Fixed Trend in Auto Baseline, the user can only plot ‘Line’ chart in a widget for a given graph data range by setting Critical, Major, and Minor Baseline values from the Widget Setting window. The user can set these value and can save them as a favorite. It also works with zoom charts.

In Auto Baseline, another options are ‘weekly’ and ‘daily’ trend at widget level. In weekly mode, comparison is done on all the graphs with data of the previous week for same graphs, in same time frame. Similarly, in the daily trend mode, comparison is done with the previous day data. Below is an example showing comparison with last day data on applying baseline.

Shift back data: Here, the user can specify the duration (in minutes) by which the X-axis (Duration/Time) of the graph will shifted back by selected Duration

Widget Settings – Advance Filters

This section contains two further sub sections: Panel Graph Filter and Graph Sample Filter.

Panel Graph Filter

To enable the panel graph filter and display them in widgets according to the specified criteria, select the Enable Panel Graph Filter check box. Further, there are following filter options for showing graphs with specified values:

  • All Non Zero: When enabled, graphs with non-zero data is displayed.
  • All Zero: When enabled, graphs with zero data is displayed.
  • Advanced: In this case, user can apply advanced level filtering. User can discard the un-desired graphs by using this option. There are following filter options, such as <, >, <=, >=, Top, Bottom, In between, which helps to achieve the desired output. User can filter graph values by Min, Max, and Avg value of its graph data. User can also use the Include or Exclude options to get the filtered results. Include/exclude options includes/excludes the graphs that lies within the specified values. For example – if we try to find the graphs that has values between 50-100, then on include, system displays such graphs that has values from 50-100 and exclude option skips those results that contains graph values from 50-100 and displays the rest graphs. To enable the filters, user needs to enable the toggle button.

Graph Sample Filters

A user can filter graph samples based on the filters defined for graphs. For this, a user needs to perform the following actions:

  1. Select the Enable Graph Sample Filter check box.
  2. Select the graph from the drop-down list.
  3. Select the comparison operator (>=, <= and, In Between) and its value.
  4. Click Add.

The base graph is displayed based on the filter value set in the Advance filters and rest graphs are displayed with the value at that point of time.

The user can also set criteria for multiple graphs in the same manner. This works as an AND operator and graphs are displayed based on the matching criteria of all the graphs in the list.

The output in widget is displayed as below:

Note:

  • When a user selects graph type other than ‘Normal’ graph type, the ‘Graph Sample Filter’ option is disabled.
  • A user can now edit filter configuration of a graph sample by using the ‘Edit’ option in the ‘Action’ column. In addition, a confirmation message is displayed while deleting any configuration.

Time Period

Time Period and View By applied on Dashboard is visible on top panel, which will be loaded from favorite initially.

If user clicks on Time Period from the Panel settings, then a new window is displayed to change Preset and View By.

Preset option is used to apply time like Last whole scenario, N Days, Last N Weeks, Last N Months, Event Day.

There are following options in this:

  • Last 10 minutes: This shows the graph data of last 1 hour in graph series.
  • Last 1 hr: This shows the graph data of last 1 hour in graph series.
  • Last 2 hrs: This shows the graph data of last 2 hours in graph series.
  • Last 4 hrs: This shows the graph data of last 4 hours in graph series.
  • Last 6 hrs: This shows the graph data of last 6 hours in graph series.
  • Last 12 hrs: This shows the graph data of last 12 hours in graph series.
  • Last 24 hrs: This shows the graph data of last 24 hours in graph series.
  • Last Specified Minutes: User can see last N minutes’ data in graph series.
    • Specified Time and Phase: Using this option, user can see graph data for specified Time and Phase in graph series.
    • Whole Scenario: This shows the graph data of Total Run Time.
    • Custom: In this case, user needs to specify the time format (elapsed/absolute) and further specify the start time and end time accordingly.

Running: Upon selecting this check box, the last updated sample is included in the graph result based on the view by value selected.

View by: This option is used to view the graphs aggregated by a specified interval. There are following options – 5 min, 15 min, 30 min, 2 hours 30 min, Auto, custom. By default, ‘auto’ is selected. In custom mode, specify the minutes and seconds in the multiple of sample interval.

To apply time period on all widgets, select the Apply time period on all widgets check box.

Discontinued Metrics

Discontinued metrics are those metrics whose data is dropped in between of the test run. These metrics are skipped in the current view of graphs. It is neither displayed on the graph panel nor displayed in the tree structure. All such metrics can be displayed using the Show Discontinued Metrics feature of Web Dashboard.

The default status of ‘Show Discontinued Metrics’ check box is enabled/selected in Excel report. This enables a user to get the data of discontinued metrics too (by default) while generating an Excel report.

Example:

On opening the web dashboard for a specific test run, GUIDevTier and QATier tiers are displayed (along with their associated graphs) under SysStats Linux Extended group.

On enabling the Show Discontinued Metrics feature, the discontinued metrics are added in the tree view.

This signifies that metrics/graphs of Cavisson group are discontinued in between due to certain issue. To view the graphs, expand the node. The graphs are displayed on the graph panel.

Searching Discontinued Metrics

Discontinued metrics/graphs can also be searched using the search panel.

View By

User can apply View by from right click menu of the widget. However, only best view by options are provided, which are producing samples between 20 and 100.

View By – 1 Minute

When a user zooms any graph, ‘View by’ option along with time period is displayed.

Show Graph Data

  1. To view the graph data, click the Show Graph Data menu item within the Panel settings menu. The graph data is displayed with information, such as sample time, running Vusers, and active users..

  1. To navigate to the pages, use the navigation button displayed at the bottom.
  2. User can also download the graph data in various formats, such as PDF, Excel, or Word.
  3. To close the window, click the Close button.

Pattern Matching

Pattern Matching (correlation) is the degree to which two or more attributes or measurements on the same group of elements show a tendency to vary together. Pattern matching feature is used to identify all those graphs that contains a similar pattern. User can correlate two or more graphs from Dashboard.

Prerequisites for Pattern Matching

  • Baseline graph should be there.
  • Other graphs should be selected for pattern matching (can be one or more than one).
  • By default, threshold value is 80.

Steps for Pattern Matching

User needs to follow the below mentioned steps for pattern matching of graphs:

  1. Select a graph where a spike is recognized, the graph is displayed on the widget panel.

  1. Zoom the graph where the spike is noticed.

  1. Go to Panel Settings and click Pattern Matching

  1. The Pattern Matching window is displayed. The selected graph is considered as baseline graph and pattern matching is performed based on the baseline graph.

  1. Specify the threshold value, by default it is 80.
  2. To include inverse pattern matching in the comparison criteria, select the Inverse Pattern Matching check box. By default, it is selected. Inverse pattern matching compares the baseline graph with anti-graphs also. It means, the graphs with matched pattern in the reverse direction (-ve values) are also compared.
  3. Select the category, such as all graphs, selected graphs, or selected catalogue.

All Graphs

On selecting this option, baseline graph is compared with all graphs. To skip the cumulative and response time graphs, select the check boxes respectively.

Select Graphs

On selecting this option, user needs to select graphs for match pattern using the arrow button.

Here are two options All and Specified for inclusion of graphs. On selecting All option, all the selected graphs are considered for comparison. On selecting Specified option, Specified Indices Selection window is displayed where user can select the specified graphs. This window contains two tabs – Specified and Advanced.

On the Specified tab, user can select the indices from the list of available indices using the Add button.

On the Advanced tab, user can specify the vectors based on selection. User can also apply pattern for the same.  On applying, the Specified text box is filled with the mentioned criteria.

Select Catalogue

User can save graphs as Catalogue by clicking the Save As Catalogue button. Once saved, it can be used by selecting the Select Catalogue option.

  1. On selecting the category (All/Specified/Catalogue), click the Match Pattern In this case, we have selected All.
  2. The graphs with matched pattern are displayed.

Note: Pattern Matching graphs are sorted based on the matched percentage with the baseline graph. Graphs with high match percentage are displayed first in the list.

  1. First graph is the baseline graph and rest are the those graphs whose pattern is match with the baseline graph. Following details are displayed on this window:
  • Base Metric Name
  • Start Date Time
  • End Date Time
  • Threshold value
  • Related Metric Count
  1. On clicking the Pattern Match Table icon  (at the top), the pattern match results are displayed.

  1. User can view the correlated graphs with percentage by clicking the related metric count. To download this report, click the Download button.

Add to Custom Metrics

  1. To add graphs to the custom metrics, click the Add to custom metrics menu item. A dialog box is displayed prompts to add graph in custom metrics.

  1. Enter the group name for storing the graphs in custom metrics, for example VUsers.
  2. Click OK. The group is added in the custom metrics.

Show Graph in Tree

  1. Graphs can also be viewed in the tree structure. To do this, click the Show Graph in Tree menu item, the graph is displayed in the tree structure in the Standard metrics section.

Reports

To generate a report, follow the below mentioned steps:

  1. Click the Reports link under the panel settings, a section for report generation is displayed. Here, user can select the report specifications based on the requirements.

  1. Select the report type from the list, such as Stats, Compare. User can select the report type as Compare only when compare is applied in Web dashboard. This is beneficial to generate the report on minimal parameters.
  2. Select the report view type, such as word, HTML, tabular from the list of view types.
  3. Select the widget info to specify whether the report is to be generated for selected widget or all widgets.
  4. To include the charts in the widget, select the Include Charts check box else clear it.
  5. Click the Generate button to generate the report.
 noteIf pop-ups are blocked, unblock the pop-ups to allow the browser to download the reports.

 Example – Here is a sample configuration for the report generation.

The above configuration generates a Stats report in tabular format for all widgets including charts.

The report displays various details, such as test run time, applied time, test run duration, and so on. This report is categorized into two sections i.e. General report and Percentile report. Each section contains various other details. Clicking the hyperlink displays the corresponding chart.

The report/chart can be downloaded as PDF, Word or Excel format.

Download As

  1. To download a graph, click the Download As menu item.
  2. Select the download format from the list of items. User has options to download the graph in multiple formats, such as:
  • SVG
  • PNG
  • JPEG
  • PDF
  • CSV
  • XLS
  1. The file is displayed based on the download option selected. For example, here we have selected PDF.

Scale

This feature is added to reduce the visualization and interpretation complexities arising from having a large as well as small graph values on the same widget. Scaling enables distinct display of very small values compared with very high values on the same widget. Two scaling modes are provided, logarithmic and auto.

To enable scaling for all widgets, go to Settings > Graph Settings, and enable Graph Scaling.

Once scaling is enabled,  icon is displayed over the widget.

Key Pointers

  • Scaling can be changed/applied from widget
  • If scaling option is changed/applied from widget, then it will be applicable on that widget only
  • If scaling by specified metrics is selected, then on selection of metrics from lower pane or from widget will change scaling.
  • From configuration GUI, user can change default option of scaling

Let us take an Example:

In below graph panel, there is a graph with low values (displayed with green color) and hence it is difficult to view the graph data with respect to the higher valued graphs.

To have a better view, user can apply scaling on the graphs. To do this, enable the scaling via Settings > Graph Settings, and enable Graph Scaling. There are two modes of scaling – Auto and Logarithmic.

Auto

This this mode, scaling is applied on the graph having the highest value.

The scaling factor is calculated and displayed in the lower panel automatically. To find the actual value at any instance, mouse over to that instance. User can change the scaling base metric by clicking if from the lower panel. Scaling is re-calculated according to selected metric and redraw the chart. This is applicable for both cases either for single graph or for multiple graphs on the panels.

Logarithmic

Here we can use logarithmic scaling to handle the large number of metric or graphs.

In mathematics, the logarithm is the inverse operation to exponentiation, just as division is the inverse of multiplication and vice versa. That means the logarithm of a number is the exponent to which another fixed number, the base, must be raised to produce that number. In simple cases, the logarithm counts factors in multiplication. For example, the base 10 logarithm of 1000 is 3, as 10 to the power 3 is 1000 (1000 = 10 × 10 × 10 = 103); 10 is used as a factor three times.

Scaling Off

To disable scaling from the graphs, select Off from the scale menu. This laid the graphs in their original form.

Run Command

This feature is used to run command on server. Follow the below mentioned steps to run command on server:

  1. Click the Run Command menu item under panel settings. The Run Command window is displayed.

  1. Select tier name, server name, group name, and command name.
  2. Other options also get enabled based on the selection, such as for process management group, the options – select all process, full format, long list, and show threads get enabled. User can select them according to requirements.
  3. User can also apply certain filters and can save the output on server.
  4. Post specifying the details, click the Run button to run the command. The output gets displayed in the Command Output To refresh the command, click the Refresh button.

User can change the view type and delimiter according to the requirement.

Advance Open/Merge Metrics

This section is covered under Advance Open /Merge Metrics section in Advanced Options.

Monochromatic Color

Form here, user can enable / disable the application of monochromatic colors on the panel. If it is “On”, monochromatic colors can be applied otherwise not.

Overlay

Overlay Alerts displays stats of the alert generated in the graphs. User will get the alert events from Alert History. Based on its time stamp, user will get annotations on the graph, to show the different types of Alerts (Critical / Major / Minor / Normal).

There are different representation for different type of Alerts:

  • Red colored flags for Critical Alerts
  • Orange colored flags for Major Alerts
  • Yellow colored flags for Minor Alerts
  • Blue colored flags for Normal Alerts

Viewing Overlay for Alerts

  1. Right-click on a widget panel and go to Overlays > Alerts > Add Overlay.

Note: This option is visible for graph type widget only.

  1. Upon clicking Add Overlay, Alert Overlays dialog box is displayed.

3. Select the severity level from the available options:

  • All: All severity level is considered for displaying overlay alerts.
  • Critical: Only ‘Critical’ alerts are considered and are represented with ‘Red’ color.
  • Major: Only ‘Major’ alerts are considered and are represented with ‘Orange’ color.
  • Minor: Only ‘Minor’ alerts are considered and are represented with ‘Yellow’ color.
  • Normal: Only ‘Normal’ alerts are considered and are represented with ‘Blue’ color.
  1. Click Apply. This displays the overlay alerts with the specified representation.

 There are two types of tooltip in Alert Overlay. The first one displays on hovering over the flag. This tooltip shows the graph information along with the maximum alert severity and its severity.

The second tool-tip displays on clicking the flag icon. This displays the detailed information of the applied overlay in tabular format.

Drill Down

How to perform Drill-down operation in various ways:

End to End Application Performance Monitoring – RCA of Performance Issue (Event)
End to end Performance Monitoring – RCA of High Response Log Patterns

Drill down contains various reports based on the metrics:

For Business Transactions

  • Flowpath Report
  • Flowpath group by business transaction
  • DB request report
  • DB request group by business transaction
  • Normal transaction
  • Slow transaction
  • Very slow transaction
  • Error transaction
  • Method timing
  • Group by custom data
  • Transaction summary report
  • Transaction summary by stats report
  • Transaction instance report

For Flowpaths

  • Method timing
  • Flowpath by signature report
  • Flowpath report
  • Logs report

For DB Queries

  • Method Timing
  • Flowpath by Signature report
  • Flowpath report
  • Select queries
  • Group by select queries

HTTP Condition Stats

  • Flowpath report
  • All Instance logs

Thread Hotspots

  • Thread Hotspot details
End to End Application Performance Monitoring – RCA of Performance Issue (Event)

End to end Performance Monitoring – RCA of High Response Log Patterns