New Horizontal and Vertical Linear Gauges in Rollbase

New Horizontal and Vertical Linear Gauges in Rollbase

Posted on April 10, 2017 0 Comments
New Horizontal and Vertical Linear Gauges in Rollbase_870x220

Rollbase now provides no-code horizontal and vertical linear gauges. Just select and add to your application to optimize your low-code app for desktop or mobile.

Adding gauges to visually represent data in your dashboards will increase the visibility of your application data. Based on your application’s need, you can select the style of the gauge you want to add. Angular gauges are the most widely used gauge styles as they fulfill most of the requirements, but linear gauges do have their own benefits over angular gauges. Linear gauges are very useful in the context of responsive applications, as they don’t need much space when compared to the angular gauges. For example, for a mobile application that runs mostly on a smartphone, it would be nice to have a vertical linear gauge instead of a large angular gauge.

As of Rollbase v4.5, along with the angular gauges, Rollbase supports linear gauges as well. You can add horizontal and vertical gauges in your Rollbase application. These are Fusion widgets. Rollbase introduced these widgets as the built-in gauges. These are no-code gauges. You only need to select the gauge style, give the labels and values and you are all set to add these linear gauges in your Rollbase application. Please find more details on how to add Fusion gauges in your application.

Horizontal Linear Gauge

A horizontal linear gauge can display the same level of information that angular gauges do. The benefit of using this gauge is to save a good amount of space on your application page as it does not need much height to fit in. A horizontal linear gauge uses a data pointer on a horizontal scale to show the data value. There are tick marks to show the different data range values. You can also customize the colors for each data range from the gauge edit page. A simple horizontal linear gauge looks like this:


Vertical Linear Gauge

As I already mentioned earlier, vertical linear gauges come handy in the cases where space is a constraint and other angular gauges cannot be used. The data value is displayed as a plot fill like a vertical bar in the below gauge. Other than the data range colors, for vertical linear gauge, you can also specify the color for the data value plot.

                                              Vertical linear gauge

Other than using linear gauges in the context of responsive applications or mobile applications, there are a few other usages as well. For example, to show the temperature level or the volume level, it would be nice to represent this data by using linear gauges and not the angular ones.

You can also write your own custom script to create Fusion gauges and charts for dashboards and portal pages. Please see this blog on how to create your own custom Fusion widgets in Rollbase. FusionCharts supports many gauge styles and gives you an opportunity to create your gauge by using appropriate properties and attributes supported for your gauge styles.

Save Space with Horizontal and Vertical Gauges

In conclusion, you can now add any of the angular, vertical or horizontal gauges to your Rollbase application. This will allow to utilize the screen size available to you. For example, while creating an application for desktop or large screen size devices, you can use any of these gauges—but for mobile devices like smartphones, it would be good to use vertical gauges as they can save a good amount of space.

Curious to give it a shot? Try Rollbase today for free.


Mayank Kumar

Mayank Kumar is a Software Engineer at Progress, specializing in low-code platforms. In the past, he worked on improving Multilingual and RTL support in Rollbase and is currently working on Rollbase UI.


Comments are disabled in preview mode.

Sitefinity Training and Certification Now Available.

Let our experts teach you how to use Sitefinity's best-in-class features to deliver compelling digital experiences.

Learn More
Latest Stories
in Your Inbox

Subscribe to get all the news, info and tutorials you need to build better business apps and sites

Loading animation