Tutorials index / Example 16: Gauge
charts
How to draw nice gauge
charts. Super 2d/3d Graph Library allows you
to draw from one to 16+ gauges on the same
chart. In this example two random gauges are
drawn.
Steps:
1. Create a new Windows
application project (VB.NET)
2. Add Super 2d/3d Graph
Library to the toolbox pallete and drag it
to Form1.
3. Copy and paste de
following code:
Note: the code in the
Form1_Load event could be used in ASP.NET
applications as well.
Form Code
Imports
Super2d3dGraphLibrary
Public
Class
Form1
Private
Function
mcolRandomColor()
As
Color
mcolRandomColor =
Color.FromArgb(Rnd() * 255, Rnd() * 255,
Rnd() * 255)
End
Function
Private
Sub
Form1_Load(ByVal
sender
As
System.Object,
ByVal
e As
System.EventArgs)
Handles
MyBase.Load
Dim
k As
Integer
Dim
MAX_GAUGES
As
Integer
= 1
Dim
series(MAX_GAUGES)
As
ArrayList
' Two gauges
For
k = 0
To
MAX_GAUGES
series(k) =
New
ArrayList
series(k).Add(Rnd()
* 100)
Next
Dim
pens(MAX_GAUGES)
As
Pen
Dim
backStyle(MAX_GAUGES)
As
SolidBrush
Dim
borderStyle(MAX_GAUGES)
As
Pen
Dim
radius(MAX_GAUGES)
As
Single
Dim
circleBackColor(MAX_GAUGES)
As
SolidBrush
Dim
circleBorderStyle(MAX_GAUGES)
As
Pen
Dim
bigTickStyle(MAX_GAUGES)
As
Pen
Dim
smallTickStyle(MAX_GAUGES)
As
Pen
Dim
needleStyle(MAX_GAUGES)
As
Pen
Dim
seriesColor(MAX_GAUGES)
As
Color
With
Super2D3dGraph1
.AutoRefresh
=
False
.LicenseeIdentifier
=
"STAND"
.Title
=
"Gauge sample"
.Style
= STYLE2D3D.STYLE2D_GAUGE
.ShowDataTable
=
False
.ShowLegend
=
True
.LegendAlignment =
STYLEALIGNMENT.STYLEALIGNMENT_BOTTOM_CENTER
.SeriesLegend
=
New
String()
{"Dial
1",
"Dial 2"}
.LegendText
=
""
.YAxisScaleMode =
SCALEMODE.SCALEMODE_FIXED
.YAxisScaleMinimum
= 0
.YAxisScaleMaximum
= 100
.YAxisNumericFormat
=
"0"
.YAxisDividersCount
= 8
.YAxisColor =
Color.Yellow
For
k = 0
To
MAX_GAUGES
pens(k) =
New
Pen(mcolRandomColor, 6)
backStyle(k) =
New
SolidBrush(mcolRandomColor)
seriesColor(k) = backStyle(k).Color
borderStyle(k) =
New
Pen(mcolRandomColor, 3)
radius(k) = 0.25
circleBackColor(k) =
New
SolidBrush(mcolRandomColor)
circleBorderStyle(k) =
New
Pen(mcolRandomColor, 1)
bigTickStyle(k) =
New
Pen(mcolRandomColor, 5)
smallTickStyle(k) =
New
Pen(bigTickStyle(k).Color, 1)
needleStyle(k) =
New
Pen(mcolRandomColor, 4)
Next
.SeriesColor
= seriesColor
.BackStyle =
STYLEBACKGROUND.
STYLEBACKGROUND_GRADIENT_TUBULAR_INVERTED
.BackColor =
Color.PowderBlue
.GaugeNeedleStyle
= needleStyle
.GaugeBackStyle
= backStyle
.GaugeBorderStyle
= borderStyle
.GaugeCentralCircleRadius
= radius
.GaugeCentralCircleBackStyle
= circleBackColor
.GaugeCentralCircleBorderStyle
= circleBorderStyle
.GaugeBigTickStyle
= bigTickStyle
.GaugeSmallTickStyle
= smallTickStyle
.GaugeMarginFactor
= 0.05
.Series =
series
.RefreshChart()
End
With
End
Sub
End
Class
Result:

|