Dashboards & Visualizations

insert some text inbetween the rows in XML in a dashboard

HattrickNZ
Motivator

I have a very simple test dashboard(see code below)

It basically has 2 rows, with 1 panel in the 1st and multiple panels in the 2nd.

What I want to know is what is the XML code to use to insert some text inbetween the rows? This will basically act as a divider/description of the Row that follows.

I have tried something like this:

<label>THIS IS A LABEL</label>

All my XML CODE below:

<dashboard>
  <label>dynamic_gauges</label>
  <description>these are dynamic gagues 
want to see how many I can fit in a row without further code. 
And would alos like to add percentages</description>
  <row>
    <panel>
      <table>
        <title>first1</title>
        <search>
          <query>index=_internal earliest=-5m sourcetype=splunkd | stats count | gauge count [search sourcetype=splunkd index=_internal earliest=-20m latest=-10m | stats count as max | eval first=0 | eval second=10 | eval third=max/2 | eval fourth=max  | eval range=first+" "+second+" "+third+" "+fourth | return $range]</query>
          <earliest></earliest>
          <latest></latest>
        </search>
      </table>
    </panel>
  </row>
  <label>THIS IS A LABEL</label>
  <row>
    <panel>
      <chart>
        <title>1st gauge</title>
        <search>
          <query>index=_internal earliest=-5m sourcetype=splunkd | stats count | gauge count [search sourcetype=splunkd index=_internal earliest=-20m latest=-10m | stats count as max | eval first=0 | eval second=10 | eval third=max/2 | eval fourth=max  | eval range=first+" "+second+" "+third+" "+fourth | return $range]</query>
        </search>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">visible</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.enabled">false</option>
        <option name="charting.axisY2.scale">inherit</option>
        <option name="charting.chart">fillerGauge</option>
        <option name="charting.chart.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">gaps</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">shiny</option>
        <option name="charting.drilldown">all</option>
        <option name="charting.layout.splitSeries">0</option>
        <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
        <option name="charting.legend.placement">right</option>
      </chart>
    </panel>
    <panel>
      <chart>
        <title>2nd gauge</title>
        <search>
          <query>index=_internal earliest=-5m sourcetype=splunkd | stats count | gauge count [search sourcetype=splunkd index=_internal earliest=-20m latest=-10m | stats count as max | eval first=0 | eval second=10 | eval third=max/2 | eval fourth=max  | eval range=first+" "+second+" "+third+" "+fourth | return $range]</query>
        </search>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">visible</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.enabled">false</option>
        <option name="charting.axisY2.scale">inherit</option>
        <option name="charting.chart">fillerGauge</option>
        <option name="charting.chart.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">gaps</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">shiny</option>
        <option name="charting.drilldown">all</option>
        <option name="charting.layout.splitSeries">0</option>
        <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
        <option name="charting.legend.placement">right</option>
      </chart>
    </panel>
    <panel>
      <chart>
        <title>3rd gauge</title>
        <search>
          <query>index=_internal earliest=-5m sourcetype=splunkd | stats count | gauge count [search sourcetype=splunkd index=_internal earliest=-20m latest=-10m | stats count as max | eval first=0 | eval second=10 | eval third=max/2 | eval fourth=max  | eval range=first+" "+second+" "+third+" "+fourth | return $range]</query>
        </search>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">visible</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.enabled">false</option>
        <option name="charting.axisY2.scale">inherit</option>
        <option name="charting.chart">fillerGauge</option>
        <option name="charting.chart.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">gaps</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">shiny</option>
        <option name="charting.drilldown">all</option>
        <option name="charting.layout.splitSeries">0</option>
        <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
        <option name="charting.legend.placement">right</option>
      </chart>
    </panel>
    <panel>
      <chart>
        <title>4th gauge</title>
        <search>
          <query>index=_internal earliest=-5m sourcetype=splunkd | stats count | gauge count [search sourcetype=splunkd index=_internal earliest=-20m latest=-10m | stats count as max | eval first=0 | eval second=10 | eval third=max/2 | eval fourth=max  | eval range=first+" "+second+" "+third+" "+fourth | return $range]</query>
          <earliest></earliest>
          <latest></latest>
        </search>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">visible</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.enabled">0</option>
        <option name="charting.axisY2.scale">inherit</option>
        <option name="charting.chart">markerGauge</option>
        <option name="charting.chart.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">gaps</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">shiny</option>
        <option name="charting.drilldown">all</option>
        <option name="charting.layout.splitSeries">0</option>
        <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
        <option name="charting.legend.placement">right</option>
      </chart>
    </panel>
    <panel>
      <chart>
        <title>5th gauge</title>
        <search>
          <query>index=_internal earliest=-5m sourcetype=splunkd | stats count | gauge count [search sourcetype=splunkd index=_internal earliest=-20m latest=-10m | stats count as max | eval first=0 | eval second=10 | eval third=max/2 | eval fourth=max  | eval range=first+" "+second+" "+third+" "+fourth | return $range]</query>
          <earliest></earliest>
          <latest></latest>
        </search>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">visible</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.enabled">0</option>
        <option name="charting.axisY2.scale">inherit</option>
        <option name="charting.chart">markerGauge</option>
        <option name="charting.chart.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">gaps</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">shiny</option>
        <option name="charting.drilldown">all</option>
        <option name="charting.layout.splitSeries">0</option>
        <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
        <option name="charting.legend.placement">right</option>
      </chart>
    </panel>
    <panel>
      <chart>
        <title>6th Gauge</title>
        <search>
          <query>index=_internal earliest=-5m sourcetype=splunkd | stats count | gauge count [search sourcetype=splunkd index=_internal earliest=-20m latest=-10m | stats count as max | eval first=0 | eval second=10 | eval third=max/2 | eval fourth=max  | eval range=first+" "+second+" "+third+" "+fourth | return $range]</query>
          <earliest></earliest>
          <latest></latest>
        </search>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">visible</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.enabled">0</option>
        <option name="charting.axisY2.scale">inherit</option>
        <option name="charting.chart">markerGauge</option>
        <option name="charting.chart.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">gaps</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">shiny</option>
        <option name="charting.drilldown">all</option>
        <option name="charting.layout.splitSeries">0</option>
        <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
        <option name="charting.legend.placement">right</option>
      </chart>
    </panel>
    <panel>
      <chart>
        <title>7th Gauge</title>
        <search>
          <query>index=_internal earliest=-5m sourcetype=splunkd | stats count | gauge count [search sourcetype=splunkd index=_internal earliest=-20m latest=-10m | stats count as max | eval first=0 | eval second=10 | eval third=max/2 | eval fourth=max  | eval range=first+" "+second+" "+third+" "+fourth | return $range]</query>
          <earliest></earliest>
          <latest></latest>
        </search>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">visible</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.enabled">0</option>
        <option name="charting.axisY2.scale">inherit</option>
        <option name="charting.chart">markerGauge</option>
        <option name="charting.chart.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">gaps</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">shiny</option>
        <option name="charting.drilldown">all</option>
        <option name="charting.layout.splitSeries">0</option>
        <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
        <option name="charting.legend.placement">right</option>
      </chart>
    </panel>
    <panel>
      <chart>
        <title>8th Gauge</title>
        <search>
          <query>index=_internal earliest=-5m sourcetype=splunkd | stats count | gauge count [search sourcetype=splunkd index=_internal earliest=-20m latest=-10m | stats count as max | eval first=0 | eval second=10 | eval third=max/2 | eval fourth=max  | eval range=first+" "+second+" "+third+" "+fourth | return $range]</query>
          <earliest></earliest>
          <latest></latest>
        </search>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">visible</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.enabled">0</option>
        <option name="charting.axisY2.scale">inherit</option>
        <option name="charting.chart">markerGauge</option>
        <option name="charting.chart.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">gaps</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">shiny</option>
        <option name="charting.drilldown">all</option>
        <option name="charting.layout.splitSeries">0</option>
        <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
        <option name="charting.legend.placement">right</option>
      </chart>
    </panel>
    <panel>
      <chart>
        <title>9th Gauge</title>
        <search>
          <query>index=_internal earliest=-5m sourcetype=splunkd | stats count | gauge count [search sourcetype=splunkd index=_internal earliest=-20m latest=-10m | stats count as max | eval first=0 | eval second=10 | eval third=max/2 | eval fourth=max  | eval range=first+" "+second+" "+third+" "+fourth | return $range]</query>
          <earliest></earliest>
          <latest></latest>
        </search>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">visible</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.enabled">0</option>
        <option name="charting.axisY2.scale">inherit</option>
        <option name="charting.chart">markerGauge</option>
        <option name="charting.chart.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">gaps</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">shiny</option>
        <option name="charting.drilldown">all</option>
        <option name="charting.layout.splitSeries">0</option>
        <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
        <option name="charting.legend.placement">right</option>
      </chart>
    </panel>
    <panel>
      <chart>
        <title>10th Gauge</title>
        <search>
          <query>index=_internal earliest=-5m sourcetype=splunkd | stats count | gauge count [search sourcetype=splunkd index=_internal earliest=-20m latest=-10m | stats count as max | eval first=0 | eval second=10 | eval third=max/2 | eval fourth=max  | eval range=first+" "+second+" "+third+" "+fourth | return $range]</query>
          <earliest></earliest>
          <latest></latest>
        </search>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">visible</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.enabled">0</option>
        <option name="charting.axisY2.scale">inherit</option>
        <option name="charting.chart">markerGauge</option>
        <option name="charting.chart.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">gaps</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">shiny</option>
        <option name="charting.drilldown">all</option>
        <option name="charting.layout.splitSeries">0</option>
        <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
        <option name="charting.legend.placement">right</option>
      </chart>
    </panel>
  </row>
</dashboard>
Tags (2)
1 Solution

aljohnson_splun
Splunk Employee
Splunk Employee

At first thought you just meant using the xml / html comment like this

<!-- comment -->

but now I see you're looking to use an html panel like this;

<row>
  <panel>
    <html>
      <h1>Hattrick My Man</h1>
    </html>
  </panel>
</row>

View solution in original post

aljohnson_splun
Splunk Employee
Splunk Employee

At first thought you just meant using the xml / html comment like this

<!-- comment -->

but now I see you're looking to use an html panel like this;

<row>
  <panel>
    <html>
      <h1>Hattrick My Man</h1>
    </html>
  </panel>
</row>

HattrickNZ
Motivator

test 1 - pasted html code

<row>
<html>
<h1>
HTML Panels
</h1>
<p>Easily add content to clarify use of a dashboard.</p>
</html>
<html src="html/html_tags.html">
</html>
</row>

test 2 - pasted html code and pressed the code button after highligting the selected code

&lt;row&gt;
        &lt;html&gt;
            &lt;h1&gt;
                HTML Panels
            &lt;/h1&gt;
            &lt;p&gt;Easily add content to clarify use of a dashboard.&lt;/p&gt;
        &lt;/html&gt;
        &lt;html src="html/html_tags.html"&gt;
        &lt;/html&gt;
    &lt;/row&gt;

test3 - more tests --

0 Karma

HattrickNZ
Motivator

<dashboard>
<label>dynamic_gauges</label>
<description>these are dynamic gagues
want to see how many I can fit in a row without further code.
And would alos like to add percentages</description>
<row>
<panel>
<table>
<title>first1</title>
<search>
<query>index=_internal earliest=-5m sourcetype=splunkd | stats count | gauge count [search sourcetype=splunkd index=_internal earliest=-20m latest=-10m | stats count as max | eval first=0 | eval second=10 | eval third=max/2 | eval fourth=max | eval range=first+" "+second+" "+third+" "+fourth | return $range]</query>
<earliest></earliest>
<latest></latest>
</search>
</table>
</panel>
</row>
<label>THIS IS A LABEL</label>
<row>
<panel>
<chart>
<title>1st gauge</title>
<search&

TESTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTT

<dashboard>
<label>dynamic_gauges</label>
<description>these are dynamic gagues
want to see how many I can fit in a row without further code.
And would alos like to add percentages</description>
<row>
<panel>
<table>

0 Karma

HattrickNZ
Motivator

Ahhhh... finally got that to work, so then I tried yours again and it worked....ahhh...oh well

Here is the snippet of my code between an ending row tag and open row tag

 &lt;/row&gt;

&lt;row&gt;
        &lt;html&gt;
            &lt;h1&gt;
                HTML Panels
            &lt;/h1&gt;
            &lt;p&gt;Easily add content to clarify use of a dashboard.&lt;/p&gt;
        &lt;/html&gt;

    &lt;/row&gt;
  &lt;row&gt;


 &lt;/row&gt;

&lt;row&gt;
        &lt;html&gt;
            &lt;h1&gt;
                HTML Panels
            &lt;/h1&gt;
            &lt;p&gt;Easily add content to clarify use of a dashboard.&lt;/p&gt;
        &lt;/html&gt;

    &lt;/row&gt;
  &lt;row&gt;

this is a test

    <html>
        <h1>
            HTML Panels
        </h1>
        <p>Easily add content to clarify use of a dashboard.</p>
    </html>
    <html src="html/html_tags.html">
    </html>
</row>

this is another test

<h1>
HTML Panels
</h1>
<p>Easily add content to clarify use of a dashboard.</p>
0 Karma

HattrickNZ
Motivator

@aljohnson_splunk

I can't get that to work, I edit source XML and i can't save it it says "Encountered the following error while trying to update: In handler 'views': Error parsing XML on line 20: Couldn't find end of Start Tag more line 20"

Here is the snippet of my code between an ending row tag and open row tag
</row>
<normal xml tag>
<!-- Ayy, Nice Label Bro -->
<more normal xml>
<row>

0 Karma

aljohnson_splun
Splunk Employee
Splunk Employee

Hey Hattrick,

You'll the actual tags to be real <xml> tags. I just put in &lt;normal xml tag&gt; assuming that you would change it. The comment part is really just the &lt;!-- Comments go here --&gt;. I'll update my answer.

0 Karma

HattrickNZ
Motivator

Ah maybe I am not clear, I understand how to comment out code or add comments like you say.

What I want is to insert text into the dashboard between 2 rows like I do below: but i want to do it in my XML dashboard that I have created.

<row>thsi is row1</row>
<h1>thsi is Label</h1>
<row>thsi is row2</row>
<!- this is a comment->

http://jsfiddle.net/14fdep15/1/

0 Karma

aljohnson_splun
Splunk Employee
Splunk Employee

Got it. I think you're looking for HTML panels. Updated.

0 Karma

HattrickNZ
Motivator

could not get that to work, am i doing something wrong?

0 Karma
Get Updates on the Splunk Community!

Index This | I am a number, but when you add ‘G’ to me, I go away. What number am I?

March 2024 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with another ...

What’s New in Splunk App for PCI Compliance 5.3.1?

The Splunk App for PCI Compliance allows customers to extend the power of their existing Splunk solution with ...

Extending Observability Content to Splunk Cloud

Register to join us !   In this Extending Observability Content to Splunk Cloud Tech Talk, you'll see how to ...