How to show data in dashboard

Question

I have a dashboard, which shows the total count of four containers. for this, I'm having four aggregates which return totalcount and the label as shown below

and in the dashboard, showing up the four data as below

and for each expression value i'm using GetLarvaeDetails.List.Current.CountSum, GetPupaeDetails.List.Current.CountSum...

My question is, I'm making four query calls and rendering it in the dashboard. Is there a way to make one query call which returns a single table with all data and render it via looping like we do in angular ngFor?

Update#1: I have created a aggregate as shown below and now it returns as a table. How to render it on the dashboard page?

Update#2:

So here if I use the expression value as GetContainerReport.List.Current.CountSum, it's not working. How to show only the particular count?

Answer 1

You can use the List widget with a List Item widget inside. Then you add the CSS below.

.list .list-item {
    float: left;
}

It will generate this result:

You can add more properties to the list returned from the aggregate (i.e.: color, icon name) and CSS to make each item look like you need them to look