Dashboards & Visualizations

How to put webpage (index.html, sankey.js and data.csv) into Splunk dashboard

sssignals
Path Finder

Hi Splunk Community,

I chanced upon a excellent link (http://plnkr.co/edit/4xPx05PxnWxoQBhIj2lo?p=preview) that is very near to what I want to have in my Splunk dashboard ie. a Sankey diagram that changes color according to the value of 1 column as well as many fantastic examples in Mike Bostock d3 example page. For example, they have a index.html, data.csv and sankey.js that when I run http-server, the webpage shows index.html and my sankey diagram is there!!! =D The example in this case differs from the Splunk-dashboard-examples where there is a sankey-helper.js file. And I want to not restrict to those limited examples in the long run.

I wanted to have the same sankey diagram in a Splunk dashboard or at least click on some chart that will link me to the sankey diagram on another dashboard. I tried to copy and paste the index.html into html Splunk dashboard and of course, to no success.

Is it a straight forward to put d3 visualizations into Splunk dashboard? Pls advise.

Thanks for your attention.

0 Karma

koshyk
Super Champion

hi,
the best and the quickest way to do is to download
1. Splunk Dashboard Examples app from here . This app has got a nice example of Sankey chart with sample dataset
2. Download the Sankey Diagram app from here. This provides with the js/css etc. which are required for Sankey d3
3. Change your dataset/dashboard similar using (1) & (2) using sample dataset. Now extend this to your dataset.

0 Karma

niketn
Legend

@sssignals, have you tried Sankey Diagram Custom Visualization from Splunkbase: https://splunkbase.splunk.com/app/3112/

You can include d3 visualization in your Splunk App by leveraging Splunk Custom Visualization API (Above Sankey Custom visualization app is also based upon the same). Refer to the Splunk Documentation with an Example: http://docs.splunk.com/Documentation/Splunk/latest/AdvancedDev/CustomVizTutorial

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"
0 Karma
Get Updates on the Splunk Community!

Splunk Observability Cloud | Unified Identity - Now Available for Existing Splunk ...

Raise your hand if you’ve already forgotten your username or password when logging into an account. (We can’t ...

Index This | How many sides does a circle have?

February 2024 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with another ...

Registration for Splunk University is Now Open!

Are you ready for an adventure in learning?   Brace yourselves because Splunk University is back, and it's ...