Dashboards & Visualizations

SVG Custom visualization - drilldown or setting a token

tomaszwrona
Explorer

Hi all,

 

i have used the SVG Custom Visualisation to create a nice picture.

Now i would like to have a drilldown or at least a possibility to set a token, when a part of the picture is clicked on. Is there a way to achieve this? Any hint would be great.

 

Best regards

Tomasz

Labels (2)
0 Karma

tomaszwrona
Explorer

Hi all,

i did manage to answer my own question.

In order to use tokens in SVG Visualization following steps should be taken:

  1. Extend Simple XML Dashboard with Javascript
  2. Put an id on Splunk's default element, for example panel:
    <panel id="svgViz">
  3. Put an id on any SVG element you want to click on, for example g:
    <g id="myId" filter="url(#Shadow)">
  4. In Javascript get the panel:
    var my_panel = $("#svgViz");
  5. And then create onClick function to set myNewToken:
    my_panel.on("click", "#myId", function(e) {
      var default_tokens = mvc.Components.get("submitted");
      default_tokens.set("myNewToken", "value");
    });

 

Best regards

Tomasz

0 Karma
Career Survey
First 500 qualified respondents will receive a $20 gift card! Tell us about your professional Splunk journey.

Can’t make it to .conf25? Join us online!

Get Updates on the Splunk Community!

Take Action Automatically on Splunk Alerts with Red Hat Ansible Automation Platform

 Are you ready to revolutionize your IT operations? As digital transformation accelerates, the demand for ...

Calling All Security Pros: Ready to Race Through Boston?

Hey Splunkers, .conf25 is heading to Boston and we’re kicking things off with something bold, competitive, and ...

Beyond Detection: How Splunk and Cisco Integrated Security Platforms Transform ...

Financial services organizations face an impossible equation: maintain 99.9% uptime for mission-critical ...