Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

The indicators have a different format object. We want to format the metric as a percentage with fraction of 1. We also used a different distribution - uniform.

Add these 4 object objects using addMetadata.

Extend the dashboard similar to what we've done earlier. We will use the blockRow object, again but we'll set the layout of these indicator to secondary. This means they will appear smaller on the dashboard.

...

Code Block
titleUpdated Business overview dashboard
collapsetrue
{
    "id": "ltvoi2nghm4dt4jr",
    "name": "business_overview_dashboard",
    "type": "dashboard",
    "content": {
        "blockRows": [
            {
                "type": "indicator",
                "indicator": "/rest/projects/$projectId/md/indicators?name=turnover_indicator",
                "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                "layout": "primary"
            },
            {
                "type": "blockRow",
                "blocks": [
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=online_turnover_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "primary"
                    },
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=offline_turnover_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "primary"
                    }
                ]
            },
            {
                "type": "blockRow",
                "blocks": [
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=online_ratio_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "secondary"
                    },
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=offline_ratio_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "secondary"
                    }
                ]
            },
            {
                "type": "indicator",
                "indicator": "/rest/projects/$projectId/md/indicators?name=customers_indicator",
                "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                "layout": "primary"
            }
        ]
    },
    "accessInfo": {
        "createdAt": "2020-06-25T12:58:05Z",
        "modifiedAt": "2020-06-29T06:14:41Z",
        "createdBy": "/rest/accounts/00ubfu7fdyIoFKxXm0h7",
        "modifiedBy": "/rest/accounts/00ubfu7fdyIoFKxXm0h7"
    },
    "links": [
        {
            "rel": "self",
            "href": "/rest/projects/k5t8mf2a80tay2ng/md/dashboards/ltvoi2nghm4dt4jr"
        }
    ]
}

Use Use pushProject to update the dashboard.

Indicator group

...

There's no new syntax in case of transactions_indicator and transactions_metric objects. The transactions_per_customer_metric is a simple fraction. And in average_transaction_metric, we use a new function - function_avg.

Add these 6 objects using addMetadata.

What's important is the dashboard syntax update. We will add a the indicatorGroup object containing these three indicators to the blockRows array.

...

Code Block
titleUpdated Business overview dashboard
collapsetrue
{
    "id": "ltvoi2nghm4dt4jr",
    "name": "business_overview_dashboard",
    "type": "dashboard",
    "content": {
        "blockRows": [
            {
                "type": "indicator",
                "indicator": "/rest/projects/$projectId/md/indicators?name=turnover_indicator",
                "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                "layout": "primary"
            },
            {
                "type": "blockRow",
                "blocks": [
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=online_turnover_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "primary"
                    },
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=offline_turnover_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "primary"
                    }
                ]
            },
            {
                "type": "blockRow",
                "blocks": [
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=online_ratio_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "secondary"
                    },
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=offline_ratio_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "secondary"
                    }
                ]
            },
            {
                "type": "indicatorGroup",
                "title": "Transactions",
                "blockRows": [
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=transactions_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "primary"
                    },
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=transactions_per_customer_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "primary"
                    },
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=average_transaction_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "primary"
                    }
                ]
            },
            {
                "type": "indicator",
                "indicator": "/rest/projects/$projectId/md/indicators?name=customers_indicator",
                "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                "layout": "primary"
            }
        ]
    },
    "accessInfo": {
        "createdAt": "2020-06-25T12:58:05Z",
        "modifiedAt": "2020-06-29T06:14:41Z",
        "createdBy": "/rest/accounts/00ubfu7fdyIoFKxXm0h7",
        "modifiedBy": "/rest/accounts/00ubfu7fdyIoFKxXm0h7"
    },
    "links": [
        {
            "rel": "self",
            "href": "/rest/projects/k5t8mf2a80tay2ng/md/dashboards/ltvoi2nghm4dt4jr"
        }
    ]
}


Use pushProject to update the dashboard.

Categories block

Now, we'll add categories block on our dashboard. Blocks are parts of the indicator drill object. So, this part of this tutorial is a actually sneak peek to the next part.

...

Code Block
titleUpdated Business overview dashboard
collapsetrue
{
    "id": "ltvoi2nghm4dt4jr",
    "name": "business_overview_dashboard",
    "type": "dashboard",
    "content": {
        "blockRows": [
            {
                "type": "indicator",
                "indicator": "/rest/projects/$projectId/md/indicators?name=turnover_indicator",
                "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                "layout": "primary"
            },
            {
                "type": "blockRow",
                "blocks": [
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=online_turnover_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "primary"
                    },
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=offline_turnover_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "primary"
                    }
                ]
            },
            {
                "type": "blockRow",
                "blocks": [
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=online_ratio_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "secondary"
                    },
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=offline_ratio_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "secondary"
                    }
                ]
            },
            {
                "type": "indicatorGroup",
                "title": "Transactions",
                "blockRows": [
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=transactions_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "primary"
                    },
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=transactions_per_customer_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "primary"
                    },
                    {
                        "type": "indicator",
                        "indicator": "/rest/projects/$projectId/md/indicators?name=average_transaction_indicator",
                        "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                        "layout": "primary"
                    }
                ]
            },
            {
                "type": "indicator",
                "indicator": "/rest/projects/$projectId/md/indicators?name=customers_indicator",
                "indicatorDrill": "/rest/projects/$projectId/md/indicatorDrills?name=empty_indicator_drill",
                "layout": "primary"
            },
            {
                "type": "categories",
                "title": "Number of customers by sex",
                "description": "Number of customers by sex",
                "splitProperty": "customers.sex",
                "indicator": "/rest/projects/$projectId/md/indicators?name=customers_indicator"
            }
        ]
    },
    "accessInfo": {
        "createdAt": "2020-06-25T12:58:05Z",
        "modifiedAt": "2020-06-29T06:14:41Z",
        "createdBy": "/rest/accounts/00ubfu7fdyIoFKxXm0h7",
        "modifiedBy": "/rest/accounts/00ubfu7fdyIoFKxXm0h7"
    },
    "links": [
        {
            "rel": "self",
            "href": "/rest/projects/k5t8mf2a80tay2ng/md/dashboards/ltvoi2nghm4dt4jr"
        }
    ]
}

Use pushProject to update the dashboard.


Info
iconfalse

(tick) That's it! You now have a beautiful dashboard in your project. In the next tutorial, we'll take a look at various ways of filtering the data. 

...