How to implement flame graphs using Splunk?

[rajgowd1]

Hi,
what are the ways to implement flame graphs in Splunk?

do we have any examples to implement flame graphs in Splunk?

[jeffland]

There's now a modular viz on splunkbase from @dohrendorf_consist you should check out 🙂

[kmccririe_splun · Accepted solution]

You can use a D3 javascript visualization here is one for a flame graph https://github.com/spiermar/d3-flame-graph.

We have some examples of using D3 visualizations in Splunk if you download the 6.x dashboard examples app https://splunkbase.splunk.com/app/1603/. There are some examples of using different D3 visualizations. However, I haven't seen any for flame graphs.

This will probably require a bit of knowledge about javascript.

[rajgowd1]

thank you.can you help us some search queries to display graphs in flames.

[kmccririe_splun]

I was afraid you would ask that :P. I will try to get one working in my spare time. I will let you know!

[jeffland]

Hi,

I was intrigued to find a solution, and together with my colleague @dohrendorf_consist we came up with the following. It's only in a proof of concept stage so far, not tested and probably full of bugs 🙂

You generate data using search with stats by, so that all your split-by fields can later represent a level in the hierarchy of the visualization. For example, you can use

index=_internal | fillnull value="-" group name | stats count by host sourcetype group name

The data should only contain one metric, so no more than one count or avg(something). As kmccririe noted, some javascript is indeed needed to convert the search results to JSON which can then be used by the visualization. See the pastebin code appended; it assumes you have the file d3.v3.min.js located in your appserver/static folder of your app next to the file containing the code, and it is also where the css file should reside. You will have to include this custom code along with the flame graph css in your dashboard, your first line of Simple XML could look something like this:

<dashboard script="flameGraphCustomJsCode.js" stylesheet="d3.flameGraph.css">

d3 js from https://d3js.org/d3.v3.min.js
flame graph css from https://raw.githubusercontent.com/spiermar/d3-flame-graph/master/src/d3.flameGraph.css
js code: http://pastebin.com/2n8UaxnZ

This is what it looks like with splunk data:

Feel free to ask any questions!