Community Blog
Get the latest updates on the Splunk Community, including member experiences, product education, events, and more!

Buttercup Games: Further Dashboarding Techniques (Part 5)

ITWhisperer
SplunkTrust
SplunkTrust

This series of blogs assumes you have already completed the Splunk Enterprise Search Tutorial as it uses the same dataset that you will have already downloaded and ingested into Splunk. If not, please go to the Tutorial and complete it (or at least download and ingest the dataset).

This is the fifth blog in the series, and builds on the dashboard created in the previous blogs.

Investigating the detail

In this section, you will use the dashboard to investigate the detail behind the chart and extend the dashboard to provide a deeper understanding of selections of the data.

Zooming in and panning around

With a timechart, you can use the "pan and zoom" chart controls (See Splunk documentation for full details.), to zoom in on areas of interest in the chart.

  • Click and drag a selection box on the chart over a period of time, say, for example, from 8pm on Sunday to 8am on MondayThis screen image shows the drag box selecting 8pm to 8am.This screen image shows the drag box selecting 8pm to 8am.This screen image shows the chart zoomed in between 8pm and 8am.This screen image shows the chart zoomed in between 8pm and 8am.

You can use the pan left and pan right buttons to move the selection window to earlier or later times.

By using the selection box, you have effectively defined earliest and latest time boundaries for the area of your data that you are interested in.

Setting up a zoom selection handler

The column chart that you are using supports a zoom selection handler, which you will now set up to save the $start$ and $end$ tokens which identify the time selected. These tokens will be used later in another panel.

  • Click on Edit
  • Click on the Source button
  • Insert the following lines into the search stanza for the chart:

 

<selection>
    <eval token="zoom.earliest">$start$</eval>
    <eval token="zoom.latest">$end$</eval>
    <eval token="zoom.period">"from ".strftime($zoom.earliest$,"%F %H:%M")." to ".strftime($zoom.latest$,"%F %H:%M")</eval>
</selection>​

 

This screen image shows the selection handler stanza.This screen image shows the selection handler stanza.

  • Save the updated dashboard.
    By adding a selection handler, the zoon selection visualization behaviour changes. Try selecting the same time window.This screen image shows the chart zoomed in between 8pm and 8am with a selection handler.This screen image shows the chart zoomed in between 8pm and 8am with a selection handler.

The purpose of the selection is to define a timeframe for a search in another panel; however, we only want the extra panel to be visible when a zoom selection has been made. This is done simply with the depends attribute on the panel (or row containing the panel). In order to do this, you need to be able to determine when no selection has been made or the zoom has been reset. For this, you need to determine the minimum and maximum values that might be returned by the selection.

Again, this can be done by using a couple more hidden fields in the result set.

  • Click on Edit
  • Click on Edit search of the Hourly Success Rates panel, update as below and Apply

 

sourcetype=access_combined_wcookie
| timechart span=1h count by status
| addtotals row=t fieldname=_total
| foreach *
    [| eval <<FIELD>>=round(100*'<<FIELD>>'/_total,2)]
| eval threshold=85
| eventstats count(eval('200'<85)) as _breaches count as _total
| eval _failure_rate=round(100*_breaches/_total,2)
| eval _panel_colour=case(_failure_rate < 15, "#00ff00", _failure_rate < 20, "#80ff00", _failure_rate < 25, "#ffff00", _failure_rate < 30, "#ff8000", true(), "#ff0000")
| eval _text_colour=case(_failure_rate < 15, "black", _failure_rate < 20, "black", _failure_rate < 25, "black", _failure_rate < 30, "white", true(), "white")
| eventstats min(_time) as _earliest max(_time) as _latest
| eval _latest=relative_time(_latest,"+1h")​

 

Note the addition of an extra hour to the maximum value of _time field; this is because the results are in 1 hour buckets and the maximum value for _time will be the beginning of the final bucket, and the end of the bucket is required.

  • While still in edit mode, click on the Source button
  • Modify the done handler in the search stanza for the chart to assign the timeframe values to tokens

 

<done>
    <set token="failure_rate">$result._failure_rate$</set>
    <set token="panel_colour">$result._panel_colour$</set>
    <set token="text_colour">$result._text_colour$</set>
    <set token="beginning">$result._earliest$</set>
    <set token="ending">$result._latest$</set>
</done>

 

This screen image shows the done handler setting the timeframe tokens.This screen image shows the done handler setting the timeframe tokens.

  • Modify the selection handler for the chart to set the earliest and latest values depend on whether a selection has been made. This is determined by whether the $start$ and $end$ tokens match the chart's timeframe ($beginning$ and $ending$).

 

<selection>
    <eval token="zoom.earliest">if($start$ = $beginning$ and $end$ = $ending$, null(), $start$)</eval>
    <eval token="zoom.latest">if($start$ = $beginning$ and $end$ = $ending$, null(), $end$)</eval>
    <eval token="zoom.period">"from ".strftime($zoom.earliest$,"%F %H:%M")." to ".strftime($zoom.latest$,"%F %H:%M")</eval>
</selection>​

 

This screen image shows the updated selection handler stanza.This screen image shows the updated selection handler stanza.Note that setting zoom.earliest and zoom.latest tokens to null() is the same as unsetting them and means that the row which depends on these tokens will be hidden, and the search contained within the panel will not execute. (Details shown in the next part of the series.)

  • Save the updated dashboard.This screen image shows the hourly status rates chart with coloured title depending on breach rate.This screen image shows the hourly status rates chart with coloured title depending on breach rate.

Next step is to go on to part 6 where you will add a new panel which is driven by the selections the user has made.

Get Updates on the Splunk Community!

Brains, Bytes, and Boston: Learn from the Best at .conf25

When you think of Boston, you might picture colonial charm, world-class universities, or even the crack of a ...

Splunk AppDynamics Agents Webinar Series

Mark your calendars! On June 24th at 12PM PST, we’re going live with the second session of our Splunk ...

SplunkTrust Application Period is Officially OPEN!

It's that time, folks! The application/nomination period for the 2025 SplunkTrust is officially open! If you ...