Setup A Toggle Widget with Bindings

The issue is that you might have two charts that say almost the same thing but with different measures on them. Instead of wasting all that precious real estate, let's throw a toggle widget on just one chart and go back and forth between the two measures with a simple click of a button!!

Final Screenshot

STep1: Create a Static Step in the UI

step2: go to the step associated with your chart widget

Follow the format in the yellow section below. This will substitute the selected measure in the toggle widget using “Bindings” (Also, don't forget to delete any columnMap section under visualizationParameters or you will be troubleshooting this until you're 150 years old!!). 

            "top_oppties_1": {
                "type": "aggregateflex",
                "query": {
                    "measures": [
                        [
                            "sum",
                            "{{cell(TopOppties_Toggle_1.selection, 0, \"value\").asString()}}"
                        ]
                    ],
                    "filters": [],
                    "order": [
                        [
                            -1,
                            {
                                "ascending": false
                            }
                        ]
                    ],
                    "groups": [
                        "Opportunity.Name"
                    ]
                },
                "visualizationParameters": {
                    "options": {},
                    "type": "chart",
                    "parameters": {
                        "visualizationType": "hbar",
                        "autoFitMode": "keepLabels",
                        "theme": "wave",
                        "title": {
                            "label": "",
                            "fontSize": 14,
                            "subtitleLabel": "",
                            "subtitleFontSize": 11,
                            "align": "center"
                        },
                        "showValues": true,
                        "axisMode": "multi",
                        "binValues": false,
                        "bins": {
                            "breakpoints": {
                                "low": 0,
                                "high": 100
                            },
                            "bands": {
                                "low": {
                                    "label": "",
                                    "color": "#B22222"
                                },
                                "medium": {
                                    "label": "",
                                    "color": "#ffa500"
                                },
                                "high": {
                                    "label": "",
                                    "color": "#008000"
                                }
                            }
                        },
                        "dimensionAxis": {
                            "showAxis": true,
                            "showTitle": true,
                            "title": "",
                            "customSize": "auto",
                            "icons": {
                                "useIcons": false,
                                "iconProps": {
                                    "column": "",
                                    "fit": "cover",
                                    "type": "round"
                                }
                            }
                        },
                        "measureAxis1": {
                            "sqrtScale": false,
                            "showAxis": true,
                            "customDomain": {
                                "showDomain": false
                            },
                            "showTitle": true,
                            "title": ""
                        },
                        "measureAxis2": {
                            "sqrtScale": false,
                            "showAxis": true,
                            "customDomain": {
                                "showDomain": false
                            },
                            "showTitle": true,
                            "title": ""
                        },
                        "legend": {
                            "show": true,
                            "showHeader": true,
                            "inside": false,
                            "position": "right-top",
                            "customSize": "auto"
                        },
                        "tooltip": {
                            "customizeTooltip": false,
                            "showDimensions": true,
                            "dimensions": "",
                            "showMeasures": true,
                            "measures": "",
                            "showPercentage": true,
                            "showBinLabel": true
                        },
                        "trellis": {
                            "enable": false,
                            "showGridLines": true,
                            "flipLabels": false,
                            "type": "x",
                            "chartsPerLine": 4,
                            "size": [
                                100,
                                100
                            ]
                        },

                    }
                },
                "datasets": [
                    {
                        "id": "0Fb0v000000CaWXCA0",
                        "label": "Oppty Products",
                        "name": "opportunity_products2",
                        "url": "/services/data/v42.0/wave/datasets/0Fb0v000000CaWXCA0"
                    }
                ],
                "useGlobal": true,
                "isGlobal": false,
                "label": "top_oppties",
                "broadcastFacet": true,
                "receiveFacet": true,
                "selectMode": "single"
            },

Leave a Reply

Your email address will not be published. Required fields are marked *