All Apps and Add-ons

How to make Trellis smaller in the dashboard using the Status Indicator - Custom Visualization app?

robertlynch2020
Motivator

hi

I have the following code but i want to make the size of the treill smaller.
I have set it to small already but i would like smaller if possible. alt text

  <row>
    <panel>
      <viz type="status_indicator_app.status_indicator">
        <search>
          <query>| inputlookup Technical_View_Launchers_Needed2.csv 
| join Launcher_Name type=left 
    [ search index=jmx sourcetype=jmx host="*" jvmDescription="*" mbean_domain="murex" 
    | search source = *\=SubAgent* 
    | rex field=source "^.*installationcode=(?<Launcher>.*),subagent-name=(?<Machine_Name>.*)" 
    | table source Launcher Machine_Name 
    | eval source = Launcher." # ".Machine_Name 
    | chart sparkline count by source 
    | rename source as Launcher#Machine_Name 
    | rename sparkline as Heartbeat 
    | rename count as status 
    | lookup Technical_View_Status_Launchers.csv Launcher#Machine_Name AS "Launcher#Machine_Name" OUTPUT status as status_history, Time as Time_of_Detection 
    | eval status=if(status > 4, if(status > 9, "ALIVE", if(isnull(status_history),"STARTING","FLUX")), if(isnull(status_history),"STARTING","DEAD")) 
    | fields - status_history 
    | rex field=Launcher#Machine_Name "(?<Launcher_Name>.*) #" ] 
| eval status=if(isnull(status),"REQUIRED",status) 
| fields - Launcher#Machine_Name Time_of_Detection Heartbeat Launcher_Name 
| foreach "LAUNCHER_*" 
    [ eval <<FIELD>>=if(<<FIELD>> > 0 AND status = "REQUIRED", "1" ,"0")] 
| table LAUNCHER* 
| addtotals col=t 
| table LAUNCHER* 
| tail 1 
| foreach "LAUNCHER_*" 
    [ eval <<FIELD>>=if(<<FIELD>> > 0 , "ERROR" ,"ALIVE")] 
| transpose 
| rename column as User 
| rename "row 1" as Status 
| sort User 
| rex field=User "LAUNCHER_(?<User>.*)" 
| foreach Status 
    [ eval icon=if('<<FIELD>>'=="ALIVE","check-circle","times-circle"), color=if('<<FIELD>>'=="ALIVE","green","red")] 
| stats last(Status) as Status last(icon) as icon last(color) as color by User</query>
          <earliest>-60m@m</earliest>
          <latest>now</latest>
          <sampleRatio>1</sampleRatio>
          <refresh>30s</refresh>
          <refreshType>delay</refreshType>
        </search>
        <option name="drilldown">none</option>
        <option name="height">300</option>
        <option name="status_indicator_app.status_indicator.colorBy">field_value</option>
        <option name="status_indicator_app.status_indicator.fillTarget">background</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>
        <option name="trellis.enabled">1</option>
        <option name="trellis.scales.shared">1</option>
        <option name="trellis.size">small</option>
        <option name="trellis.splitBy">User</option>
      </viz>
    </panel>
  </row>
0 Karma

woodcock
Esteemed Legend

The general approach here is to convert your dashboard to html, then examine the html file generated to see the names of the elements that control such things, then go back to your original simpleXML dashboard and set those elements to what you like.

0 Karma

felipesewaybric
Contributor

you can edit your css, like:

.facets-container .viz-facet {
height: 80px !important;
width: 80px !important;
float: left;
padding: 15px 0px 0px 0px;
}

tdowney
Engager

YES! thank you!

Also remember you can specify specific panel(s) by using

myPanel .facets-container .viz-facet { ... }

where your panel has

0 Karma

vidhyaArumalla
Path Finder

This is a cool way to do it rather than creating whole new css

0 Karma

renjith_nair
SplunkTrust
SplunkTrust

Hi @robertlynch2020,

Have a look at this answer https://answers.splunk.com/answers/562662/using-trellis-with-simple-xml-extension.html by @niketnilay

You could override this by adding css to the xml

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!