Dashboards & Visualizations
Highlighted

Integrate highcharts.js or D3.js or charts.js into Splunk for advanced visualizations ?

Builder

Hi All,

I am currently looking for and want to evaluate various js charts into Splunk. I need suggestion what would be the best JS libraries to easily integrate with Splunk without much development efforts ? Also, I need to know what JD charts are licensed and which once are free, so that I can budget the requirements accordingly.

Also, how easy it would be to integrate without much knowledge on javascript and XML ? Please advise ? I can add more questions, once I get reply on this. Thanks.

0 Karma
Highlighted

Re: Integrate highcharts.js or D3.js or charts.js into Splunk for advanced visualizations ?

Legend

@pgadhari if you want to integrate something without coding JS and XML then you should search for Custom Visualizations that have already been built on Splunkbase: https://splunkbase.splunk.com/apps/#/search/Custom%20visualization/

If you can code JS and XML you can import D3, Highcharts and other JS libraries as Custom Visualizations using Splunk Custom Visualization API

Do let us know which custom visualization are you looking for.




| eval message="Happy Splunking!!!"


Highlighted

Re: Integrate highcharts.js or D3.js or charts.js into Splunk for advanced visualizations ?

Builder

@niketnilay - I have gone through most of the custom visualizations on Splunk base, but some of them only are applicable to my use cases so far. But, I am planning to show some advanced visualizations for the dashboards, so was thinking that whether I should go for licensed versions of Highcharts ?. I know :

  1. Chart.js is free, but how easy is to integrate it with Splunk ?
  2. Whether it is worth, buying licensed version of highcharts libraries ? whether this integration will be simple ?
  3. I am not sure whether D3.js is free or licensed ? do you have any idea on that ?

I can learn the JS and XML to further integrate above libraries, but I want to know which library to go for or buying licensed version will provide me support from highcharts for Splunk integration stuff ? Please advise ?

0 Karma
Highlighted

Re: Integrate highcharts.js or D3.js or charts.js into Splunk for advanced visualizations ?

SplunkTrust
SplunkTrust

Hi pgadhari,

You can create custom visualisations using any chart library you like. Splunk has some good examples for how to do this for example here: https://docs.splunk.com/Documentation/Splunk/7.2.3/AdvancedDev/CustomVizTutorial

I would say this is "easy" if you already have some javascript/web development experience, but its hard if you don't.

  • Don't pay for full version chart libraries until you have determined if it will work for you or not. Pretty much all chart libraries provide a trial version.
  • D3 is free
  • Paying for support to highcharts for example, they typically won't know how to integrate it with Splunk.

Maybe try ask another question asking more specifically about exactly you are trying to achieve. The user group here will probably be able to suggest good options to you.

All the best 🙂

View solution in original post

Highlighted

Re: Integrate highcharts.js or D3.js or charts.js into Splunk for advanced visualizations ?

Builder

ok thanks for that information. suppose I want to integrate one of the doughnut chart.js in Splunk ? can you help on how to do it from the scratch, as the javascript is already available for that ? I know there is a donut chart visualization, but in that I cannot do Semi-circule donut chart ? I am looking for semi-circle donut chart. Hence, please help as to how we can integrate this with Splunk ? Thanks.

https://www.chartjs.org/samples/latest/charts/doughnut.html

0 Karma
Highlighted

Re: Integrate highcharts.js or D3.js or charts.js into Splunk for advanced visualizations ?

SplunkTrust
SplunkTrust

Hi @pgadhari

I needed to sharpen my visualisation skills anyway, so I created an app for you. See screenshots and example usage here: https://github.com/ChrisYounger/semicircle_donut you can download the app from here: https://github.com/ChrisYounger/semicircle_donut/releases

I have submitted it to Splunkbase for approval so hopefully it will be approved on Monday.

Hope you find it helpful.
Chris.

Highlighted

Re: Integrate highcharts.js or D3.js or charts.js into Splunk for advanced visualizations ?

Builder

Thanks Chris. I will check it out and revert for any queries.

0 Karma
Highlighted

Re: Integrate highcharts.js or D3.js or charts.js into Splunk for advanced visualizations ?

Builder

@chrisyoungerjds - The semicircle_donut app is working fine. But I cannot do the drilldown on that ? How can we enable the drilldown option in it ?

0 Karma
Highlighted

Re: Integrate highcharts.js or D3.js or charts.js into Splunk for advanced visualizations ?

SplunkTrust
SplunkTrust

Hmm I'll need to look into that for you. Ill try add the functionality in the next couple of days.

0 Karma
Highlighted

Re: Integrate highcharts.js or D3.js or charts.js into Splunk for advanced visualizations ?

Builder

Sure thanks. But appreciate - if it can be done early.

Also can you let me know the steps you did for integrating that semicircle_donut into Splunk ? I am also trying to integrate some of the charts.js into Splunk.

0 Karma