Skip to content
Home » Dashboard Widgets: How to add Number, Chart, Gauge and Calendar

Dashboard Widgets: How to add Number, Chart, Gauge and Calendar

Dashboard Widgets: How to add Number, Chart, Guage and Calendar

The Dashboard uses Widgets to add visual elements to the canvas. Each widget serves a distinct purpose, offering a unique way to visualize data, such as charts, graphs, tables, and indicators. Let’s elaborate the process of using some key widgets in this article, while Text, List, Progress and Number (Comparison) are here.

Numbers are everywhere in an application. However only the right number portrays the exact state of affairs. To add a Number Widget:

On the Widgets panel, click the Number widget.

Widgets List

The Number widget panel is displayed. Here we can provide the required information to generate the corresponding visual element on the Dashboard Canvas.

Widget Panel

Start by adding a title.

Add Title

Select the relevant object and list.

Select relevant Object & List

Select the number property, that would be represented on the canvas.

Select property

Select the relevant function, (Count in our case).

Select Function

Click the Save button.

Click Save button

The Number Widget has added the corresponding element on the Dashboard Canvas. Close the Number Widget panel.

Close Widget panel

Using the Dashboard canvas, we can easily determine the number of active projects in the application (as per our example).

Chart

Charts are the most widely used visual aid to comprehend large amounts of data. Charts bring clarity, efficiency, and impact to the dashboard, making them indispensable tools for data-driven analysis and reporting. The benefits of using charts in a dashboard include:

    • Simplified Data Interpretation
    • Quick Decision-Making
    • Enhanced Comparisons
    • Improved Engagement
    • Facilitates Communication etc. 

To add a Chart Widget click the Chart widget.

Click Chart widget

Give a suitable title.

Give suitable title

Select the source object.

Select object

Select the desired chart type.

Select chart type

Select the desired Grouping Property.

Select Grouping Property

Select the desired Grouping Duration.

Select Grouping Duration

Select the desired Aggregate Type.

Select the Aggregate Type.

Select the desired Aggregate Property.

Select Aggregate Property

Click the Save button.

Click Save button

Click the close button.

Close

Using the example we used here, at one glance, we can tell how many projects were completed in each quarter of the year. Which quarter was the most productive one? etc.

Chart Element on canvas

Gauge

The Gauge Widget is used to present a sum of numerical data in a visually appealing way. This widget helps in monitoring and visualizing key performance metrics. To add a Gauge Widget:

Click the Gauge Widget.

Click Gauge widget

Give a suitable title.

Give a title

Select the Source Object.

Select Source Object

Select the desired Source List. In the absence of a source list, the default value is automatically selected. In that case, users can skip this step.

Select Source List

Select the Source Property.

Select Source Property

Provide the Minimum and Maximum values.

Provide Minimum and Maximum values

Click the + Add Condition link.

Click + Add Condition link

The Conditions are added for color-coding the relevant range of the gauge.

color-coding the relevant range

Click the Save button.

Click Save button

Click the close button.

Click close button

Using the example we created, we can instantly know the cumulative budget amount of all the projects.

Calendar

This widget is used to display a Calendar view of the display list. Using a calendar widget in a dashboard offers several practical benefits, particularly for managing and visualizing time-related data. Here are the key advantages:

    • Streamlined Scheduling
    • Improved Time Management
    • Clear Visibility of Dates
    • Integration with Data
    • Increased Productivity

To add the Calendar Widget click the relevant option in the panel.

Click Calendar widget

Give a suitable title.

Give suitable title

Select the Source Object.

Select Source Object

Click the Save button.

Click Save button

Click the close button.

Click close button

Using the given example, we can easily watch the complete week schedule/deadlines.