All Apps and Add-ons

Change Background Color of Water Gauge?

Ginzoa
Explorer

Hello! I have been trying to figure this out the whole day with zero success.

I want to change the background color of my Water Gauge (from white to black)

I have it like this:

alt text

And I want something like this:

alt text

I have tried this with HTML:

.highcharts-container {
     background: #000000 !important;
}

and also tried this with XML:

<option name="water_gauge.gauge.bgColor">#000000</option>

But none of them worked

Can someone guide me a little bit more, please?

Thank you!

0 Karma
1 Solution

niketn
Legend

@Ginzoa while you can request the app developer directly for that enhancement for background color to be available as an option.

If you want you can use following CSS override where myWaterGauge is the Water Gauge id and myPanel is panel id.

          #myWaterGauge svg, #myPanel.dashboard-panel{
            background: black !important;
          }

Following is a run anywhere example for you to try out and confirm!

alt text

Following is the Simple XML code:

<dashboard>
  <label>Water gauge Background Color</label>
  <row>
    <panel id="myPanel">
      <html>
        <style>
          #myWaterGauge svg, #myPanel.dashboard-panel{
            background: black !important;
          }
          #myPanel h3{
            color: #178BCA !important;
          }
        </style>
      </html>
      <viz id="myWaterGauge" type="cuviz_water_gauge.water_gauge">
        <title>Most Active Splunkd Component</title>
        <search>
          <query>index=_internal sourcetype=splunkd log_level=INFO
| top 1 component showcount=f
| fields percent</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
          <sampleRatio>1</sampleRatio>
        </search>
        <option name="drilldown">none</option>
        <option name="trellis.enabled">0</option>
        <option name="trellis.scales.shared">1</option>
        <option name="trellis.size">medium</option>
      </viz>
    </panel>
  </row>
</dashboard>
____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

View solution in original post

niketn
Legend

@Ginzoa while you can request the app developer directly for that enhancement for background color to be available as an option.

If you want you can use following CSS override where myWaterGauge is the Water Gauge id and myPanel is panel id.

          #myWaterGauge svg, #myPanel.dashboard-panel{
            background: black !important;
          }

Following is a run anywhere example for you to try out and confirm!

alt text

Following is the Simple XML code:

<dashboard>
  <label>Water gauge Background Color</label>
  <row>
    <panel id="myPanel">
      <html>
        <style>
          #myWaterGauge svg, #myPanel.dashboard-panel{
            background: black !important;
          }
          #myPanel h3{
            color: #178BCA !important;
          }
        </style>
      </html>
      <viz id="myWaterGauge" type="cuviz_water_gauge.water_gauge">
        <title>Most Active Splunkd Component</title>
        <search>
          <query>index=_internal sourcetype=splunkd log_level=INFO
| top 1 component showcount=f
| fields percent</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
          <sampleRatio>1</sampleRatio>
        </search>
        <option name="drilldown">none</option>
        <option name="trellis.enabled">0</option>
        <option name="trellis.scales.shared">1</option>
        <option name="trellis.size">medium</option>
      </viz>
    </panel>
  </row>
</dashboard>
____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

Ginzoa
Explorer

Absolutely perfect! Thank you so much!

0 Karma
Career Survey
First 500 qualified respondents will receive a $20 gift card! Tell us about your professional Splunk journey.

Can’t make it to .conf25? Join us online!

Get Updates on the Splunk Community!

Community Content Calendar, September edition

Welcome to another insightful post from our Community Content Calendar! We're thrilled to continue bringing ...

Splunkbase Unveils New App Listing Management Public Preview

Splunkbase Unveils New App Listing Management Public PreviewWe're thrilled to announce the public preview of ...

Leveraging Automated Threat Analysis Across the Splunk Ecosystem

Are you leveraging automation to its fullest potential in your threat detection strategy?Our upcoming Security ...