How to Format Text in Gauges

Using ADF Gauge Components 25-17 within the plot area, the length of the tick labels must be limited to fit in this space. You can customize your gauge to use exterior labels. To create interior tick labels on a gauge: 1. In the Structure window, right-click the gauge node and choose Insert inside dvt:gauge ADF Data Visualization Tick Mark. 2. In the Property Inspector, select TLP_POSITION for the Position attribute.

25.4.12 Specifying Transparency for Parts of a Gauge

You can specify that various parts of a gauge show transparent colors by setting the borderColor and fillColor attributes on the gauge child tags related to these parts of the gauge. These color properties accept a 6 or 8 RGB hexidecimal value. When an 8-digit value is used, the first two digits represent transparency. For example, you can set transparency by using a value of 00FFFFFF. Any gauge child tag that supports borderColor or fillColor attributes can be set to transparency. The following list are examples of parts of the gauge that support transparency: ■ Gauge background: Use the dvt:gaugeBackground tag. ■ Gauge gauge frame: Use the dvt:gaugeFrame tag. ■ Gauge plot area: Use the dvt:gaugePlotArea tag. ■ Gauge legend area: Use the dvt:gaugeLegendArea tag.

25.5 Adding Gauge Special Effects and Animation

These gauge features are used less frequently than the common gauge features. These special features include applying gradient effects to parts of a gauge, adding interactivity to gauges, animating gauges, and taking advantage of the gauge support for active data.

25.5.1 How to Use Gradient Special Effects in a Gauge

A gradient is a special effect in which an object changes color gradually. Each color in a gradient is represented by a stop. The first stop is stop 0, the second is stop 1, and so on. You must specify the number of stops in the special effects for a subcomponent of a gauge that supports special effects. You can define gradient special effects for the following subcomponents of a gauge: ■ Gauge background: Uses the dvt:gaugeBackground tag. ■ Gauge set background: Uses the dvt:gaugeSetBackground tag. ■ Gauge plot area: Uses the dvt:gaugePlotArea tag. ■ Gauge frame: Uses the dvt:gaugeFrame tag. ■ Gauge legend area: Uses the dvt:gaugeLegendArea tag. ■ Lower label frame: Uses the dvt:lowerLabelFrame tag. ■ Upper label frame: Uses the dvt:upperLabelFrame tag. ■ Indicator: Uses the dvt:indicator tag. ■ Indicator bar: Uses the dvt:indicatorBar tag. 25-18 Web User Interface Developers Guide for Oracle Application Development Framework ■ Indicator base: Uses the dvt:indicatorBase tag. ■ Threshold: Uses the dvt:threshold tag. The approach that you use to define gradient special effects is identical for each part of the gauge that supports these effects.

25.5.1.1 Adding Gradient Special Effects to a Gauge

For each subcomponent of a gauge to which you want to add special effects, you must insert a dvt:specialEffects tag as a child tag of the subcomponent. For example, if you want to add a gradient to the background of a gauge, then you would create one dvt:specialEffects tag that is a child of the dvt:background tag. You must also set the dvt:specialEffects tag fillType property to FT_GRADIENT. Then, optionally if you want to control the rate of change for the fill color of the subcomponent, you would add as many dvt:gradientStopStyle tags as you need to control the color and rate of change for the fill color of the component. These dvt:gradientStopStyle tags then must be entered as child tags of the single dvt:specialEffects tag. Before you begin: If you have not inserted a dvt:gaugeBackground tag as a child of the gauge, in the Structure window, right-click the gauge node and choose Insert inside dvt:gauge ADF Data Visualization Gauge Background. To add a gradient special effect to the background of a gauge:

1. In the Structure window, right-click the gauge background node and choose Insert

inside dvt:gaugeBackground Special Effects. 2. Use the Property Inspector to enter values for the attributes of the dvt:specialEffects tag: a. For fillType attribute, select FT_GRADIENT. b. For gradientDirection attribute, select the direction of change that you want to use for the gradient fill. c. For the numStops attribute, enter the number of stops to use for the gradient. 3. Optionally, in the Structure window, right-click the special effects node and choose Insert within dvt:specialEffects dvt:gradientStopStyle if you want to control the color and rate of change for each gradient stop. 4. Use the Property Inspector to enter values for the attributes of the dvt:gradientStopStyle tag: a. For the stopIndex attribute, enter a zero-based integer as an index within the dvt:gradientStopStyle tags that are included within the dvt:specialEffects tag. b. For the gradientStopColor attribute, enter the color that you want to use at this specific point along the gradient. c. For the gradientStopPosition attribute, enter the proportional distance along a gradient for the identified stop color. The gradient is scaled from 0 to 100. If 0 or 100 is not specified, default positions are used for those points. 5. Repeat Step 3 and Step 4 for each gradient stop that you want to specify.