Dashboards & Visualizations

How to apply background image for table visualization using CSS/Javascript?

paullt12345
Explorer

Hi

I want to set background image for a table visualization. How to handle with css/javascript.

--paull

0 Karma

chrisyounger
SplunkTrust
SplunkTrust

This looks a bit crazy, but below is one way to do it. Paste it into a new dashboard. I am assuming you have some background knowledge of how to do HTML/CSS. Otherwise this will be very hard.

<dashboard>
  <label>TestDashboard</label>
  <row depends="$hide_this$">
    <panel>
      <html>
      <style>
        #background_table {
          background:url(https://i.imgur.com/ZodtLh7.jpg);
        }
        #background_table th, #background_table td, #background_table .table  {
          background-color: transparent !important;
        }
      </style>
    </html>
    </panel>
  </row>
  <row>
    <panel>
      <table id="background_table">
        <search>
          <query>|makeresults count=10 | eval value = random()</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
          <sampleRatio>1</sampleRatio>
        </search>
        <option name="count">100</option>
        <option name="dataOverlayMode">none</option>
        <option name="drilldown">cell</option>
        <option name="percentagesRow">false</option>
        <option name="rowNumbers">false</option>
        <option name="totalsRow">false</option>
        <option name="wrap">true</option>
      </table>
    </panel>
  </row>
</dashboard>
0 Karma
Get Updates on the Splunk Community!

Brains, Bytes, and Boston: Learn from the Best at .conf25

When you think of Boston, you might picture colonial charm, world-class universities, or even the crack of a ...

Splunk AppDynamics Agents Webinar Series

Mark your calendars! On June 24th at 12PM PST, we’re going live with the second session of our Splunk ...

SplunkTrust Application Period is Officially OPEN!

It's that time, folks! The application/nomination period for the 2025 SplunkTrust is officially open! If you ...