Dashboards & Visualizations

How to move the timeline in a Splunk dashboard without manually entering a time in a time input?

tinhuty
Engager

I have a dashboard with a time input and a graph that is tied to that time control.

The default value of the time input is the last 5 minutes. I'd like to implement a convenient way to move the time line 5 minutes earlier based on current time selection. For example, if the current time value is last 5 minutes, then I'd like to quick way to select the time range of last 10 minutes to last 5 minutes (without manually enter value in the time input).

Looks like a button is not supported (version 6.4.4), I am thinking of a drop-down input. Select an option in drop-down will result move time line 5 minutes earlier and update the graph. Is this doable and how?

thanks.

0 Karma
1 Solution

somesoni2
Revered Legend

Try this run anywhere sample dashboard. I've include a time range picker to select the time (default to last 5min) and a dropdown to select how far you want to see the data from the current time range picker selection. If you select "Current time" it shows a line chart of data (used _internal index) for time range same as time range picker selection (earliest and latest). If you select 5 min, it will show data for earliest-5m and latest-5m, and so on.

<form>
  <label>Relative Timeline</label>
  <fieldset submitButton="false">
    <input type="time" token="timerange" searchWhenChanged="true">
      <label></label>
      <default>
        <earliest>-5m</earliest>
        <latest>now</latest>
      </default>
    </input>
    <input type="dropdown" token="gobackTime" searchWhenChanged="true">
      <label>Go Back Time</label>
      <choice value="0m">Current Selection</choice>
      <choice value="5m">5 Min</choice>
      <choice value="10m">10 Min</choice>
      <choice value="15m">15 Min</choice>
      <default>0m</default>
    </input>
  </fieldset>
  <row>
    <panel>
      <chart>
        <search>
          <query>index=_internal sourcetype=splunkd [| gentimes start=-1 | addinfo | eval earliest=relative_time(info_min_time,"-$gobackTime$") | eval latest=relative_time(info_max_time, "-$gobackTime$") | table earliest latest | format "" "" "" "" "" "" ] | timechart count</query>
          <earliest>$timerange.earliest$</earliest>
          <latest>$timerange.latest$</latest>
        </search>
        <option name="charting.chart">line</option>
      </chart>
    </panel>
  </row>
</form>

View solution in original post

somesoni2
Revered Legend

Try this run anywhere sample dashboard. I've include a time range picker to select the time (default to last 5min) and a dropdown to select how far you want to see the data from the current time range picker selection. If you select "Current time" it shows a line chart of data (used _internal index) for time range same as time range picker selection (earliest and latest). If you select 5 min, it will show data for earliest-5m and latest-5m, and so on.

<form>
  <label>Relative Timeline</label>
  <fieldset submitButton="false">
    <input type="time" token="timerange" searchWhenChanged="true">
      <label></label>
      <default>
        <earliest>-5m</earliest>
        <latest>now</latest>
      </default>
    </input>
    <input type="dropdown" token="gobackTime" searchWhenChanged="true">
      <label>Go Back Time</label>
      <choice value="0m">Current Selection</choice>
      <choice value="5m">5 Min</choice>
      <choice value="10m">10 Min</choice>
      <choice value="15m">15 Min</choice>
      <default>0m</default>
    </input>
  </fieldset>
  <row>
    <panel>
      <chart>
        <search>
          <query>index=_internal sourcetype=splunkd [| gentimes start=-1 | addinfo | eval earliest=relative_time(info_min_time,"-$gobackTime$") | eval latest=relative_time(info_max_time, "-$gobackTime$") | table earliest latest | format "" "" "" "" "" "" ] | timechart count</query>
          <earliest>$timerange.earliest$</earliest>
          <latest>$timerange.latest$</latest>
        </search>
        <option name="charting.chart">line</option>
      </chart>
    </panel>
  </row>
</form>

tinhuty
Engager

Tried this and worked beautifully! Thanks!

Now I think about it, there is a lightly change the question: how can we implement something that can be continuously move time line using similar way? For example, if the current time line is "-5m to now", what I want is the ability to move the time line to "-10m to -5m", then to "-15m to -10m" etc. (If there were a button available, just like click the button will move 5 minutes earlier on the current selection, click again will move another 5 minutes earlier).

0 Karma

tinhuty
Engager

Thanks! Will try this out.

0 Karma
Get Updates on the Splunk Community!

Webinar Recap | Revolutionizing IT Operations: The Transformative Power of AI and ML ...

The Transformative Power of AI and ML in Enhancing Observability   In the realm of IT operations, the ...

.conf24 | Registration Open!

Hello, hello! I come bearing good news: Registration for .conf24 is now open!   conf is Splunk’s rad annual ...

ICYMI - Check out the latest releases of Splunk Edge Processor

Splunk is pleased to announce the latest enhancements to Splunk Edge Processor.  HEC Receiver authorization ...