Splunk Search

How to customize the view of the values a particular field, in table visualization?

sarvesh_11
Communicator

Hello Splunkers,

I have used unicode characters, to display trend, in my splunk dashboard. BUt the size of those characters are to small to be presented in dashboard.

Is there a way to increase size or to color those icons?

 

sarvesh_11_0-1618815726494.png

 

Labels (1)
0 Karma
1 Solution

ITWhisperer
Ultra Champion

Try it this way

| eval Trend=if(Trend > 0,mvappend("⬆","",""),if(Trend <0,mvappend("","","⬇"),mvappend("","➡","")))
<html>
<div/>
<style>

div[id^="table1"] td:nth-child(2)  {
font-size: 150% !important;
color: blue !important;
}
div[id^="table1"] td:nth-child(2) div.multivalue-subcell[data-mv-index="0"] {
font-size: 150% !important;
color: red !important;
}
div[id^="table1"] td:nth-child(2) div.multivalue-subcell[data-mv-index="1"] {
font-size: 150% !important;
color: yellow !important;
}
div[id^="table1"] td:nth-child(2) div.multivalue-subcell[data-mv-index="2"] {
font-size: 150% !important;
color: green !important;
}
</style>
</html>

View solution in original post

0 Karma

ITWhisperer
Ultra Champion

You can use CSS to override font size and colour

0 Karma

sarvesh_11
Communicator

that will be implemented to complete table.

0 Karma

ITWhisperer
Ultra Champion

Does this mean the issue is resolved or do you still need some assistance?

0 Karma

sarvesh_11
Communicator

i am asking how to customize the view of values a particular column in table.

0 Karma

ITWhisperer
Ultra Champion

In your dashboard source, give your table an id and add a "hidden" panel with some CSS in a html block

    <panel depends="$stayhidden$">
      <html>
        <div/>
        <style>
          div[id^="tableColumnBigFont"] td:nth-child(2) {
            font-size: 150% !important;
            color: blue !important;
          }
        </style>
      </html>
    </panel>
    <panel>
      <table id="tableColumnBigFont">

sarvesh_11
Communicator

Thanks mate @ITWhisperer ,

it worked.

Just last thing, can we have color segregation, like upward arrow to be of green color, downward red color, likewise?

Since these arrows won't be static, so can't assign color with cell cordinates.

0 Karma

ITWhisperer
Ultra Champion

You could evaluate the field and split it into two (or more) multi-values, then apply different styles to each multi-value-index

     <panel depends="$stayhidden$">
      <html>
        <div/>
        <style>
          div[id^="tableColumnBigFont"] td:nth-child(2) div.multivalue-subcell[data-mv-index="0"] {
            font-size: 150% !important;
            color: red !important;
          }
          div[id^="tableColumnBigFont"] td:nth-child(2) div.multivalue-subcell[data-mv-index="1"] {
            font-size: 150% !important;
            color: yellow !important;
          }
          div[id^="tableColumnBigFont"] td:nth-child(2) div.multivalue-subcell[data-mv-index="2"] {
            font-size: 150% !important;
            color: green !important;
          }
        </style>
      </html>
    </panel>
    <panel>
      <table id="tableColumnBigFont">

Then in your search 

| eval Trend=if(Trend&lt;0,mvappend(Trend,"",""),if(Trend&gt;0,mvappend("","",Trend),mvappend("",Trend,"")))
0 Karma

sarvesh_11
Communicator

Tried mvappend, its not working, below is my code:

| eval Trend=case(Trend="0.00","rightward",Trend > 0,"upward",Trend < 0,"downward",1=1,Trend)
| eval Trend=case(Trend=="upward","⬆",Trend=="downward","⬇",Trend=="rightward","➡",1=1,"N/A")
| eval Trend=if(Trend > "⬆",mvappend(Trend,"",""),if(Trend <"⬇",mvappend("","",Trend),if(Trend=="➡",mvappend("","",Trend),mvappend("",Trend,""))))

 

<html>
<div/>
<style>

div[id^="table1"] td:nth-child(2)  {
font-size: 150% !important;
color: blue !important;
}
div[id^="table1"] td:nth-child(2) div.multivalue-subcell[data-mv-index="⬇"] {
font-size: 150% !important;
color: red !important;
}
div[id^="table1"] td:nth-child(2) div.multivalue-subcell[data-mv-index="➡"] {
font-size: 150% !important;
color: yellow !important;
}
div[id^="table1"] td:nth-child(2) div.multivalue-subcell[data-mv-index="⬆"] {
font-size: 150% !important;
color: green !important;
}
</style>
</html>

0 Karma

ITWhisperer
Ultra Champion

Try it this way

| eval Trend=if(Trend > 0,mvappend("⬆","",""),if(Trend <0,mvappend("","","⬇"),mvappend("","➡","")))
<html>
<div/>
<style>

div[id^="table1"] td:nth-child(2)  {
font-size: 150% !important;
color: blue !important;
}
div[id^="table1"] td:nth-child(2) div.multivalue-subcell[data-mv-index="0"] {
font-size: 150% !important;
color: red !important;
}
div[id^="table1"] td:nth-child(2) div.multivalue-subcell[data-mv-index="1"] {
font-size: 150% !important;
color: yellow !important;
}
div[id^="table1"] td:nth-child(2) div.multivalue-subcell[data-mv-index="2"] {
font-size: 150% !important;
color: green !important;
}
</style>
</html>

View solution in original post

0 Karma

sarvesh_11
Communicator

Thanks @ITWhisperer alot for all your help, it worked 🙂

0 Karma
.conf21 CFS Extended through 5/20!

Don't miss your chance
to share your Splunk
wisdom in-person or
virtually at .conf21!

Call for Speakers has
been extended through
Thursday, 5/20!