Alignment and sizing of panels in dashboard

prettysunshinez · ‎01-14-2020

I have dashboard with multiple panels and html buttons.
the problem is they do not have the same alignment as Iam.
What should be done??
Can any numbering possible to fix the alignment.
Pls suggest.

niketn · ‎01-18-2020

@prettysunshinez can you either provide the mock up of Panel and Button design or provide the current Simple XML that you are having? Multiple panels means how many and which is the viz being used?

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

prettysunshinez · ‎01-19-2020

Hi @niketnilay.

As suggested by you,i took the reference from the below link and created a button to show and hide events.

https://answers.splunk.com/answers/779524/can-an-html-button-with-value-be-done-without-usin-1.html

I have the same done for 9 other panels as well..
And in my UI i have placed the buttons rightly below the respective panels..
But for others,the alignment is not same.

I wanted to fix this

niketn · ‎01-19-2020

Are the 9 panels in the same row or different rows? The answer you have referred was created only for one panel. So I would need to know whether you plan to single rows with 9 panels next to each other and 9 show/hide buttons or you need to have 9 rows with one set of show/hide and panel?

A whiteboard screenshot of expected design would help assist better.

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

prettysunshinez · ‎01-18-2020

Any suggestions on this please

jpolvino · ‎01-14-2020

If you're saying that the HTML element (button) is not staying centered under your panels, then you may try to add the HTML content within the panel itself. Here is a dummy dashboard that does just that.

<dashboard>
  <label>deleteme</label>
  <row>
    <panel>
      <table>
        <title>panel title</title>
        <search>
          <query>|makeresults
|eval d="123"</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
        </search>
        <option name="drilldown">none</option>
      </table>
      <html><center>element goes here</center></html>
    </panel>
    <panel>
      <table>
        <title>another panel</title>
        <search>
          <query>|makeresults
| eval sss="234"</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
        </search>
        <option name="drilldown">none</option>
      </table>
      <html><center>another element goes here</center></html>
    </panel>
  </row>
</dashboard>

You'll notice that the HTML data goes just before the panel item closes. This will keep it centered under the panel content. Try that and see if it gets you closer.

prettysunshinez · ‎01-16-2020

Nope @jpolvino,In order to have the events populated on clicking the HTML button i have used the drilldown properties of a cell to perform that.So I could have the html content within the same panel.

So Im trying to find if I could fix the alignment through code.

Thanks 🙂

Alignment and sizing of panels in dashboard

Splunk Observability Cloud's AI Assistant in Action Series: Auditing Compliance and ...

Splunk Community Badges!

What You Read The Most: Splunk Lantern’s Most Popular Articles!

Are you a member of the Splunk Community?

Alignment and sizing of panels in dashboard

Splunk Observability Cloud's AI Assistant in Action Series: Auditing Compliance and ...

Splunk Community Badges!

What You Read The Most: Splunk Lantern’s Most Popular Articles!