Infinity dashboard part – 1

BINDINGS

Customizing what a dashboard can display

Many years ago, we told a client that we could deliver a dashboard at twice the speed of another consultancy. These were the premier Analytics developers in the market at the time. We reviewed the work they delivered, of which they billed 40+ hours. After a brief overview, committed to do it in 20. We signed the deal on a Friday and Monday the MVP dashboard was delivered. 14 billable hours spent, we then had some spare time to explore opportunities. We quickly sent the link over to the client, and stated that we would be leveraging some extra time to review opportunities to improve.

The outcome of this series is on the findings we developed during those 6 hours.

Today the client has nearly doubled in size, their executives login into analytics and no other systems for all strategic meetings and to take actions.

Bindings, allow us to leverage end users to change questions sent to the server.

Ultimately, bindings allow us to change what and how the user actually reviews data. Following these steps, completely non-technical users will be able to click a button, and change whether a chart is shows the breakdown by Segment, Opportunities Stage, Account Executive, Closing Month, or any combination thereof. They will also be able to change numbers they are plotting, chart markers, and even chart types. The possibilities and permutations are nearly endless.

1. Create and insert Static Step(s)
Press CTRL/CMD + E and paste the following into the steps array.

"CustomStackedGroupin_1": {
    "broadcastFacet": true,
    "label": "CustomStackedGrouping",
    "selectMode": "single",
    "start": {
        "display": [
            "Segment"
        ]
    },
    "type": "staticflex",
    "values": [
        {
            "display": "Segment",
            "value": "Segment"
        },
        {
            "display": "Industry",
            "value": "Industry"
        },
        {
            "display": "Owner",
            "value": "Opportunity_Owner"
        },
        {
            "display": "Stage Name",
            "value": "StageName"
        }
    ]
},
"CustomMeasurement": {
    "broadcastFacet": true,
    "label": "MEASUREMENT",
    "selectMode": "single",
    "start": {
        "display": [
            "Amount"
        ]
    },
    "type": "staticflex",
    "values": [
        {
            "display": "Amount",
            "value": "Amount"
        },
        {
            "display": "Quantity",
            "value": "Quantity"
        }
    ]
}

This step can be done in a declarative manor. However, showing the code here is valuable to understand how it will work behind the scenes for future posts. To create the above without seeing any JSON — see here

Chart JSON — Snippet setup to reference the step.

2. Create a Chart

In your dashboard → Select “Create Step” → select any “Opportunity” dataset you have → Group it by “Segment” (or field of preference) and make “Sum of Amount” to the Measure→ drag it into your dashboard to generate the chart → Press CTRL/CMD + E to get into your dashboards JSON → use CTRL/CMD + F to search and find the step you created →Edit the value in the “measures array” →And also update the one in the “groups” array.

In groups → replace [ “Segment” ] with “{{column(CustomStackedGroupin_1.selection,[\”value\”]).asObject()}}”

This will allow the users to change the grouping of the chart, meaning the can now see the chart by Segment, Industry, Owner, or Stage. Later we will show you how we can even stack selections one atop the other.

In measures → replace [“sum” , “Amount”] with [“sum”,”{{cell(CustomMeasurement.selection,0,\”value\”).asString()}}”]

This will allow the users to Toggle between the “Amount” and “Quantity”, plot points on the dashboard.

"Chart_1": {
                "broadcastFacet": true,
                "datasets": [
                    {
                        "id": "0Fb1U000000TNWsSAO",
                        "label": "Opportunity",
                        "name": "Opportunity_Sample_Set",
                        "url": "/services/data/v45.0/wave/datasets/0Fb1U000000TNWsSAO"
                    }
                ],
                "isGlobal": false,
                "label": "InfinityChart",
                "query": {
                    "measures": [
                        [
                            "sum",
                            "{{cell(CustomMeasurement.selection,0,\"value\").asString()}}"
                        ]
                    ],
                    "groups": "{{column(CustomStackedGroupin_1.selection,[\"value\"]).asObject()}}"
                }

You should have something similar to the dashboard below.

Image for post

Sample Code all together here. Just copy and paste this to to see it running ( *Note — must input your own dataset id and name information)

Scroll to Top