topic Re: How to embed a timechart visualization from a Splunk query into a web app? in Splunk Search

How to embed a timechart visualization from a Splunk query into a web app?

emiliavanderwer — Thu, 30 Aug 2018 15:06:56 GMT

I have the following Splunk query that produces the following visualization:

I would like to embed this exact visualization into a web app using an iframe. How can I do this?

Currently, I am using the Splunk HTTP REST API and can submit & get the results back from this search using the following endpoint:
/servicesNS/nameofmyapp/nameofmynamespace/search/jobs/1535641234.45678?output_mode=json

However, I would like a src URL to the visualization that can be embedded in an iframe. Is there an endpoint that I can query instead that will give the URL to the visualization?

Re: How to embed a timechart visualization from a Splunk query into a web app?

aromanauskas — Thu, 30 Aug 2018 17:03:18 GMT

You have two basic options for providing visual data in an external application with Splunk.

Option 1: Grab the data with directly from a job. Then using a local application turn that data into a visualization.

Option 2: Use the SplunkJS Framework. To both pull the data from Splunk and create the visualization.

Option 2 in my opinion is a little bit easier since you don't need to learn how to convert the data to be usable by whatever viz tool you're going to choose, ie (Ds3.js). You can either jump over to the SplunkJS manual, or there is a really simple version in
"Learning Splunk Web Framework" by Vincent Sesto/Packt Pub 9781786462947 .

The basics though are:

Install a websever Nginx or Apache
Configure a proxy between the webserver and Splunk
Install the SplunkJS SDK
Add HTML / JS for search
Add HTML / JS for charts

Re: How to embed a timechart visualization from a Splunk query into a web app?

emiliavanderwer — Thu, 30 Aug 2018 17:11:34 GMT

Thank you for your response. Option 2 is a little bit complicated because the web app is ASP.NET and written in C#. The way we have our current framework is we wrote a custom C# Splunk SDK that grabs the data.

Is there any way to pull the data from Splunk within our C# SDK and pass the data to the SplunkJS framework to create the visualization (instead of letting the SplunkJS SDK do both of the steps)?

Re: How to embed a timechart visualization from a Splunk query into a web app?

mstjohn_splunk — Thu, 30 Aug 2018 17:28:39 GMT

hey @emiliavanderwerf , Looks like @aronmanauskas answered your question! What a nice user. Would you mind tossing them a like? Our users live for those likes 🙂

Re: How to embed a timechart visualization from a Splunk query into a web app?

emiliavanderwer — Thu, 30 Aug 2018 17:30:08 GMT

Liked. Thanks!

Re: How to embed a timechart visualization from a Splunk query into a web app?

aromanauskas — Thu, 30 Aug 2018 18:17:14 GMT

If you are using a homegrown C# SDK or the Splunk C# SDK then there are a few options.

Option 1, use D3.js for the visualization:
ASP example for D3

Option 2, convert OR incorporate the Splunk C# SDK which has the ability to create charts. Timeline for example: Charting Adapter