Dashboards & Visualizations

Conditional formatting for column chart in dashboard studio

Racer73b
Explorer

Hi All,

I'm having trouble getting conditional formatting to work for a column chart in dashboard studio.   I want something pretty simple... I want the column "ImpactLevel" to be colored red if the value is less than 50, orange if the value is between 50 and 80, and yellow if the value is more than 80.  Impact level is the only series on the y2 axis of the column chart.

Here is the json for my chart:

"type": "splunk.column",
    "options": {
        "y": "> primary | frameBySeriesNames('_lower','_predicted','_upper','avg','max','min','volume','ImpactLevel')",
        "y2": "> primary | frameBySeriesNames('ImpactLevel')",
        "y2AxisMax": 100,
        "overlayFields": [
            "volume"
        ],
        "legendDisplay": "bottom",
        "seriesColorsByField": {
            "ImpactLevel": [
                {
                    "value": "#dc4e41",
                    "to": 50
                },
                {
                    "value": "#f1813f",
                    "from": 50,
                    "to": 80
                },
                {
                    "value": "#f8be44",
                    "from": 80
                }
            ]
        }
    },
    "dataSources": {
        "primary": "ds_9sBnwPWM_ds_stihSmPw"
    },
    "title": "HP+ Claims E2E",
    "showProgressBar": true,
    "eventHandlers": [
        {
            "type": "drilldown.linkToDashboard",
            "options": {
                "app": "sre",
                "dashboard": "noc_priority_dashboard_regclaimdrilldown",
                "newTab": true,
                "tokens": [
                    {
                        "token": "time.latest",
                        "value": "$time.latest$"
                    },
                    {
                        "token": "time.earliest",
                        "value": "$time.earliest$"
                    },
                    {
                        "token": "span",
                        "value": "$span$"
                    }
                ]
            }
        }
    ],
    "showLastUpdated": false,
    "context": {}
Labels (2)
0 Karma

pewaubek_reid
Explorer

Hey @Racer73b !

Found this one pretty frustrating myself.  There's lots of prior posts on the topic and I was able to eventually figure it out.

You need to first create unique fields for your value thresholds in your search.  See below example:

| makeresults
| eval ImpactLevel="45,55,85"
| makemv delim="," ImpactLevel
| mvexpand ImpactLevel
| eval "Low Impact"=if('ImpactLevel'<50,'ImpactLevel',null())
| eval "Medium Impact"=if('ImpactLevel'>49 AND 'ImpactLevel'<80,'ImpactLevel',null())
| eval "High Impact"=if('ImpactLevel'>79,'ImpactLevel',null())
| fields - ImpactLevel

pewaubek_reid_0-1740588920128.png

Then, in your json, make those the fields you want to assign colors to and ensure that stackmode is set to stacked to ignore the nulls.

...

"y": "> primary | frameBySeriesNames('Low Impact','Medium Impact','High Impact')",
"seriesColorsByField": {
"Low Impact": "#73BB8B",
"Medium Impact": "#F1A657",
"High Impact": "#dc4e41"
},
"stackMode": "stacked"
...

You will likely have to a little bit of tweaking to get it working the way you want but hopefully this gets you on your way.
 
Cheers!
Get Updates on the Splunk Community!

Community Content Calendar, November Edition

Welcome to the November edition of our Community Spotlight! Each month, we dive into the Splunk Community to ...

October Community Champions: A Shoutout to Our Contributors!

As October comes to a close, we want to take a moment to celebrate the people who make the Splunk Community ...

Stay Connected: Your Guide to November Tech Talks, Office Hours, and Webinars!

What are Community Office Hours? Community Office Hours is an interactive 60-minute Zoom series where ...