Average

✅ Calculate the mean value of a set of numbers.

This Average widget shows the average number (mean) of a field/column. It respects filters/searches and updates itself accordingly.

Configure the Average Widget

When configuring an Average widget from the UI, you can specify the following settings.

OptionsDetails
typeThe type, always average.
titleThe title of the widget to show.
filterA Clevero filter array. Use this to filter results from both primaryFilter and secondaryFilter.
fieldThe internal ID of the field on this record to perform the average calculation over.
prefixText to display before the number.
suffixText to display after the number.
decimalWhether or not to use decimal places. If false or not set, the value will be rounded to the nearest integer.
decimalPlacesThe minimum and maximum number of decimal places to show.
numberFormatIt formats the output number to have commas. By default, it is en-US, but you can also have values like en-AU, de-DE, en-IN, etc.
primaryFilterA Clevero filter array. Use this to filter results for primary values of the widget.
secondaryFilterA Clevero filter array. Use this to filter results for secondary values of the widget.
defaultStyle
  • icon: The font awesome icon to use.
  • color: The colour to render the icon.
  • textColor: The colour to render the count number. If omitted, the count is black.
  • labelColor: The colour to render the label. If omitted, the count is black.
  • labelSize: The font size to render the label.
  • labelWeight: The font-weight to render the label.
  • labelOrientation: The orientation of the label associated with the element. Such as top, bottom, left, and right.
  • labelAlign: The alignment of the label relative to the element. Such as top, bottom, left, right, and center.
secondaryValueDisplayThe primary and secondary values or calculations are based on these values.

JSON Example

The following JSON produces the same configuration shown in the UI.

{
    "widgets": [
        {
            "type": "average",
            "title": "Average hours worked",
            "config": {
                "field": "duration",
                "decimal": true,
                "decimalPlaces": {
                    "min": 0,
                    "max": 2
                },
                "prefix": "",
                "suffix": "hours",
                "numberFormat": "default",
                "primaryFilter": [
                    {
                        "subject": "date",
                        "requestType": "i",
                        "type": "date",
                        "operator": "on_or_after",
                        "value": {
                            "relative": true,
                            "type": "minus_years",
                            "value": 1
                        }
                    }
                ],
                "secondaryFilter": [
                    {
                        "subject": "date",
                        "requestType": "i",
                        "type": "date",
                        "operator": "within",
                        "value": {
                            "from": {
                                "relative": true,
                                "type": "minus_years",
                                "value": 2
                            },
                            "to": {
                                "relative": true,
                                "type": "minus_years",
                                "value": 1
                            }
                        }
                    }
                ],
                "secondaryValueDisplay": "function({primaryValue, secondaryValue}){const number = (primaryValue- secondaryValue); return {value: `Up by ${number}`, color: 'red', icon: 'fa-duotone fa-bullseye-arrow'}}"
            }
        }
    ]
}

📌 Need Help?

If you require assistance or encounter any issues, please don't hesitate to contact us for further support.



Did this page help you?