We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Trusted by the world’s leading companies

Syncfusion Trusted Companies

Overview

Syncfusion flutter radial gauge is a data visualization widget, which is written in dart, to helps to display numerical values on a circular scale. It has a rich set of features such as axes, ranges, pointers, and annotations that are fully customizable and extendable. Using flutter radial gauge, we can create speedometer, temperature monitor, dashboard, meter gauge, multi-axis clock, gauge watch, modern activity gauge, direction compass, etc.


Radial Axis

The axis of the Flutter Radial Gauge control is an easily customizable radial arc in which a set of values can be plotted based on business logic.

Radial gauge labels customization

Labels customization

Customize the look and feel of the default labels using the text style, size, and color properties. You can also add prefix or suffix text to the label.

Radial gauge ticks customization

Ticks customization

Define your own style for minor and major ticks with the help of the size, color, and thickness properties.

Setting offset to position radial gauge control

Offset

To enhance readability, change the default axis position by setting the offset value for labels, ticks, and the axis line.

Axis customization support for radial gauge

Axis line

The axis line is used to add a radial border to a gauge. You can change the default axis line’s look to your own style.

Multiple axis support for radial gauge

Multiple axis

Add multiple axis to the gauge to design it like a clock, dashboard, speedometer, etc.

Direction support for radial gauge

Direction

Change the axis direction to clockwise or counterclockwise.

Custom axis in radial gauge

Custom axis

Custom axis allows to display the set of values along a linear or custom scale based on the design requirements.


Gauge range

A range of the Flutter radial gauge is a visual element that helps you quickly visualize where a value falls on a radial axis.

Range label support for radial gauge

Range label

The range label is used to annotate the text in range to improve the readability.

Width customization of radial gauge ranges

Range width

The range width varies based on the values to enhance usage and readability.

Multiple ranges support in radial gauge

Multiple ranges

The Flutter Radial Gauge control allows you to add multiple ranges inside the radial axis to indicate color variation.

Range grouping support in radial gauge

Range Grouping

You can combine multiple ranges as a single group using the text pointer.


Gauge Pointer

Pointers contains a list of pointer elements, where you can add any number of gauge pointers such as needle pointer, range pointer and marker pointer inside the axis to indicate the value.

Needle pointer support in radial gauge

Needle pointer

Indicate a current value by using the highly customizable needle-type element.

Marker pointer support in radial gauge

Marker pointer

To highlight values, set the marker pointer type to a built-in shape, such as a triangle, inverted triangle, square, or diamond.

Image pointer support in radial gauge

Image pointer

To highlight values using text, set the marker pointer type to a built-in type as image.

Range pointer support in radial gauge

Range pointer

A range pointer is used to indicate the current value relative to the start value of a radial axis.


Annotations

Annotations display metadata about a flutter radial gauge at specific points of interest in a plotting area.

Image annotations support for radial gauge

Image annotations

The annotations feature provides options to add any image over a gauge control with respect to angle or axis value. You can add multiple images in a single control.

Text annotations support in radial gauge

Text annotations

Add any text over the Radial Gauge control to enhance its readability. You can also add multiple text instances in a single control.


Pointer animation

The Flutter Radial Gauge control provides a visually appealing way when the pointer moves from one value to another. Gauge supports various pointer animations.

Pointer animation support for radial gauge


Pointer interaction

The Flutter Radial Gauge control provides an option to drag a pointer from one value to another. It is used to change the value at run time.

Pointer interaction support for circular gauge


Awards

Greatness—it’s one thing to say you have it, but it means more when others recognize it. Syncfusion is proud to hold the following industry awards.

Syncfusion Awards
Scroll up icon

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.