topic Dashboard Studio : Representing Row in Colors as per the value in Dashboards & Visualizations

Dashboard Studio : Representing Row in Colors as per the value

Sishad — Wed, 29 May 2024 08:52:34 GMT

Hi Splunk experts,

I have made a dashboard which show my App's service status in Dashboard Studio and I want to display color based on value as show below.
This was achieved in Dashboard classic by editing the source and appending the format as below.

</format> <format type="color" field="Requester"> <colorPalette type="expression">case (match(value,"DOWN"), "#E34234",match(value,"NA"), "#F8BE34",match(value,"UP"),"#4F7942")</colorPalette> <format type="color" field="Stripping"> <colorPalette type="expression">case (match(value,"DOWN"), "#E34234",match(value,"NA"), "#F8BE34",match(value,"UP"),"#4F7942")</colorPalette> </format>

Can the same be achieved in Dashboard studio as well ? If so how it can be done.

Can you guys please help me out on this.TIA

Re: Dashboard Studio : Representing Row in Colors as per the value

ITWhisperer — Wed, 29 May 2024 10:25:06 GMT

Try something like this

"options": { "columnFormat": { "Requester": { "rowBackgroundColors": "> table | seriesByName(\"Requester\") | matchValue(requesterColumnFormatConfig)" } } }, "context": { "requesterColumnFormatConfig": [ { "match": "DOWN", "value": "#FF0000" }, { "match": "UP", "value": "#00FF00" } ] }

Re: Dashboard Studio : Representing Row in Colors as per the value

Sishad — Thu, 30 May 2024 14:29:56 GMT

No luck as it throws an error saying "must NOT have additional properties" in JSON.

Re: Dashboard Studio : Representing Row in Colors as per the value

ITWhisperer — Thu, 30 May 2024 15:35:57 GMT

It looks like you didn't read what I had suggested properly as you have missed the "options" key

Re: Dashboard Studio : Representing Row in Colors as per the value

Sishad — Thu, 30 May 2024 16:10:16 GMT

Yes I have added it. Please find below the complete source code.

{ "type": "ds.search", "options": { "query": "index = index host=hostname source=\"/var/log/history-*.log\" servername | table Websphere GUI \n| eval Websphere=if(Websphere=\"0\",\"UP\",\"DOWN\")\n| eval GUI=if(GUI=\"0\",\"UP\",\"DOWN\")", "queryParameters": { "earliest": "-10m@m", "latest": "now" }, "refresh": "10m", "refreshType": "delay" }, "options": { "columnFormat": { "Websphere": { "rowBackgroundColors": "> table | seriesByName(\"Websphere\") | matchValue(WebsphereColumnFormatConfig)" } } }, "context": { "WebsphereColumnFormatConfig": [ { "match": "DOWN", "value": "#FF0000" }, { "match": "UP", "value": "#00FF00" }, ] } "name": "DC Web Server _ search" }

Re: Dashboard Studio : Representing Row in Colors as per the value

ITWhisperer — Thu, 30 May 2024 16:40:06 GMT

{ "visualizations": { "viz_yxqQUaLH": { "type": "splunk.table", "options": { "columnFormat": { "Websphere": { "rowBackgroundColors": "> table | seriesByName(\"Websphere\") | matchValue(nameColumnFormatConfig)" }, "GUI": { "rowBackgroundColors": "> table | seriesByName(\"GUI\") | matchValue(nameColumnFormatConfig)" } }, "backgroundColor": "transparent", "tableFormat": { "rowBackgroundColors": "> table | seriesByIndex(0) | pick(tableRowBackgroundColorsByBackgroundColor)", "headerBackgroundColor": "> backgroundColor | setColorChannel(tableHeaderBackgroundColorConfig)", "rowColors": "> rowBackgroundColors | maxContrast(tableRowColorMaxContrast)", "headerColor": "> headerBackgroundColor | maxContrast(tableRowColorMaxContrast)" } }, "dataSources": { "primary": "ds_1ZOKlMox" }, "context": { "nameColumnFormatConfig": [ { "match": "DOWN", "value": "#FF0000" }, { "match": "UP", "value": "#00FF00" } ] } } }, "dataSources": { "ds_1ZOKlMox": { "type": "ds.search", "options": { "query": "| makeresults\n| eval Websphere=mvindex(split(\"DOWN,UP\",\",\"),random()%2)\n| eval GUI=mvindex(split(\"DOWN,UP\",\",\"),random()%2)\n| table Websphere GUI", "queryParameters": { "earliest": "-24h@h", "latest": "now" } }, "name": "Search_2" } }, "defaults": { "dataSources": { "ds.search": { "options": { "queryParameters": { "latest": "$global_time.latest$", "earliest": "$global_time.earliest$" } } } } }, "inputs": {}, "layout": { "type": "absolute", "options": { "width": 1440, "height": 960, "display": "auto" }, "structure": [ { "item": "viz_yxqQUaLH", "type": "block", "position": { "x": 20, "y": 20, "w": 480, "h": 230 } } ], "globalInputs": [] }, "description": "", "title": "Webstatus" }