All Apps and Add-ons

How to edit Treemap custom visualization using jquery/javascript?

mjlsnombrado
Communicator

Hi all,

How can I edit custom visualization properties/ add class for treemap, what are the classes needed to be included.
Thanks in advance.

require([
             'underscore',
             'jquery',
             'splunkjs/mvc',
             'splunkjs/mvc/tableview',
             'splunkjs/mvc/simplexml/ready!'
         ], function(_, $, mvc, TableView) {

               **codes**
});
0 Karma
1 Solution

niketn
Legend

@mjlsnombrado, Treemap Custom Visualization is built by Splunk so if there is an issue or enhancement you can also check with Splunk. If you want to make the changes yourself, you will have to edit the following file (this is the compiled version of JS file for the visualization).

$SPLUNK_HOME/Splunk/etc/apps/treemap_app/appserver/static/visualizations/treemap/visualization.js

To refer to how to build Custom Visualization through Custom Visualization API you should refer to the following documentation: https://docs.splunk.com/Documentation/Splunk/latest/AdvancedDev/CustomVizTutorial

Original Source Code is placed under the following path (however, if you make changes to this file, you will have to have all dependent libraries and recompile the complete code. So you should use this code only to understand as to which section does what and where the changed need to be made): $SPLUNK_HOME/Splunk/etc/apps/treemap_app/appserver/static/visualizations/treemap/treemap.js

Even if you make the changes to visualization.js and get it to work, you will need keep the list of changes so that in case there is an upgrade, you would need to sync the code changes manually.

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

View solution in original post

niketn
Legend

@mjlsnombrado, Treemap Custom Visualization is built by Splunk so if there is an issue or enhancement you can also check with Splunk. If you want to make the changes yourself, you will have to edit the following file (this is the compiled version of JS file for the visualization).

$SPLUNK_HOME/Splunk/etc/apps/treemap_app/appserver/static/visualizations/treemap/visualization.js

To refer to how to build Custom Visualization through Custom Visualization API you should refer to the following documentation: https://docs.splunk.com/Documentation/Splunk/latest/AdvancedDev/CustomVizTutorial

Original Source Code is placed under the following path (however, if you make changes to this file, you will have to have all dependent libraries and recompile the complete code. So you should use this code only to understand as to which section does what and where the changed need to be made): $SPLUNK_HOME/Splunk/etc/apps/treemap_app/appserver/static/visualizations/treemap/treemap.js

Even if you make the changes to visualization.js and get it to work, you will need keep the list of changes so that in case there is an upgrade, you would need to sync the code changes manually.

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"
Got questions? Get answers!

Join the Splunk Community Slack to learn, troubleshoot, and make connections with fellow Splunk practitioners in real time!

Meet up IRL or virtually!

Join Splunk User Groups to connect and learn in-person by region or remotely by topic or industry.

Get Updates on the Splunk Community!

Data Management Digest – September 2026

    Welcome to the September 2026 edition of Data Management Digest! September brought a fresh wave of ...

Federated Search for CloudWatch Unified Data Store Is Generally Available

As organizations modernize their cloud environments, AWS workloads generate more security, operational, and ...

Announcing Modern Navigation: A New Era of Splunk User Experience

We are excited to introduce the Modern Navigation feature in the Splunk Platform, available to both cloud and ...