What is a Graph Data Viz?

A graph visualization is a way of representing data as a network of nodes (points) and edges (connections).
Nodes usually represent entities such as users, servers, IP addresses.
Edges show how those entities are related, such as network traffic, logins, or data transfers.
Instead of looking at rows of events, a graph visualization lets you see relationships and patterns at a glance.

Why is it useful in Splunk?

Splunk is excellent at searching and aggregating event data, but sometimes the most important insights are hidden in the connections between events. A graph view helps you:
Spot anomalies quickly — like unexpected connections between users and systems.
Understand flows — for example, how a transaction or process moves step by step.
Explore data interactively — zoom, pan, or filter nodes to follow connections.
Communicate clearly — graphs make complex relationships easier to explain to others.

Example Use Cases

Security: Visualize authentication flows to detect suspicious logins.
IT Operations: Map communication between services or servers to find bottlenecks.

Key Features

The visualization allows interaction with the graph. There are three different menus available via a right click on a node, an edge or the background

Node Menu

Centre, this centers the graph around the selected node, making it larger and easier to read.
Highlight Neighbors, this highlights either directly connected nodes or nodes connected via a specified number of hops. Note the maximum number of hops you can specify is set in the macro to create the graph.
Highlight Matching, this will highlight any node that has the attribute value selected in the sub menu.
View all Attributes, will show a pop up of all the Attributes relevant to the selected node.
Display Details, will display a pop up of the contents of the displayDetails field (like a tooltip) if set for the selected node.
Reset, resets all highlighting and resets the view to the entire graph.

Edge Menu

Highlight Connect Nodes, will highlight only the nodes connected by this edge. In large graphs it can be difficult to see where a connection goes.
Highlight Matching Edges, will highlight edges and the nodes connected to them that match the selected attribute value.
Display Details, will display a pop up of the contents of the displayDetails field (like a tooltip) if set for the selected edge.
Reset, resets all highlighting and resets the view to the entire graph.

Background Menu

Filter, displays a sub menu of all of the Attributes. Selecting an Attribute displays a pop up that allows full filtering selection. Once set the graph is filtered to highlight only matching nodes.
Find a Node, displays a pop up allowing selection of a specific node, or nodes matching a text string. Once selected all nodes matching the criteria are highlighted
Show Visible Node List, for the currently highlighted node selection this shows a pop up list of those nodes that can be viewed or copied.
Reset, resets all highlighting and resets the view to the entire graph.

Getting Started

Installation

The app can be found on Splunkbase and installed directly from the UI

Configuration

To display a graph of your data you need to create a table of results that includes 2 different types of rows.

Node Rows

Several rows that contain the information about the entities you want to graph.
The required columns are;
type - must be node.
id - a short key id field, it must not contains spaces or special characters.
label - a short text description that is visible on the node in the graph. Can include spaces and new lines using \n.
Optional columns are;
nodeColor - can be a simple text name (black, blue, white etc.) or a hex value (#006600, #03586c etc.). Note the # must be included. Default value=#006600.
height - can either be auto (the height of the node will match the label height). Default value=auto.
width - can either be auto (the width of the node will match the label width). Default value=auto.
nodeShape - can be ellipse, rectangle, round-triangle, cut-rectangle, barrel, diamond, star, pentagon etc. Default value=round-rectangle.
fontColor - can be a simple text name (black, blue, white etc) or a hex value (#006600, #03586c etc). Note the # must be included. Default value=white.
fontFamily - example values (Helvetica, Arial etc). Default value =Helvetica.
fontSize - a value in pixels. Default value=24.
textWrap - sets if the text should wrap or not. Default value=wrap.
advanced - can be used to utilize further cytoscape options. See the cytoscape documentation for options. An example might be "border-color": "blue", "border-width": "4". No default
displayDetails - a longer text field for data that can be displayed in a pop up modal from the node menu. Cannot include "s unless escaped. No default.
url - can be used to connect to an external link (use https://... or http://.. for an external link) or to splunk knowledge object (note that the current url is prepended). No default.
Att* - Any node can have zero or many attributes. This are relevant data that you may want to filter the graph by. Attributes are added using the format Attxx_ where xx is a two digit sequential number starting at 01 and is a unique name without spaces. No default.

Edge Rows

Several rows that contain the information about the connections between nodes.
The required columns are;
type - must be edge.
source - the id of the node you want to connect from.
target - the id of the node you want to connect to.
Optional columns are;
label - a short text description that is visible on the edge in the graph. No default.
edgeColor - can be a simple text name (black, blue, white etc) or a hex value (#006600, #03586c etc). Note the # must be included. Default value=grey.
edgeFontBackgroundColor - can be a simple text name (black, blue, white etc) or a hex value (#006600, #03586c etc). Note the # must be included. Default value=white.
edgeFontBackgroundTransparent - can be 0 for transparent or 1 for filled. Default value=0.
edgeStyle - options of solid, dashed dotted. Default value=solid.
width - a numeric value. Default value=1.
fontColor - can be a simple text name (black, blue, white etc) or a hex value (#006600, #03586c etc). Note the # must be included. Default value=white.
fontFamily - example values (Helvetica, Arial etc). Default value=Helvetica.
fontSize - a value in pixels. Default value=24.
textWrap - sets if the text should wrap or not. Default value=wrap.
advanced - can be used to utilize further cytoscape options. See the cytoscape documentation for options. An example might be "source-label": "text label".

Macros

Once you have your SPL data formatted correctly you can simply add one of three macros to convert your data into the required Json format;
convertGraphCose(4)
convertGraphCircle(4)
convertGraphGrid(4)

The required marco parameters are;
levels - is the number of hops you want to be able to filter on (9 is the max, 5 is a good starting value)
nodeRepulsion - how much nodes push apart (start with 500 and increase for larger graphs).
edgeElasticity - how tight connections pull nodes together (start with 100 and increase for larger graphs).
gravity - how strongly everything is held toward the middle (start with 1 and increase for larger graphs).

So an example to use the cose layout on a smaller graph
convertGraphcose(4,500,100,0.5)

Further Settings

For more settings and formatting options refer to the cytoscape.js documentation.
https://js.cytoscape.org/#style

Octamis Visualization App Graph Data Viz

0