The force directed graph is a visualization in which the nodes of a graph are positioned in two or three dimensions by assigning the forces among the set of edges and set of nodes based on their relative positions. There are various types of algorithms available to implement force directed graphs.
As per Wiki, force directed graph has the following advantages due to which it is widely used for visualization of various types of datasets:
- Good quality results: For a mid-sized dataset, the force directed graph yields very good results based on criteria such as uniform edge length, vertex distribution, and symmetry
- Flexibility: Force directed graph gets easily adapted and extended to fulfil aesthetic requirements
- Simplicity: It is very simple to implement, and important inference and insights can be derived quickly for relatively larger datasets
Now, since we are acquainted with the force directed graph, let's see an example of the force directed graph. Then, later on, we can implement it on the Splunk dashboard.
The dataset is the same one that we used in the case of the Sankey diagram, which has information about user navigation from one page of the e-commerce portal to the other, along with the count of occurrence.
The subset of the dataset in a tabular format looks like the following screenshot:
The preceding tabular output when mapped to the force directed graph will look like the following diagram:
The preceding force directed graph helps a user derive the following inferences:
- The Cart page has only inward navigation, that is, users from other pages are navigating to the Cart page, but there is no outward navigation from the Cart page. Looking at it, the probable issues can be checked as to why users are not navigating from the Cart page and tackle it accordingly.
- Users are navigating to the Order-list page from the Offer, Checkout, Payment, and Home pages, which means that either user is trying to check the status of the order already placed or it may also happen that user is not able to locate the order in the order list. Similarly, such kinds of hidden insights can be quickly derived by just looking at the visualization of the force directed graph. This can be used on relatively large datasets, and hence, it is very useful.
Now, let's have a look at how we can implement the force directed graph on the Splunk dashboard.
The following are the steps to be taken in the Splunk dashboard to create a force directed visualization similar to the previous example:
- The force directed graph visualization uses a D3 extension similar to some of the visualizations already explained. Similarly, we will use the JS file (
forcedirected.js) from theforcedirecteddirectory of the app'sstaticfolder. The JS file needs to be copied to respective apps directly, similar to what we have already done in previous D3 visualizations. - We can modify the XML of the dashboard to include
autodiscover.jsas follows:<dashboard script="autodiscover.js">
- The following HTML code needs to be added in the panel of the XML dashboard where the visualization is required. Then, click on Save to get the visualization on the dashboard panel:
As in all the D3 extension supported visualizations, the search query and the relative path need to be modified as per the requirement to get the correct visualization on the Splunk dashboard. The previous code snippet results in the force directed graph visualization, which is explained in the preceding Example subsection.