RadialGauge for ASP.NET MVC

  • Add a circular scale to your ASP.NET MVC application
  • The RadialGauge control displays a circular scale with an indicator that represents a single value and optional ranges to represent reference values
  • Use the RadialGauge as a simple indicator, or set the IsReadOnly property to false and use it as input control
  • Populate the Ranges collection to define ranges of interest, which are shown in different colors
Download Free Trial

Display Values

The radial gauge control offers a ShowText property that determines which values the gauge should display as text.

Automatic Scaling

The RadialGauge offers two properties to configure its layout: StartAngle and SweepAngle. The StartAngle property specifies the RadialGauge's starting angle or its rotation. The SweepAngle property specifies an angle representing the length of the RadialGauge's arc. The RadialGauge also offers an AutoScale property. When AutoScale is set to true, the RadialGauge will be automatically scaled to fill its containing element.

Customize with Themes

The appearance of the gauge controls is largely defined in CSS. You can customize the appearance of all MVC controls to achieve a consistent, attractive look with several professionally-designed themes or use the default theme.

 

Show Ranges

RadialGauge has a Ranges property that contains an array of Range objects. By default, the ranges are displayed on the face of the gauge to indicate zones of interest, but the ShowRanges property can be used to hide the ranges. The gauge will determine which range contains the current gauge value and will apply that range's color to the gauge pointer.

Display Needles Bound to the Gauge Value

Gauge needles, or pointers, are used to indicate the gauge value and are often the alternative to the filled-bar design of most modern gauges. The RadialGauge control for ASP.NET Core MVC now supports needle-based pointers with custom shapes and lengths.