Infragistics logo
메뉴
.NET and JavaScript UI Controls
Version

Add a Range to a Gauge

Ranges are visual elements displayed on your gauge that begins and ends at specified values on a scale. Adding a range to the scale of your gauge lets you highlight specific sections.

Note
Note:

This topic assumes that you already created a Radial gauge with a scale, labels, needle marker and tick marks. For information on how to do this, see Add a Needle Marker to a Gauge.

You can add range to your scale:

When you save and run your application after completing the following steps, your gauge should look similar to the gauge below.

Radial gauge with a range applied to it.

To add ranges to your scales using the Gauge Designer:

  1. In the Gauge Explorer, expand Ranges.

  2. Click Add Ranges and select New Range.

  3. In the Value pane of the Range Layout tab of the Properties panel, set the following properties:

    • Start Value — 66

    • End Value — 100

  1. In the Extent pane of the Range Layout tab, set the following properties:

    • Inner Start — 75

    • Inner End — 85

    • Outer — 90

  1. Click the Appearance tab. In the Brush pane, set the following properties:

    • Type — Solid

    • Color — White

To add ranges to your scales at design time:

  1. In the Gauges collection editor, click the Scales property. Then, click the ellipsis button (…) to open the Scales collection editor.

  2. Click the Ranges property, then click the ellipsis button (…​) to open the Ranges collection editor

  3. Click Add.

  4. Click the BrushElement property, and from the drop-down list, select Solid Fill.

  5. Expand the BrushElement property and set the Color property to White.

  6. Set the following properties:

    • StartValue — 66

    • EndValue — 100

    • InnerExtentStart — 75

    • InnerExtentEnd — 85

    • OuterExtent — 90

To add ranges to your scales at run time:

  1. Add the following steps to the load event.

  2. Create instances of the classes:

In Visual Basic:

Dim myRange As New RadialGaugeRange
Dim mySolidFillBrushElement3 As New SolidFillBrushElement()

In C#:

RadialGaugeRange myRange = new RadialGaugeRange();
SolidFillBrushElement mySolidFillBrushElement3 = new SolidFillBrushElement();

  1. Set the following color properties:

    • Type — Solid

    • Color — White

In Visual Basic:

mySolidFillBrushElement3.Color = System.Drawing.Color.White
myRange.BrushElement = mySolidFillBrushElement3

In C#:

mySolidFillBrushElement3.Color = System.Drawing.Color.White;
myRange.BrushElement = mySolidFillBrushElement3;

  1. Set the following properties:

    • EndValue — 100

    • InnerExtentEnd — 75

    • InnerExtentStart — 85

    • OuterExtent — 90

    • StartValue — 66

In Visual Basic:

myRange.EndValue = 100
myRange.InnerExtentEnd = 75
myRange.InnerExtentStart = 85
myRange.OuterExtent = 90
myRange.StartValue = 66

In C#:

myRange.EndValue = 100;
myRange.InnerExtentEnd = 75;
myRange.InnerExtentStart = 85;
myRange.OuterExtent = 90;
myRange.StartValue = 66;

  1. Add your range to the Ranges collection:

In Visual Basic:

myScale.Ranges.Add(myRange)

In C#:

myScale.Ranges.Add(myRange);