Dashboards & Visualizations

How to change tables cells dynamically without showing the value in the cell?

kajolsharma
Path Finder

I have a panel in which I want to apply 2 colors depending on the threshold something like below. However, I don't want to show the HIGH and LOW values inside the cell. Below is the codepiece that i've referred:

 <panel id="mon2">
      <title>QUALITY MATRIX</title>
      <html>
      <div>
      <div>
      
       <p id="m2">
       <div class="legend" style="float: down;height:30px;width:30px;border-radius:50%;background-color:#FF0000;display: inline-grid;margin-right:40px;font-weight: bolder;text-align: center">1</div>
        </p>
        </div>
      </div>
      </html>
      <table id="master">
        <search>
          <query>index=highjump sourcetype=dbconnectsql source=*MaterialMaster-TotalCount* earliest=@d latest=now() 
| rex field=source "^(?P<site>[^\_]+)" 
| search site="Allentown" 
| dedup _time 
| stats sum(TotalCount) as "Total Material extensions [Today]" 
| appendcols 
    [ search index=highjump sourcetype=dbconnectsql source=*MaterialMaster-ErrorCount* earliest=@d latest=now() 
    | rex field=source "^(?P<site>[^\_]+)" 
    | search site="Allentown" 
    | dedup _time 
    | stats sum(TotalCount) as "Unsuccessful Material Extensions [Today]" 
        ] 
| appendcols 
    [ search index=highjump sourcetype=dbconnectsql source=*MaterialMaster-ErrorCount* earliest=-1y@y latest<@d 
    | dedup _time 
    | rex field=source "^(?P<site>[^\_]+)" 
    | search site="Allentown" 
    | stats sum(TotalCount) as "Unsuccessful Material Extensions [Backlog]"
        ] 
| table "Total Material extensions [Today]", "Unsuccessful Material Extensions [Today]","Unsuccessful Material Extensions [Backlog]" 
| appendpipe 
    [ stats count 
    | where count==0] 
| fillnull value=0 "Unsuccessful Material Extensions [Today]" 
| fillnull value=0 "Total Material extensions [Today]" 
| fillnull value=0 "Unsuccessful Material Extensions [Backlog]" | transpose
| rename "row 1" as "count" 
| eval color =case(count>"0","HIGH",count="0","LOW")  | foreach column [ eval <<FIELD>>=mvappend('<<FIELD>>',color)]
| fields - color| fields - count </query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
        </search>
        <format type="color" field="column">
          <colorPalette type="expression">case (match(value,"LOW"),"#294E70",match(value,"HIGH"),"#D22B2B")</colorPalette>
        </format>
        <!-- <format type="color" field="count">
          <colorPalette type="expression">case (match(value,"LOW"),"#294E70",match(value,"HIGH"),"#D22B2B")</colorPalette>
        </format>-->
        <option name="drilldown">none</option>
        <option name="refresh.display">progressbar</option>
      </table>
      <html>
        <style>
           #mon2{
          width: 25% !important;
          align: center !important;
          text-align: left !important;
          padding: 0px !important;
          margin: 0px 0px 0px 0px !important;
          
          }
           #master .table th, .table td {
            text-align: left !important;
            <!--font-weight: bold !important;-->
            font-size:800% !important;
            color: #FFFFFF !important;
            <!--background-color: #48AAAD !important;-->
            font-family: Arial, Helvetica, sans-serif;
            font-variant: normal;
            font-stretch: expanded;
          }
         
          </style>
        </html>
    </panel>

 

kajolsharma_0-1628605278060.png

 

Labels (4)
0 Karma
1 Solution

ITWhisperer
SplunkTrust
SplunkTrust

Sorry, I copied the wrong piece of code - try this

          #master div.multivalue-subcell[data-mv-index="1"] {
            display: none !important;
          }

View solution in original post

ITWhisperer
SplunkTrust
SplunkTrust

Set the multivalue entry to display: none

          #master td:nth-child(1) {
            display: none !important;
          }
0 Karma

kajolsharma
Path Finder

Nope, it is making the table contents as blank .Wat I want is to hide the highlighted values.

kajolsharma_0-1628609973684.png

 

0 Karma

ITWhisperer
SplunkTrust
SplunkTrust

Sorry, I copied the wrong piece of code - try this

          #master div.multivalue-subcell[data-mv-index="1"] {
            display: none !important;
          }

View solution in original post

Did you miss .conf21 Virtual?

Good news! The event's keynotes and many of its breakout sessions are now available online, and still totally FREE!