Re: Is there a way to put single value panel in a ...

Jhanzkie · ‎04-05-2022

Hello Good Day,

Sorry for this very noob question,

Is there a way that I can put to single value panel in a table using in-line css
without referencing it to a css and js file ?

For example:

makeresults will do to give me an idea. Thanks 🙂

bowesmana · ‎04-06-2022

Is this what you want?

<dashboard>
  <label>Example</label>
  <row>
    <panel>
      <html>
        <h1 style="text-align:center">Panel title</h1>
      </html>
    </panel>
  </row>
  <row>
    <panel>
      <single>
        <search>
          <query>
            | makeresults
            | eval value = random() % 10000
          </query>
          <earliest>-24h</earliest>
          <latest>now</latest>
          <sampleRatio>1</sampleRatio>
        </search>
        <option name="drilldown">none</option>
      </single>
    </panel>
    <panel>
      <single>
        <search>
          <query>
            | makeresults
            | eval value = random() % 10000
          </query>
          <earliest>-24h</earliest>
          <latest>now</latest>
          <sampleRatio>1</sampleRatio>
        </search>
        <option name="drilldown">none</option>
      </single>
    </panel>
  </row>
</dashboard>

Jhanzkie · ‎04-06-2022

It's in the same panel and row sir 🙂
and more like of a table style
but i think it's not possible without splunkjs

anyways thank you for your time.

bowesmana · ‎04-10-2022

@Jhanzkie

The world is your oyster with inline CSS

See this - single row - single panel

<dashboard>
  <label>Example</label>
  <row>
    <panel depends="$CSS$">
      <html>
        <style>
          #single_value h2.panel-title {
            text-align: center !important;
            font-size: 24px !important;
            border: double !important;
            color: #ff0000 !important;
          }
        </style>
      </html>
    </panel>
    <panel id="single_value">
      <title>Here is a nice panel title in red</title>
      <single>
        <search>
          <query>
            | makeresults
            | eval value = random() % 10000
          </query>
          <earliest>-24h</earliest>
          <latest>now</latest>
          <sampleRatio>1</sampleRatio>
        </search>
        <option name="drilldown">none</option>
      </single>
      <single>
        <search>
          <query>
            | makeresults
            | eval value = random() % 10000
          </query>
          <earliest>-24h</earliest>
          <latest>now</latest>
          <sampleRatio>1</sampleRatio>
        </search>
        <option name="drilldown">none</option>
      </single>
    </panel>
  </row>
</dashboard>

ITWhisperer · ‎04-06-2022

The single viz has a trellis option - would that give you what you need?

bowesmana · ‎04-05-2022

You can add CSS to a dashboard, e.g.

<row depends="$CSSOnly$">
  <panel>
    <html>
define CSS here
    </html>
  </panel>
</row>
<row>
  <panel>
    <table id="xx">
...
    </table>
  </panel>
</row>

there are lots of examples in this forum

Jhanzkie · ‎04-05-2022

Hello, thank you for your reply .

What i want is two single value chart in a table if it is possible.

Is there a way to put single value panel in a table using in-line css without referencing it to a css and js file?

chart

CSS

panel

single value

Announcing Scheduled Export GA for Dashboard Studio

Extending Observability Content to Splunk Cloud

More Control Over Your Monitoring Costs with Archived Metrics GA in US-AWS!