Dashboards & Visualizations

Dynamic dashboard - time range, span and others

xradim
Explorer

Is possible to add into Dashboard graph drop down menus where could be definition of time range? I am looking for similar option which is available in search itself. I would like to have time range as variable I can change in graph itself so I don't have to update searches.

Thanks

Radim

Tags (1)

BobM
Builder

If you don't want to resort to advanced xml, convert your dashboard to a form and add the input type of time. Below is a simple example.

<form>
  <label>My Dashboard as a form</label>
  <fieldset autoRun="true" >
       <input type="time" />
  </fieldset> 

  <row>
    <single>
      <searchTemplate>mysearch | stats count | rangemap field=count low=0-0 elevated=1-10 default=severe</searchTemplate>
      <title>Responses outside SLA</title>
      <option name="classField">range</option>
    </single>
  </row>

  <row>
    <chart>
      <searchName>MySavedSearch</searchName>
      <title>My Saved Search</title>
      <option name="charting.chart">line</option>
      <option name="charting.legend.placement">bottom</option>
    </chart>
  </row>

<form>

Ayn
Legend

Sure. Not sure you can achieve this with simple XML, but it can certainly be done with advanced XML by wrapping your panels within TimeRangePicker modules.

The following example takes the saved search "Requests over time" and presents the results as an area chart, where the timerange for this chart is defined by the timerange picker chosen by the user.

 <module name="TimeRangePicker" layoutPanel="panel_row2_col1" group="Requests per second by action">
  <param name="searchWhenChanged">True</param>
  <param name="selected">Last 60 minutes</param>
  <module name="HiddenSavedSearch" autoRun="True">
   <param name="useHistory">false</param>
   <param name="savedSearch">Requests over time</param>
   <module name="EnablePreview">
    <param name="enable">true</param>
    <param name="display">false</param>
    <module name="HiddenChartFormatter">
     <param name="chart">area</param>
     <param name="chart.stackMode">stacked</param>
     <param name="chart.nullValueMode">zero</param>
     <module name="FlashChart">
      <param name="height">300px</param>
      <module name="ViewRedirectorLink">
       <param name="viewTarget">flashtimeline</param>
       <param name="label">View full results</param>
      </module>
     </module>
    </module>
   </module>
  </module>
 </module>

You can also have one TimeRangePicker that drives all charts in a dashboard instead of having one TimeRangePicker per chart. All you need to do to get that behaviour is to give the TimeRangePicker its own layoutPanel that is separate from the chart panels, and then wrap them all in, as in the following example.

 <module name="TimeRangePicker" layoutPanel="panel_row1_col1">
  <param name="searchWhenChanged">True</param>
  <param name="selected">Last 60 minutes</param>
  <module name="HiddenSavedSearch" layoutPanel="panel_row2_col1" group="Requests per second by action" autoRun="True">
   <param name="useHistory">false</param>
   <param name="savedSearch">Requests over time</param>
   <module name="EnablePreview">
    <param name="enable">true</param>
    <param name="display">false</param>
    <module name="HiddenChartFormatter">
     <param name="chart">area</param>
     <param name="chart.stackMode">stacked</param>
     <param name="chart.nullValueMode">zero</param>
     <module name="FlashChart">
      <param name="height">300px</param>
      <module name="ViewRedirectorLink">
       <param name="viewTarget">flashtimeline</param>
       <param name="label">View full results</param>
      </module>
     </module>
    </module>
   </module>
  </module>

  <module name="HiddenSavedSearch" layoutPanel="panel_row2_col2" group="Bandwidth over time" autoRun="True">
   <param name="useHistory">false</param>
   <param name="savedSearch">Bandwidth over time</param>
   <module name="EnablePreview">
    <param name="enable">true</param>
    <param name="display">false</param>
    <module name="HiddenChartFormatter">
     <param name="chart">line</param>
     <param name="chart.nullValueMode">zero</param>
     <module name="FlashChart">
      <param name="height">300px</param>
      <module name="ViewRedirectorLink">
       <param name="viewTarget">flashtimeline</param>
       <param name="label">View full results</param>
      </module>
     </module>
    </module>
   </module>
  </module>
 </module>
Get Updates on the Splunk Community!

Announcing Scheduled Export GA for Dashboard Studio

We're excited to announce the general availability of Scheduled Export for Dashboard Studio. Starting in ...

Extending Observability Content to Splunk Cloud

Watch Now!   In this Extending Observability Content to Splunk Cloud Tech Talk, you'll see how to leverage ...

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

What if there was a way you could keep all the metrics data you need while saving on storage costs?This is now ...