Chat now with support
Chat with Support

Foglight 7.3.0 - Web Component Tutorial

Using the Web Component Tutorial Tutorial 1: Drag and Drop Tutorial 2: Creating a Dashboard Tutorial 3: Adding a Drilldown Page Tutorial 4: Adding Views Tutorial 5: Using a Grid Tutorial 6: Reports Tutorial 7: Creating a Form Tutorial 8: Renderers Tutorial 9: Adding Questions and Answers Tutorial 10: Sending Messages to Other Users

Date Renderer

The Date renderer component encodes both date and time.

The figure shows how a date appears when the default renderer is used, and how it appears when both Display Length and Time Display Length are set to Full.

Figure 5. Displaying date renderers

The renderer can be used to display only the date or only the time.

The Custom Pattern property, based on JavaTM date formats, can be set, or the Fixed Format property, based on ISO 860. These properties are described in the Web Component Reference page describing the Date renderer.

Number Bar Renderer and Number Unit Renderer

The Number Bar renderer can be used to show a graphical representation of the number in relation to its maximum possible value.

The Number Unit renderer contains numerous properties. You are encouraged to read the “Number User Guide” page in the “Renderer Components” subsection of the Web Component Reference. You can control the number of decimal places in the display, the number’s rounding properties, how digits are grouped in big numbers, and provide a scaling factor.

There are default Number Unit renderers in Foglight® for the numerical quantities with units associated with them. You can change how a number and its unit appear by creating a new Number Unit renderer.

The following figure shows some examples of default renderers, and what can be accomplished by creating your own renderer.

Figure 6. Default renderers

Description of each label:

•
Available Paging Space current max using the default (Number Bar) renderer: No renderer is assigned. The system-supplied default renderer appends a percent sign and a bar as instructed by the system.
•
Available Paging Space current max using a custom Number Bar renderer: Just to show how you can change the default behavior, the custom Number Bar renderer in this example stretches the length of the bar that shows the percentage of used paging space.
•
Available Paging Space current max using a Number Unit renderer: This time a Number Unit renderer is used instead of a Number Bar renderer. The number is expressed as a percentage, but it is positioned closer to the left margin.
•
Number Unit renderer, Free Memory, Default system-supplied renderer: The system supplies a version of the Number Unit renderer that displays the free JVM memory. The default renderer uses grouping and displays the unit.
•
Number Unit renderer - Free Memory - not scaled: A custom version of the Number Unit renderer displays a number and its associated unit, but grouping is not enabled.
•
Number Unit renderer - Free Memory - scaled: The renderer and the associated unit are scaled.
•
Number Unit renderer - Disk Bytes Read: The way in which the renderer retrieve its value is what is different in this example. Normally the input value to a Number Unit renderer is a number, but there are times when that number is not directly available from the context. See Another example of working with an input value.

Configuring the Labels

Renderers are used for display, and in this tutorial the components display the numbers are labels. The objects supplying the numbers are:

•
Number Bar renderer: A host object whose data type is Host, chosen because it supplies the Available Paging Space metric, whose unit is percent
•
Number Unit renderer: An FSM Server of type CatalystServer, chosen because it supplies the JVM Free Memory metric, whose unit is number of bytes

Since there are three labels of each type, one query is constructed to supply the host and another to supply the FSM Server.

 
* 
NOTE: The queries should be constructed to supply top-level objects like hosts and FSM Servers, even though the query itself could drill into the desired property. The parent property supplies the unit, so configuring the proper path in the context setting ensures that the unit is properly assigned.
To configure the labels:
1
Construct a grid to hold the labels. Declare two internal context inputs, fsmServer and host, whose fallback values are queries that return the first objects in their respective lists.
2
Construct the renderers. For example, the Number Unit renderer - Free Memory - scaled label uses these property values:
•
Show Unit: true
•
Auto Scale Unit: true
•
Number: Context <value>
•
Use Grouping: true
•
Significant Digits: 3
3
Construct the labels. For example, the Number Unit renderer - Free Memory - scaled label uses these settings:
•
Context input key: fsmServer
•
Label property: first item of Context <fsmServer>/jvm/freeMemory/current/max
•
Renderer: Number Unit Renderer - Free Memory - scaled - query returning "Localized Value"
4
Add the label to the grid so that you can view the renderer’s output.

Another example of working with an input value

This example illustrates how a renderer’s input value can be used to select the necessary data type. The value displayed in Number Unit Renderer - Disk Bytes Read was found as follows:

1
Consider that this is the only available query:
•
Query name: Return a Metric - Disk Bytes Read
•
Query definition: Select objects of type Metric from the Monitoring data source (of type foglight-5) from Root of (foglight-5:default)/HostModel/hosts/storage/diskBytesRead
The query returns a list object of the Monitoring:Metric type, but it is the current/max property that should be displayed. The renderer can be configured to drill down to the required number.
The first item of the query, which is a Metric, is available through the context key metric.
2
Construct a Number Unit renderer, changing the default data source type and data type:
•
Name: Number Unit Renderer - Disk Bytes Read
•
Value Data Type: Monitoring:Metric
•
Configuration:
Show Unit: true
Number: Context <value>/current/max returning "Localized Value"
To get to the renderer’s Number property, pass in a Metric value and then drill down to the required number, which is the metric’s current/max.
3
Construct the label by setting its Label property as follows:
•
Label: Context <metric>
•
Renderer: Number Unit Renderer - Disk Bytes Read returning “Localized Value”

Add the label to the grid and test the result.

Related Documents

The document was helpful.

Select Rating

I easily found the information I needed.

Select Rating