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

Buttercup Games: Further Dashboarding Techniques (Part 9)

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 ninth blog in the series, and builds on the dashboard created in the previous blogs.

Comparing the last 24 hours with previous rate

Having got the hourly rates from the events access log, you can now compare the last 24 hours to previous 24 hour periods using the timewrap command.

  • Click on Edit
  • Click on Edit search of the Success rate compared to highest and lowest hourly rate panel, update as below and Apply

 

sourcetype=access_combined_wcookie
    [| tstats min(_time) as earliest max(_time) as latest where sourcetype=access_combined_wcookie]
| timechart span=1h count by status
| addtotals row=t fieldname=total
| where total > 0
| eval success=round(100*'200'/total,2)
| timechart values(success) as success span=1h
| timewrap 24h​

 

Note the addition of a subsearch to determine the earliest and latest times present in the data; this is because the timewrap command uses the latest time from the search timeframe to determine where to wrap back from. We use tstats here for speed and efficiency since we only need the _time field from the events.
Also note the table command has been replaced by a timechart command just before the timewrap command; this prevents a warning error message from appearing.This screen image shows the update success rate search with timewrap.This screen image shows the update success rate search with timewrap.

 This screen image shows the success rate chart with timewrap.This screen image shows the success rate chart with timewrap.

This chart is very busy, so let's modify the search again to reduce the number of lines.

  • Click on Edit search of the Success rate compared to highest and lowest hourly rate panel again, update as below and Apply

 

sourcetype=access_combined_wcookie
    [| tstats min(_time) as earliest max(_time) as latest where sourcetype=access_combined_wcookie]
| timechart span=1h count by status
| addtotals row=t fieldname=total
| where total > 0
| eval success=round(100*'200'/total,2)
| timechart values(success) as success span=1h
| timewrap 24h
| untable _time day success
| appendpipe
    [| stats min(success) as success by _time
    | eval day="min_success"]
| appendpipe
    [| stats max(success) as success by _time
    | eval day="max_success"]
| where in(day, "min_success", "max_success", "success_latest_24hours")
| xyseries _time day success
| rename success_latest_24hours as success

 

Note the use of untable and xyseries to take the event pipeline out of chart layout and back again. The appendpipe commands process the event pipeline to provide minimum and maximum aggregations for each time bucket.This screen image shows the update success rate search with min and max hourly success rates.This screen image shows the update success rate search with min and max hourly success rates.

 This screen image shows the success rate chart with timewrap.This screen image shows the success rate chart with timewrap.

 Now we have the lines we want, you can use a hidden feature of the line chart to enhance the visualization.

  • Click on Edit search of the Success rate compared to highest and lowest hourly rate panel again, update as below and Apply

 

sourcetype=access_combined_wcookie
    [| tstats min(_time) as earliest max(_time) as latest where sourcetype=access_combined_wcookie]
| timechart span=1h count by status
| addtotals row=t fieldname=total
| where total > 0
| eval success=round(100*'200'/total,2)
| timechart values(success) as success span=1h
| timewrap 24h
| untable _time day success
| appendpipe
    [| stats min(success) as success by _time
    | eval day="min_success"]
| appendpipe
    [| stats max(success) as success by _time
    | eval day="max_success"]
| where in(day, "min_success", "max_success", "success_latest_24hours")
| xyseries _time day success
| rename success_latest_24hours as success
| eval _lower="min_success"
| eval _upper="max_success"
| eval _predicted="success"

 

Note the use of _lower_upper and _predicted hidden fields. These fields are recognised by the line chart visualization to modify how the chart is displayed and are also generated by the predict command.This screen image shows the update success rate search with _lower, _upper and _predicted field references.This screen image shows the update success rate search with _lower, _upper and _predicted field references.

This screen image shows the success rate chart with lower, upper and predicted lines.This screen image shows the success rate chart with lower, upper and predicted lines.

 All that remains is for you to format the chart so that useful information takes up more of the visualization real-estate.

  • While still in edit mode, click on the Source button
  • Extend the search query of the Success rate compared to highest and lowest hourly rate panel to calculate the lower bound of the y-axis, by adding the following lines:

 

| eventstats min(min_success) as _lowest_success
| eval _lowest_success=10*floor((_lowest_success-5)/10)​

 

Note that the lower bound is rounded down to leave some space below the lowest value of success rate.

  • Add a done handler in the search stanza for the chart to assign the lower y-axis bound to a token

 

<done>
    <set token="lowesty">$result._lowest_success$</set>
</done>​

 

This screen image shows the done handler setting the lower y-axis bound token.This screen image shows the done handler setting the lower y-axis bound token.

  • Add the charting options to assign the minimum and maximum y-axis bounds.

 

<option name="charting.axisY.maximumNumber">100</option>
<option name="charting.axisY.minimumNumber">$lowesty$</option>​

 

This screen image shows the charting options setting the y-axis bounds.This screen image shows the charting options setting the y-axis bounds.

  • Give the panel an id and add some styling

 

<panel id="success_rate">
  <title>Success rate compared to highest and lowest hourly rate</title>
  <html depends="$alwaysHide$">
    <style>
      #success_rate .dashboard-panel
      {
        background-color: black !important;
        text-align: center;
      }
      #success_rate h2.panel-title
      {
        color: white !important;
      }
    </style>
  </html>​

 

This screen image shows the success rate chart styling.This screen image shows the success rate chart styling.

  • Remove the titles from the x-axis and y-axis

 

<option name="charting.axisTitleX.visibility">collapsed</option>
<option name="charting.axisTitleY.visibility">collapsed</option>​

 

This screen image shows the success rate chart styling.This screen image shows the success rate chart styling.

  • Save the updated dashboard.This screen image shows the completed dashboard.This screen image shows the completed dashboard.

This final dashboard demonstrates a number of techniques which can be applied in other scenarios and usecases. Good luck applying them in your own dashboards.

Get Updates on the Splunk Community!

See your relevant APM services, dashboards, and alerts in one place with the updated ...

As a Splunk Observability user, you have a lot of data you have to manage, prioritize, and troubleshoot on a ...

Cultivate Your Career Growth with Fresh Splunk Training

Growth doesn’t just happen—it’s nurtured. Like tending a garden, developing your Splunk skills takes the right ...

Introducing a Smarter Way to Discover Apps on Splunkbase

We’re excited to announce the launch of a foundational enhancement to Splunkbase: App Tiering.  Because we’ve ...