How to Add Interactivity to Gauges

Using ADF Gauge Components 25-23 Table 25–2 shows the metadata IDs and the descriptions used for internal calculations, not rendered in the gauge. tickMark Used to define increments on the gauge. When a set of tick marks is specified with no tickMarkPath, the gauge will use the tick marks exactly where they appear on the plotArea. In this case, it is up to the user to ensure that the tick marks appear at equal increments. If a tickMarkPath is specified, the gauge will accept a single tickMark, at 90 degrees for the dial, and it will rotate and position the tickMark along the tickMarkPath. upperLabelFrame Refers to the frame that contains the topLabel when its position is LP_ABOVE_GAUGE. Setting the upperLabelFrame allows the user to customize the look of this frame. The gauge will position the upperLabelFrame in the same relative position to other gauge components when it is found in the custom shapes file. Table 25–2 Metadata IDs for Custom Shapes ID Description indicatorBarBounds Specifies the box containing the minimum and maximum extent of the indicator bar. If not specified, the bounding box is taken to be the entire indicator as specified in the input file. indicatorCenter Specifies the center of rotation for the indicator that rotates around in a dial gauge. The center of the shape with this ID is considered to be the indicator center. If not specified, it is assumed to be the center of the bottom edge of the plot area for an 180-degree dial gauge, and the center of the plot area for an N-degree dial gauge. ledFillArea Specifies the area of the LED gauge that should be filled with the appropriate threshold color. If not specified, then the entire plotArea shape specified in the graphics file will be filled with the threshold color. lowerLabelFrameTextBox For complex lowerLabelFrame shapes, specifies a rectangle that can be set as the lowerLabelFrameTextBox. This box determines the position of the bottom label within the lowerLabelFrame. plotAreaBounds Specified the bounding box for the plotArea. If no plotArea has been specified in this file, then a bounding box is needed for the gauge to draw the plot area of the gauge. If not specified, then the gaugeFrame will use its own bounding box for this purpose. thresholdFillArea Defines the area that will be filled with the threshold colors. For a dial gauge, specifies the thresholdFillArea that will be filled by sweeping an arc from the indicatorCenter. For a status meter gauge, specifies the thresholdFillArea that will be filled based on the orientation of the status meter gauge. tickMarkPath Defines the path in which to draw tick marks. This is necessary for the gauge to calculate where tick marks should be drawn on a custom plot area, and the gauge will be unable to change the majorTickCount if this is not specified. Table 25–1 Cont. Gauge Component IDs for Custom Shapes ID Description 25-24 Web User Interface Developers Guide for Oracle Application Development Framework Example 25–9 shows a sample SVG file used to specify custom shapes for the components of a gauge. Example 25–9 Sample SVG File Used for Gauge Custom Shapes ?xml version=1.0 encoding=UTF-8 standalone=no? svg xmlns:svg=http:www.w3.org2000svg xmlns=http:www.w3.org2000svg version=1.0 rect width=264.72726 height=179.18887 rx=8.2879562 ry=10.368411 x=152.76225 y=202.13995 style=fill:c83737;fill-opacity:1;stroke:none id=gaugeFrame rect width=263.09058 height=42.581127 rx=3.0565372 ry=3.414634 x=155.11697 y=392.35468 fill=c83737 id=lowerLabelFrame rect width=241.79999 height=120.13961 x=164.2415 y=215.94714 style=fill:ffeeaa id=plotAreaBounds rect width=74.516975 height=44.101883 rx=2.6630435 ry=3.5365853 x=247.883 y=325.4415 style=fill:ffd5d5;fill-opacity:1;stroke:none id=indicatorBase rect width=6.0830183 height=98.849045 rx=2.6630435 ry=2.2987804 x=282.86035 y=237.23772 style=fill:00aa00;fill-opacity:1;stroke:none id=indicator svg

25.6.2 How to Use a Custom Shapes File

After creating the SVG file to be used to specify the custom shapes for your gauge, set the customShapesPath attribute to point to the file. To specify a custom shapes file: 1. In the Structure window, right-click the dvt:gauge node and choose Go to Properties .

2. In the Appearance attributes category of the Property Inspector, for the

CustomShapesPath attribute, enter the path to the custom shapes file. For example, customShapesPath=pathcustomShapesFile.svg.

25.6.3 What You May Need to Know About Supported SVG Features

The custom shapes available to you support the following SVG features: upperLabelFrameTextBox For complex upperLabelFrame shapes, specifies a rectangle that can be set as the upperLabelFrameTextBox. This box determines the position of the topLabel within the upperLabelFrame. Table 25–2 Cont. Metadata IDs for Custom Shapes ID Description