Dashboards & Visualizations

Is there a way to create line break in Status Indicator visualization?

pvarelab
Path Finder

Is there a way to create a line break in the label for the Status Indicator visualization.

 

I have the following dashboard:

<dashboard version="1.1">
<label>Test dashboard</label>
<row>
<panel>
<viz type="status_indicator_app.status_indicator">
<search>
<query>| makeresults
| eval partialA=15, totalA=57, partialB=132, totalB=543
| strcat partialA "/" totalA "V in " partialB "/" totalB "H" label
| eval icon=if(totalA=0,"check","warning")
| eval color=if(totalA=0,"green",if(partialA=0,"orange","red"))
| fields label icon color</query>
<earliest>-30d@d</earliest>
<latest>now</latest>
<sampleRatio>1</sampleRatio>
</search>
<option name="drilldown">none</option>
<option name="refresh.display">progressbar</option>
<option name="status_indicator_app.status_indicator.colorBy">field_value</option>
<option name="status_indicator_app.status_indicator.fillTarget">text</option>
<option name="status_indicator_app.status_indicator.fixIcon">warning</option>
<option name="status_indicator_app.status_indicator.icon">field_value</option>
<option name="status_indicator_app.status_indicator.precision">0</option>
<option name="status_indicator_app.status_indicator.showOption">1</option>
<option name="status_indicator_app.status_indicator.staticColor">#555</option>
<option name="status_indicator_app.status_indicator.useColors">true</option>
<option name="status_indicator_app.status_indicator.useThousandSeparator">true</option>
</viz>
</panel>
</row>
</dashboard>

That displays

15/57V in 132/543H

I would like it to display

15/57V
in
132/543H

I have tried using \n, <br/> and escaped versions of those to no avail.

Is there a way to do what Iwant?

Thanks!

Labels (1)
0 Karma
1 Solution

pvarelab
Path Finder

To summarize, the solution was a combination of @richgalloway 's proposal of including the line returns in the query:

| strcat partialA "/" totalA "V 
in 
" partialB "/" totalB "H" label

plus some CSS in a row before the row containing the panels:

<html>
<style>
.splunk-status-indicator {
white-space: pre;
line-height: 100% !important;
font-size: 2.5vw !important;
}
</style>
</html>

 

View solution in original post

pvarelab
Path Finder

To summarize, the solution was a combination of @richgalloway 's proposal of including the line returns in the query:

| strcat partialA "/" totalA "V 
in 
" partialB "/" totalB "H" label

plus some CSS in a row before the row containing the panels:

<html>
<style>
.splunk-status-indicator {
white-space: pre;
line-height: 100% !important;
font-size: 2.5vw !important;
}
</style>
</html>

 

richgalloway
SplunkTrust
SplunkTrust

Try embedding literal newlines in the command.

| strcat partialA "/" totalA "V 
in 
" partialB "/" totalB "H" label
---
If this reply helps you, Karma would be appreciated.

pvarelab
Path Finder

Thanks, Rich:

I also had tried that, which had worked for me in other situations, but not in this one.

 

0 Karma

richgalloway
SplunkTrust
SplunkTrust

Have you tried the same thing using eval?

| eval label = partialA . "/" . totalA . "V 
in 
" . partialB . "/" . totalB . "H" 

 

---
If this reply helps you, Karma would be appreciated.

pvarelab
Path Finder

Hi, Rich:

At the end your original solution worked but combined with a little CSS "magic". I had to add the following snippet to the xml:

 <html>
<style>
.splunk-status-indicator {
white-space: pre;
line-height: 100% !important;
font-size: 2.5vw !important;
}
</style>
0 Karma
Get Updates on the Splunk Community!

Index This | I am a number, but when you add ‘G’ to me, I go away. What number am I?

March 2024 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with another ...

What’s New in Splunk App for PCI Compliance 5.3.1?

The Splunk App for PCI Compliance allows customers to extend the power of their existing Splunk solution with ...

Extending Observability Content to Splunk Cloud

Register to join us !   In this Extending Observability Content to Splunk Cloud Tech Talk, you'll see how to ...