All Apps and Add-ons

Configuring drilldown in Sunburst Viz & Number Display Viz?

Contributor

Loving this viz and the Number Display viz. However, I'm having a problem getting drilldowns to work.

If I set the drilldown to Link to Search, on clicking a value, it runs the basic search and selects the value clicked on. I haven't been able to create a working token to send to a search on the same dashboard.

There's a setting in General / Click action : set tokens to $sunburst_viz_{field}$ and I've assigned that to a form.field_name, but on clicking the field value in the Sunburst, the search will search on the literal variable set in the token.

How is the drilldown supposed to work with Sunburst and Number Display?

Thank you!

0 Karma
1 Solution

SplunkTrust
SplunkTrust

Hi @manderson7

OK So with Number Display viz, You can pass in a field called "drilldown" that you can set to whatever you want. Then in Splunk UI > Drilldown settings, just leave this blank. On another panel or in another search you can just use $row.drilldown$ or you can also use $row.title$ (if that field is in your original data).

Here is a working example:

<form theme="dark">
  <label>Number display viz setting token</label>
  <row>
    <panel>
      <viz type="number_display_viz.number_display_viz">
        <search>
          <query>
| makeresults count=10
| streamstats count as id
| eval title = "Item " + id, value = "50%", drilldown = "your unique key if you want " + id 
| table title subtitle value drilldown</query>
        </search>
        <option name="drilldown">none</option>
        <option name="number_display_viz.number_display_viz.bordercolor">#FFFFFF</option>
        <option name="number_display_viz.number_display_viz.bordersize">2</option>
        <option name="number_display_viz.number_display_viz.colorprimary">#000000</option>
        <option name="number_display_viz.number_display_viz.colorprimarymode">auto</option>
        <option name="number_display_viz.number_display_viz.colorsecondary">#000000</option>
        <option name="number_display_viz.number_display_viz.colorsecondarymode">auto</option>
        <option name="number_display_viz.number_display_viz.max">100</option>
        <option name="number_display_viz.number_display_viz.min">0</option>
        <option name="number_display_viz.number_display_viz.nodatacolor">#0178c7</option>
        <option name="number_display_viz.number_display_viz.padding">8</option>
        <option name="number_display_viz.number_display_viz.pulserate">0</option>
        <option name="number_display_viz.number_display_viz.shadowcolor">#F2F4F5</option>
        <option name="number_display_viz.number_display_viz.shapebordercolor">#000000</option>
        <option name="number_display_viz.number_display_viz.shapebordercolormode">darker1</option>
        <option name="number_display_viz.number_display_viz.shapebordersize">1</option>
        <option name="number_display_viz.number_display_viz.shapedropcolor">#ffffff</option>
        <option name="number_display_viz.number_display_viz.shapeshadow">no</option>
        <option name="number_display_viz.number_display_viz.shapetexture">texture3</option>
        <option name="number_display_viz.number_display_viz.size">250</option>
        <option name="number_display_viz.number_display_viz.sparkHeight">30</option>
        <option name="number_display_viz.number_display_viz.sparkWidth">95</option>
        <option name="number_display_viz.number_display_viz.sparkalign">3</option>
        <option name="number_display_viz.number_display_viz.sparkalignv">62</option>
        <option name="number_display_viz.number_display_viz.sparkcolorfill">#009DD9</option>
        <option name="number_display_viz.number_display_viz.sparkcolorline">#0178c7</option>
        <option name="number_display_viz.number_display_viz.sparkcolormodefill">darker1</option>
        <option name="number_display_viz.number_display_viz.sparkcolormodeline">darker2</option>
        <option name="number_display_viz.number_display_viz.sparkmax">100</option>
        <option name="number_display_viz.number_display_viz.sparkmin">0</option>
        <option name="number_display_viz.number_display_viz.sparknulls">gaps</option>
        <option name="number_display_viz.number_display_viz.sparkorder">fg</option>
        <option name="number_display_viz.number_display_viz.sparkstyle">area</option>
        <option name="number_display_viz.number_display_viz.spinnerspeedmax">20</option>
        <option name="number_display_viz.number_display_viz.spinnerspeedmin">1</option>
        <option name="number_display_viz.number_display_viz.style">a3</option>
        <option name="number_display_viz.number_display_viz.subtitlealign">center</option>
        <option name="number_display_viz.number_display_viz.subtitlealignv">45</option>
        <option name="number_display_viz.number_display_viz.subtitlecolor">#C6C6C6</option>
        <option name="number_display_viz.number_display_viz.subtitlecolormode">static</option>
        <option name="number_display_viz.number_display_viz.subtitledrop">no</option>
        <option name="number_display_viz.number_display_viz.subtitledropcolor">#ffffff</option>
        <option name="number_display_viz.number_display_viz.subtitlefont">number_display_viz-thin</option>
        <option name="number_display_viz.number_display_viz.subtitlesize">50</option>
        <option name="number_display_viz.number_display_viz.textalign">center</option>
        <option name="number_display_viz.number_display_viz.textalignv">70</option>
        <option name="number_display_viz.number_display_viz.textcolor">#000000</option>
        <option name="number_display_viz.number_display_viz.textdrop">yes</option>
        <option name="number_display_viz.number_display_viz.textdropcolor">#919191</option>
        <option name="number_display_viz.number_display_viz.textduration">300</option>
        <option name="number_display_viz.number_display_viz.textmode">static</option>
        <option name="number_display_viz.number_display_viz.textprecision">1</option>
        <option name="number_display_viz.number_display_viz.textprocessing">abr1</option>
        <option name="number_display_viz.number_display_viz.textsize">100</option>
        <option name="number_display_viz.number_display_viz.textunitposition">after</option>
        <option name="number_display_viz.number_display_viz.textunitsize">50</option>
        <option name="number_display_viz.number_display_viz.thickness">50</option>
        <option name="number_display_viz.number_display_viz.thresholdcol1">#1a9035</option>
        <option name="number_display_viz.number_display_viz.thresholdcol2">#d16f18</option>
        <option name="number_display_viz.number_display_viz.thresholdcol3">#b22b32</option>
        <option name="number_display_viz.number_display_viz.thresholdcol4">#ffffff</option>
        <option name="number_display_viz.number_display_viz.thresholdcol5">#ffffff</option>
        <option name="number_display_viz.number_display_viz.thresholdcol6">#ffffff</option>
        <option name="number_display_viz.number_display_viz.thresholdsize">20</option>
        <option name="number_display_viz.number_display_viz.thresholdval2">70</option>
        <option name="number_display_viz.number_display_viz.thresholdval3">90</option>
        <option name="number_display_viz.number_display_viz.titlealign">center</option>
        <option name="number_display_viz.number_display_viz.titlealignv">25</option>
        <option name="number_display_viz.number_display_viz.titlecolor">#ffffff</option>
        <option name="number_display_viz.number_display_viz.titlecolormode">static</option>
        <option name="number_display_viz.number_display_viz.titledrop">no</option>
        <option name="number_display_viz.number_display_viz.titledropcolor">#ffffff</option>
        <option name="number_display_viz.number_display_viz.titlesize">80</option>
        <option name="refresh.display">progressbar</option>
      </viz>
    </panel>
  </row>
  <row>
    <panel>
      <title>you clicked item: $row.drilldown$  ($$row.title$$ token is now = $row.title$)</title>
    </panel>
  </row>
</form>

View solution in original post

SplunkTrust
SplunkTrust

Hi @manderson7

OK So with Number Display viz, You can pass in a field called "drilldown" that you can set to whatever you want. Then in Splunk UI > Drilldown settings, just leave this blank. On another panel or in another search you can just use $row.drilldown$ or you can also use $row.title$ (if that field is in your original data).

Here is a working example:

<form theme="dark">
  <label>Number display viz setting token</label>
  <row>
    <panel>
      <viz type="number_display_viz.number_display_viz">
        <search>
          <query>
| makeresults count=10
| streamstats count as id
| eval title = "Item " + id, value = "50%", drilldown = "your unique key if you want " + id 
| table title subtitle value drilldown</query>
        </search>
        <option name="drilldown">none</option>
        <option name="number_display_viz.number_display_viz.bordercolor">#FFFFFF</option>
        <option name="number_display_viz.number_display_viz.bordersize">2</option>
        <option name="number_display_viz.number_display_viz.colorprimary">#000000</option>
        <option name="number_display_viz.number_display_viz.colorprimarymode">auto</option>
        <option name="number_display_viz.number_display_viz.colorsecondary">#000000</option>
        <option name="number_display_viz.number_display_viz.colorsecondarymode">auto</option>
        <option name="number_display_viz.number_display_viz.max">100</option>
        <option name="number_display_viz.number_display_viz.min">0</option>
        <option name="number_display_viz.number_display_viz.nodatacolor">#0178c7</option>
        <option name="number_display_viz.number_display_viz.padding">8</option>
        <option name="number_display_viz.number_display_viz.pulserate">0</option>
        <option name="number_display_viz.number_display_viz.shadowcolor">#F2F4F5</option>
        <option name="number_display_viz.number_display_viz.shapebordercolor">#000000</option>
        <option name="number_display_viz.number_display_viz.shapebordercolormode">darker1</option>
        <option name="number_display_viz.number_display_viz.shapebordersize">1</option>
        <option name="number_display_viz.number_display_viz.shapedropcolor">#ffffff</option>
        <option name="number_display_viz.number_display_viz.shapeshadow">no</option>
        <option name="number_display_viz.number_display_viz.shapetexture">texture3</option>
        <option name="number_display_viz.number_display_viz.size">250</option>
        <option name="number_display_viz.number_display_viz.sparkHeight">30</option>
        <option name="number_display_viz.number_display_viz.sparkWidth">95</option>
        <option name="number_display_viz.number_display_viz.sparkalign">3</option>
        <option name="number_display_viz.number_display_viz.sparkalignv">62</option>
        <option name="number_display_viz.number_display_viz.sparkcolorfill">#009DD9</option>
        <option name="number_display_viz.number_display_viz.sparkcolorline">#0178c7</option>
        <option name="number_display_viz.number_display_viz.sparkcolormodefill">darker1</option>
        <option name="number_display_viz.number_display_viz.sparkcolormodeline">darker2</option>
        <option name="number_display_viz.number_display_viz.sparkmax">100</option>
        <option name="number_display_viz.number_display_viz.sparkmin">0</option>
        <option name="number_display_viz.number_display_viz.sparknulls">gaps</option>
        <option name="number_display_viz.number_display_viz.sparkorder">fg</option>
        <option name="number_display_viz.number_display_viz.sparkstyle">area</option>
        <option name="number_display_viz.number_display_viz.spinnerspeedmax">20</option>
        <option name="number_display_viz.number_display_viz.spinnerspeedmin">1</option>
        <option name="number_display_viz.number_display_viz.style">a3</option>
        <option name="number_display_viz.number_display_viz.subtitlealign">center</option>
        <option name="number_display_viz.number_display_viz.subtitlealignv">45</option>
        <option name="number_display_viz.number_display_viz.subtitlecolor">#C6C6C6</option>
        <option name="number_display_viz.number_display_viz.subtitlecolormode">static</option>
        <option name="number_display_viz.number_display_viz.subtitledrop">no</option>
        <option name="number_display_viz.number_display_viz.subtitledropcolor">#ffffff</option>
        <option name="number_display_viz.number_display_viz.subtitlefont">number_display_viz-thin</option>
        <option name="number_display_viz.number_display_viz.subtitlesize">50</option>
        <option name="number_display_viz.number_display_viz.textalign">center</option>
        <option name="number_display_viz.number_display_viz.textalignv">70</option>
        <option name="number_display_viz.number_display_viz.textcolor">#000000</option>
        <option name="number_display_viz.number_display_viz.textdrop">yes</option>
        <option name="number_display_viz.number_display_viz.textdropcolor">#919191</option>
        <option name="number_display_viz.number_display_viz.textduration">300</option>
        <option name="number_display_viz.number_display_viz.textmode">static</option>
        <option name="number_display_viz.number_display_viz.textprecision">1</option>
        <option name="number_display_viz.number_display_viz.textprocessing">abr1</option>
        <option name="number_display_viz.number_display_viz.textsize">100</option>
        <option name="number_display_viz.number_display_viz.textunitposition">after</option>
        <option name="number_display_viz.number_display_viz.textunitsize">50</option>
        <option name="number_display_viz.number_display_viz.thickness">50</option>
        <option name="number_display_viz.number_display_viz.thresholdcol1">#1a9035</option>
        <option name="number_display_viz.number_display_viz.thresholdcol2">#d16f18</option>
        <option name="number_display_viz.number_display_viz.thresholdcol3">#b22b32</option>
        <option name="number_display_viz.number_display_viz.thresholdcol4">#ffffff</option>
        <option name="number_display_viz.number_display_viz.thresholdcol5">#ffffff</option>
        <option name="number_display_viz.number_display_viz.thresholdcol6">#ffffff</option>
        <option name="number_display_viz.number_display_viz.thresholdsize">20</option>
        <option name="number_display_viz.number_display_viz.thresholdval2">70</option>
        <option name="number_display_viz.number_display_viz.thresholdval3">90</option>
        <option name="number_display_viz.number_display_viz.titlealign">center</option>
        <option name="number_display_viz.number_display_viz.titlealignv">25</option>
        <option name="number_display_viz.number_display_viz.titlecolor">#ffffff</option>
        <option name="number_display_viz.number_display_viz.titlecolormode">static</option>
        <option name="number_display_viz.number_display_viz.titledrop">no</option>
        <option name="number_display_viz.number_display_viz.titledropcolor">#ffffff</option>
        <option name="number_display_viz.number_display_viz.titlesize">80</option>
        <option name="refresh.display">progressbar</option>
      </viz>
    </panel>
  </row>
  <row>
    <panel>
      <title>you clicked item: $row.drilldown$  ($$row.title$$ token is now = $row.title$)</title>
    </panel>
  </row>
</form>

View solution in original post

SplunkTrust
SplunkTrust

And here is a run anywhere example of Sunburst viz:

<dashboard theme="dark">
  <label>Sunburst viz setting token</label>
  <row>
    <panel>
      <viz type="sunburst_viz.sunburst_viz">
        <search>
          <query>
| makeresults count=10
| streamstats count as id
| eval title = "Item " + id
| table title id</query>
        </search>
        <option name="drilldown">none</option>
        <option name="refresh.display">progressbar</option>
        <option name="sunburst_viz.sunburst_viz.breadcrumbs">hide</option>
        <option name="sunburst_viz.sunburst_viz.color">schemeCategory10</option>
        <option name="sunburst_viz.sunburst_viz.colormode">root</option>
        <option name="sunburst_viz.sunburst_viz.labelcolor">#000000</option>
        <option name="sunburst_viz.sunburst_viz.labels">show</option>
        <option name="sunburst_viz.sunburst_viz.labelsize">100</option>
        <option name="sunburst_viz.sunburst_viz.labelwidth">100</option>
        <option name="sunburst_viz.sunburst_viz.mode">token</option>
      </viz>
    </panel>
  </row>
  <row>
    <panel>
      <title>you clicked item: $sunburst_viz_title$ </title>
    </panel>
  </row>
</dashboard>
0 Karma

Contributor

Thanks very much Chris. Accepted!

0 Karma