Dashboards & Visualizations
cancel
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Showing results for 
Search instead for 
Did you mean: 
Ask a Question
Solved! Jump to solution

How can I drill down from one panel (pie chart) to another panel in the same dashboard, passing a variable from the chart?

nitesh218ss
Communicator
‎04-20-2015 05:08 AM

i create query for pie chart they show marcName in different different color i want when i click on particular colour then they show other pie chart for that particular marcName details like refReq, refRes, save, for that MarcName how i do this
my first query is:
index=machine | eval GG=substr(Msg,1,5) |eval MarcName=if((GG=="ARL E" OR GG=="QRL E"),substr(Msg, 27,5),substr(Msg, 26,5)) |stats count(MarcName) as numviewed by MarcName

By this query they show many MarcName in different colour so when i click on particular colour(Particular MarcName) then they go to next query with that particular MarcName
My secound Query is:
index=machine | eval GG=substr(Msg,1,5)|eval MarcName=if((GG=="ARL E" OR GG=="QRL E"),substr(Msg, 27,5),substr(Msg, 26,5)) | eval ll=substr(Msg,0,7) |search MarcName=mmm09 |eval tran=if(ll="QRLNP72","refReq",if(ll="ARLNP72","refRes",if(ll="QRL E04","save","other")))| stats count(MarcName) as numviewed by tran

in this query on click particular colour in 1st query they take MarcName automaticaly in 2nd query that place( |search MarcName=mmm09)

here mmm09 is i want automatically take on click in first query pie chart single colour they take value

0 Karma
Reply
1 Solution
Solved! Jump to solution
Solution

rsennett_splunk
Splunk Employee
Splunk Employee
‎04-20-2015 10:50 PM

What you are looking for is demonstrated in the "contextual Drilldown" example in the Splunk 6.x Dashboard examples App
To find the example install the app, and then select it. Click on the Examples Menu and then choose "Drilldown Examples" The one you want is towards the bottom. "Contextual Drilldown" When you view it, the title is: "In-Page Drilldown with Perma-linking" For further detail you can look at the example just left of Contextual Drilldown called "Dynamic Drilldown". The first, shows how you create two panes. One is invisible, until your pie chart is clicked. The second form opens and uses the context of your click to pass a token.

Below, I've edited the example so that it uses a pie chart and so that the structure of the searches is the same as yours (without the evals etc...) so you can see how you might replace the searches and the token value setting. It uses internal Splunk data so it will run in your environment as is.

Create a new dashboard, click "edit source" and paste the code in.
Either clone the dashboard (after you see it run) and replace the searches with your own (and replace the reference to sourcetype with your own field, in this case MarcName

This will create a chart where when you click on the particular slice, it will pass the sort value (MarcName) to the next chart. That next chart will initiate ...|search MarcName= and there you have it.

<form>
  <label>In-Page Drilldown with Perma-linking</label>
  <fieldset submitButton="false">
    <!--
            Create an input to store the drilldown value. It will be hidden using custom javascript when
            the dashboard is loaded.
         -->
    <input type="text" token="sourcetype" searchWhenChanged="true"></input>
  </fieldset>
  <row>
    <chart id="master">
      <title>Master</title>
      <search>
        <query>index=_internal | stats count(sourcetype) as ST by sourcetype</query>
        <earliest>-60m@m</earliest>
        <latest>now</latest>
      </search>
      <!-- Set the type of of drilldown, since we will always consume the same field, use row-->
      <drilldown>
        <!-- Use set to specify the new token to be created.
                     Use any token from the page or from the click event to produce the value needed. -->
        <set token="sourcetype">$row.sourcetype$</set>
        <!-- If we also set the form.sourcetype the input will get updated too -->
        <set token="form.sourcetype">$row.sourcetype$</set>
      </drilldown>
      <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
      <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
      <option name="charting.axisTitleX.visibility">visible</option>
      <option name="charting.axisTitleY.visibility">visible</option>
      <option name="charting.axisTitleY2.visibility">visible</option>
      <option name="charting.axisX.scale">linear</option>
      <option name="charting.axisY.scale">linear</option>
      <option name="charting.axisY2.enabled">false</option>
      <option name="charting.axisY2.scale">inherit</option>
      <option name="charting.chart">pie</option>
      <option name="charting.chart.bubbleMaximumSize">50</option>
      <option name="charting.chart.bubbleMinimumSize">10</option>
      <option name="charting.chart.bubbleSizeBy">area</option>
      <option name="charting.chart.nullValueMode">gaps</option>
      <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
      <option name="charting.chart.stackMode">default</option>
      <option name="charting.chart.style">shiny</option>
      <option name="charting.drilldown">all</option>
      <option name="charting.layout.splitSeries">0</option>
      <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
      <option name="charting.legend.placement">right</option>
    </chart>
  </row>
  <row>
    <!-- depends is the way we tell the content to only show when the token has a value.
             Hint: use comma separated values if the element requires more than one token. -->
    <chart id="detail" depends="$sourcetype$">
      <title>Detail: $sourcetype$</title>
      <searchTemplate>index=_internal | search sourcetype=$sourcetype$ | stats count(sourcetype) as numvalue by source</searchTemplate>
      <earliestTime>-60m@m</earliestTime>
      <latestTime>now</latestTime>
    </chart>
  </row>
</form>
With Splunk... the answer is always "YES!". It just might require more regex than you're prepared for!

View solution in original post

0 Karma
Reply
Solved! Jump to solution

nitesh218ss
Communicator
‎04-21-2015 11:21 PM

Thanks for reply sir,
yestaday i found this app and i success to create

my XML is

searchtry

<!--
        Create an input to store the drilldown value. It will be hidden using custom javascript when
        the dashboard is loaded.
     -->
<input type="text" token="MarcName" searchWhenChanged="true"></input>



  <title>Master</title>
  <searchString>index=newpwm source="SOCK_20150327_192217.log"  | eval GG=substr(Msg,1,5)  |eval MarcName=if((GG=="ARL E" OR GG=="QRL E"),substr(Msg, 27,5),substr(Msg, 26,5)) |stats count(MarcName) as numviewed by MarcName</searchString>
  <earliestTime></earliestTime>
  <latestTime>now</latestTime>
 <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
  <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
  <option name="charting.axisTitleX.visibility">visible</option>
  <option name="charting.axisTitleY.visibility">visible</option>
  <option name="charting.axisTitleY2.visibility">visible</option>
  <option name="charting.axisX.scale">linear</option>
  <option name="charting.axisY.scale">linear</option>
  <option name="charting.axisY2.enabled">0</option>
  <option name="charting.axisY2.scale">inherit</option>
  <option name="charting.chart">pie</option>
  <option name="charting.chart.bubbleMaximumSize">50</option>
  <option name="charting.chart.bubbleMinimumSize">10</option>
  <option name="charting.chart.bubbleSizeBy">area</option>
  <option name="charting.chart.nullValueMode">gaps</option>
  <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
  <option name="charting.chart.stackMode">default</option>
  <option name="charting.chart.style">shiny</option>
  <option name="charting.drilldown">all</option>
  <option name="charting.layout.splitSeries">0</option>
  <option name="charting.legend.labelStyle.overflowMode">ellipsisEnd</option>
  <option name="charting.legend.placement">right</option>

  <drilldown>
    <!-- Use set to specify the new token to be created.
                 Use any token from the page or from the click event to produce the value needed. -->
    <set token="MarcName">$row.MarcName$</set>
    <!-- If we also set the form.sourcetype the input will get updated too -->
    <set token="form.MarcName">$row.MarcName$</set>
  </drilldown>
   </chart>



<!-- depends is the way we tell the content to only show when the token has a value.
         Hint: use comma separated values if the element requires more than one token. -->
<chart id="detail" depends="$MarcName$">
  <title>Detail: $MarcName$</title>
  <search>
    <query>index=newpwm source="SOCK_20150327_192217.log" | eval GG=substr(Msg,1,5)|eval MarcName=if((GG=="ARL E" OR GG=="QRL E"),substr(Msg, 27,5),substr(Msg, 26,5)) | eval ll=substr(Msg,0,7) |search MarcName=$MarcName$ |eval tran=if(ll="QRLNP72","refReq",if(ll="ARLNP72","refRes",if(ll="QRL E04","save","other")))| stats count(MarcName) as numviewed by tran</query>
    <latest>now</latest>
  </search>
  <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
  <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
  <option name="charting.axisTitleX.visibility">visible</option>
  <option name="charting.axisTitleY.visibility">visible</option>
  <option name="charting.axisTitleY2.visibility">visible</option>
  <option name="charting.axisX.scale">linear</option>
  <option name="charting.axisY.scale">linear</option>
  <option name="charting.axisY2.enabled">false</option>
  <option name="charting.axisY2.scale">inherit</option>
  <option name="charting.chart">pie</option>
  <option name="charting.chart.bubbleMaximumSize">50</option>
  <option name="charting.chart.bubbleMinimumSize">10</option>
  <option name="charting.chart.bubbleSizeBy">area</option>
  <option name="charting.chart.nullValueMode">gaps</option>
  <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
  <option name="charting.chart.stackMode">default</option>
  <option name="charting.chart.style">shiny</option>
  <option name="charting.drilldown">all</option>
  <option name="charting.layout.splitSeries">0</option>
  <option name="charting.legend.labelStyle.overflowMode">ellipsisEnd</option>
  <option name="charting.legend.placement">right</option>
</chart>


<!-- depends is the way we tell the content to only show when the token has a value.
         Hint: use comma separated values if the element requires more than one token. -->
<chart id="detai" depends="$MarcName$">
  <title>Detail: $MarcName$</title>
  <search>
    <query>index=newpwm source="SOCK_20150327_192217.log" Msg="QRL E04*" |eval MarcName=substr(Msg, 27,5)  |search MarcName=$MarcName$ |eval uu=substr(Msg,32,12) |join uu [search index=newpwm source="SOCK_20150327_192217.log" Msg=ARLNL* OR Msg=ARLNA* | eval ll=substr(Msg,0,7)|eval uu=if(ll=="ARLNL72",substr(Msg,299,12),substr(Msg,315,12))] | eval ll=substr(Msg,0,7) |eval tran=if(ll="ARLNL12","SaleTran",if(ll="ARLNL72","RefTran","other"))| stats count(ll) as numviewed by tran



    <latest>now</latest>
  </search>
  <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
  <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
  <option name="charting.axisTitleX.visibility">visible</option>
  <option name="charting.axisTitleY.visibility">visible</option>
  <option name="charting.axisTitleY2.visibility">visible</option>
  <option name="charting.axisX.scale">linear</option>
  <option name="charting.axisY.scale">linear</option>
  <option name="charting.axisY2.enabled">false</option>
  <option name="charting.axisY2.scale">inherit</option>
  <option name="charting.chart">pie</option>
  <option name="charting.chart.bubbleMaximumSize">50</option>
  <option name="charting.chart.bubbleMinimumSize">10</option>
  <option name="charting.chart.bubbleSizeBy">area</option>
  <option name="charting.chart.nullValueMode">gaps</option>
  <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
  <option name="charting.chart.stackMode">default</option>
  <option name="charting.chart.style">shiny</option>
  <option name="charting.drilldown">all</option>
  <option name="charting.layout.splitSeries">0</option>
  <option name="charting.legend.labelStyle.overflowMode">ellipsisEnd</option>
  <option name="charting.legend.placement">right</option>
</chart>
0 Karma
Reply
Solved! Jump to solution

rsennett_splunk
Splunk Employee
Splunk Employee
‎04-22-2015 11:01 AM

Yup! Good job.

With Splunk... the answer is always "YES!". It just might require more regex than you're prepared for!
0 Karma
Reply
Solved! Jump to solution
Solution

rsennett_splunk
Splunk Employee
Splunk Employee
‎04-20-2015 10:50 PM

What you are looking for is demonstrated in the "contextual Drilldown" example in the Splunk 6.x Dashboard examples App
To find the example install the app, and then select it. Click on the Examples Menu and then choose "Drilldown Examples" The one you want is towards the bottom. "Contextual Drilldown" When you view it, the title is: "In-Page Drilldown with Perma-linking" For further detail you can look at the example just left of Contextual Drilldown called "Dynamic Drilldown". The first, shows how you create two panes. One is invisible, until your pie chart is clicked. The second form opens and uses the context of your click to pass a token.

Below, I've edited the example so that it uses a pie chart and so that the structure of the searches is the same as yours (without the evals etc...) so you can see how you might replace the searches and the token value setting. It uses internal Splunk data so it will run in your environment as is.

Create a new dashboard, click "edit source" and paste the code in.
Either clone the dashboard (after you see it run) and replace the searches with your own (and replace the reference to sourcetype with your own field, in this case MarcName

This will create a chart where when you click on the particular slice, it will pass the sort value (MarcName) to the next chart. That next chart will initiate ...|search MarcName= and there you have it.

<form>
  <label>In-Page Drilldown with Perma-linking</label>
  <fieldset submitButton="false">
    <!--
            Create an input to store the drilldown value. It will be hidden using custom javascript when
            the dashboard is loaded.
         -->
    <input type="text" token="sourcetype" searchWhenChanged="true"></input>
  </fieldset>
  <row>
    <chart id="master">
      <title>Master</title>
      <search>
        <query>index=_internal | stats count(sourcetype) as ST by sourcetype</query>
        <earliest>-60m@m</earliest>
        <latest>now</latest>
      </search>
      <!-- Set the type of of drilldown, since we will always consume the same field, use row-->
      <drilldown>
        <!-- Use set to specify the new token to be created.
                     Use any token from the page or from the click event to produce the value needed. -->
        <set token="sourcetype">$row.sourcetype$</set>
        <!-- If we also set the form.sourcetype the input will get updated too -->
        <set token="form.sourcetype">$row.sourcetype$</set>
      </drilldown>
      <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
      <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
      <option name="charting.axisTitleX.visibility">visible</option>
      <option name="charting.axisTitleY.visibility">visible</option>
      <option name="charting.axisTitleY2.visibility">visible</option>
      <option name="charting.axisX.scale">linear</option>
      <option name="charting.axisY.scale">linear</option>
      <option name="charting.axisY2.enabled">false</option>
      <option name="charting.axisY2.scale">inherit</option>
      <option name="charting.chart">pie</option>
      <option name="charting.chart.bubbleMaximumSize">50</option>
      <option name="charting.chart.bubbleMinimumSize">10</option>
      <option name="charting.chart.bubbleSizeBy">area</option>
      <option name="charting.chart.nullValueMode">gaps</option>
      <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
      <option name="charting.chart.stackMode">default</option>
      <option name="charting.chart.style">shiny</option>
      <option name="charting.drilldown">all</option>
      <option name="charting.layout.splitSeries">0</option>
      <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
      <option name="charting.legend.placement">right</option>
    </chart>
  </row>
  <row>
    <!-- depends is the way we tell the content to only show when the token has a value.
             Hint: use comma separated values if the element requires more than one token. -->
    <chart id="detail" depends="$sourcetype$">
      <title>Detail: $sourcetype$</title>
      <searchTemplate>index=_internal | search sourcetype=$sourcetype$ | stats count(sourcetype) as numvalue by source</searchTemplate>
      <earliestTime>-60m@m</earliestTime>
      <latestTime>now</latestTime>
    </chart>
  </row>
</form>
With Splunk... the answer is always "YES!". It just might require more regex than you're prepared for!
0 Karma
Reply
Solved! Jump to solution

nitesh218ss
Communicator
‎04-22-2015 12:24 AM

Thanks for reply sir,

0 Karma
Reply
Get Updates on the Splunk Community!

Welcome to the Splunk Community!

(view in My Videos) We're so glad you're here! The Splunk Community is place to connect, learn, give back, and ...

Tech Talk | Elevating Digital Service Excellence: The Synergy of Splunk RUM & APM

Elevating Digital Service Excellence: The Synergy of Real User Monitoring and Application Performance ...

Adoption of RUM and APM at Splunk

    Unleash the power of Splunk Observability   Watch Now In this can't miss Tech Talk! The Splunk Growth ...