topic Re: How to change graph of a panel dynamically? in Splunk Search

How to change graph of a panel dynamically?

takerraj — Thu, 07 Nov 2013 04:50:16 GMT

I'm using advanced XML and I have two panels. One panel will have two submitButton modules with HiddenSearch modules inside it. So, that upon clicking a button the search gets executed and the chart will be displayed in the second panel. Now, if I click other button, it has to run the corresponding search and in the second panel the previous chart should be replaced by this new chart. How to do it?

I tried by putting searches inside button, but upon clicking two buttons the charts are showing one below the other in the second panel. The first chart is not getting replaced by the second, instead it is getting appended. Is there a way to solve it? and here is the code of my dashboard :

<view template="dashboard.html">

Fab Operator New

*
2
False

rt
rt
sourcetype="EDA_XML" TR | xmlkv | search GasPressureLine2="*" | stats avg(GasPressureLine2) as myCount | gauge myCount 750 1000 1250 1500

radialGauge
Gas Pressure Line 2
[0,3000,4000,5000]
minimal
[0x84e900,0xffe800,0xbf3030]

130px
130px

rt
rt
sourcetype="EDA_XML" TR | xmlkv | search GasPressureLine2="*" | stats avg(GasPressureLine2) as myCount | gauge myCount 750 1000 1250 1500

fillerGauge
Gas Supply Level
[0,3000,4000,5000]
[0x84e900,0xffe800,0xbf3030]
minimal

130px
130px

More Details
False

sourcetype="EDA_XML" TR | xmlkv | search GasTemperature="*" | timechart values(GasPressureLine2)

line

Gas Pressure Line 2

More Details
False

sourcetype="EDA_XML" TR | xmlkv | search GasTemperature="*" | timechart values(GasSupplyLevel)

line

Gas Supply Level

Re: How to change graph of a panel dynamically?

martin_mueller — Thu, 07 Nov 2013 07:18:00 GMT

Have you taken a look at the TabSwitcher module?

Re: How to change graph of a panel dynamically?

takerraj — Thu, 07 Nov 2013 07:54:03 GMT

No, I didn't. But, a Tab switcher without showing tab labels will help I guess. Is a tab switcher without showing showing tab labels possible?

Re: How to change graph of a panel dynamically?

martin_mueller — Thu, 07 Nov 2013 07:59:24 GMT

You could do a third dummy panel without any content if hiding all panels doesn't exist.

Re: How to change graph of a panel dynamically?

takerraj — Thu, 07 Nov 2013 08:30:08 GMT

I'm actually new to splunk and I'm learning it. So, don't know much about all the modules. If you could suggest me a way out, then it'll be great Martin. BTW, is it possible to have tab switcher without tabs on it, or some way to hide them. So, if we change the tabs in the background, in the front the user will look as if the graph is really changing.

Re: How to change graph of a panel dynamically?

martin_mueller — Thu, 07 Nov 2013 10:26:39 GMT

Ah, you wanted to hide the tab labels - I don't think that's possible without customization, that'd defeat the purpose of tabs.

More generally, what's your use case / what are you trying to achieve? Based on the XML you posted I'm guessing you want to change the visualization of a chart dynamically?

Re: How to change graph of a panel dynamically?

martin_mueller — Thu, 07 Nov 2013 12:36:04 GMT

Here's an example of how to use the TabSwitcher module:

<view isSticky="False" isVisible="true" onunloadCancelJobs="true" template="dashboard.html">
  <label>Dynamic Charts</label>
  <module name="AccountBar" layoutPanel="appHeader" />
  <module name="AppBar" layoutPanel="appHeader" />
  <module name="SideviewUtils" layoutPanel="appHeader" />
  <module name="Message" layoutPanel="messaging">
    <param name="filter">*</param>
    <param name="maxSize">2</param>
    <param name="clearOnJobDispatch">False</param>
  </module>

  <module name="Search" layoutPanel="panel_row1_col1" group="Chart" autoRun="True">
    <param name="earliest">-7d@d</param>
    <param name="search">
| metadata type=hosts index=_internal | stats sum(totalCount) as count | gauge count 0 100000 500000 1000000
</param>
    <param name="latest">now</param>
    <param name="group">Chart</param>
    <module name="JobProgressIndicator">

      <module name="TabSwitcher">
        <param name="mode">independent</param>
        <module name="HiddenChartFormatter" group="radialGauge">
          <param name="chart">radialGauge</param>
          <module name="JSChart" />
        </module>
        <module name="HiddenChartFormatter" group="fillerGauge">
         <param name="chart">fillerGauge</param>
          <module name="JSChart" />
        </module>
      </module>

    </module>
  </module>
</view>

Re: How to change graph of a panel dynamically?

takerraj — Thu, 07 Nov 2013 13:04:46 GMT

No, not just the visualization of chart. The entire chart has to be changed (Search string etc).

What I'm trying to achieve is this. In the first panel, I have two radial gauges and below each gauge have a button. So, a radial gauge and a button. When I click on that button, the corresponding graph (chart over time) has to be loaded in the second panel.

That is the requirement. Now, when I click on a button the first time, the chart is loading in the second panel. Now, if I click on the button of another radial gauge its corresponding graph is getting appended below, instead of replacing.

Re: How to change graph of a panel dynamically?

martin_mueller — Fri, 08 Nov 2013 07:51:21 GMT

You can adapt the TabSwitcher example below to include arbitrary trees as children, including different searches.