Drilldown on multiple charts in a dashboard

[vikas_sood]

Hi,

I have a dashboard with 3 panels:

1 - area chart using token1 and token2

2 - bar chart using token2 and token3

3 - panel ( table ) populates data based on drilldown on above charts

Whenever I drilldown on area chart, drilldown works fine.

Whenever I drilldown on bar chart, drilldown works fine for bar chart. However, it also refreshes the area chart.  Is there a way to stop area chart from refreshing, when I drilldown on bar chart? 

[kamlesh_vaghela]

@vikas_sood 

Can you please share your sample XML?

KV

[vikas_sood]

@kamlesh_vaghela 

<form theme="light">
<label>Dashboard</label>
<fieldset submitButton="false" autoRun="false">
<input type="time" token="tkn_search" searchWhenChanged="true">
<label>Select Time Range</label>
<default>
<earliest>-12h@h</earliest>
<latest>now</latest>
</default>
</input>
<input type="dropdown" token="tkn_server">
<label>Domain</label>
<fieldForLabel>index</fieldForLabel>
<fieldForValue>index</fieldForValue>
<search>
<query>|eventcount summarize=false index="*" | dedup index | fields index</query>
<earliest>-30d@d</earliest>
<latest>now</latest>
</search>
</input>
<input type="dropdown" token="tkn_host" searchWhenChanged="true">
<label>Host</label>
<fieldForLabel>host</fieldForLabel>
<fieldForValue>host</fieldForValue>
<search>
<query>| metadata type=hosts index=$tkn_server$ | fields host</query>
<earliest>-30d@d</earliest>
<latest>now</latest>
</search>
</input>
<input type="text" token="tkn_search_txt" searchWhenChanged="true">
<label>Search Text</label>
<default>ERROR</default>
</input>
</fieldset>
<row>
<panel id="DataChartPanel" depends="tkn_search_txt">
<title>Logs Time Series</title>
<chart>
<search>
<query>index=$tkn_server$ host=$tkn_host$ sourcetype=outlog $tkn_search_txt$ | timechart count</query>
<earliest>$tkn_search.earliest$</earliest>
<latest>$tkn_search.latest$</latest>
<sampleRatio>1</sampleRatio>
</search>
<option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
<option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
<option name="charting.axisTitleX.text">Time ( EST TZ )</option>
<option name="charting.axisTitleX.visibility">visible</option>
<option name="charting.axisTitleY.text">Number of Errors</option>
<option name="charting.axisTitleY.visibility">visible</option>
<option name="charting.axisTitleY2.visibility">visible</option>
<option name="charting.axisX.abbreviation">none</option>
<option name="charting.axisX.scale">linear</option>
<option name="charting.axisY.abbreviation">none</option>
<option name="charting.axisY.scale">linear</option>
<option name="charting.axisY2.abbreviation">none</option>
<option name="charting.axisY2.enabled">0</option>
<option name="charting.axisY2.scale">inherit</option>
<option name="charting.chart">area</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.showDataLabels">all</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.layout.splitSeries.allowIndependentYRanges">0</option>
<option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
<option name="charting.legend.mode">standard</option>
<option name="charting.legend.placement">none</option>
<option name="charting.lineWidth">2</option>
<option name="height">175</option>
<option name="refresh.display">progressbar</option>
<drilldown>
<eval token="drilldown.earliest">$earliest$</eval>
<eval token="drilldown.latest">$latest$</eval>
<set token="tkn_sourcetype">outlog</set>
<set token="tkn_search_txt">$tkn_search_txt$</set>
</drilldown>
</chart>
</panel>
</row>
<row>
<panel id="AcessData">
<title>Access Logs</title>
<chart>
<search>
<query>index=$tkn_server$ host=$tkn_host$ sourcetype=access | chart count by StatusCode</query>
<earliest>$tkn_search.earliest$</earliest>
<latest>$tkn_search.latest$</latest>
</search>
<option name="charting.axisTitleX.visibility">visible</option>
<option name="charting.axisTitleY.text">Count of Status Codes</option>
<option name="charting.axisTitleY.visibility">visible</option>
<option name="charting.axisY.scale">log</option>
<option name="charting.chart">bar</option>
<option name="charting.chart.showDataLabels">all</option>
<option name="charting.drilldown">all</option>
<option name="charting.legend.placement">none</option>
<option name="height">175</option>
<option name="refresh.display">progressbar</option>
<drilldown>
<set token="tkn_sourcetype">access</set>
<eval token="drilldown.earliest">$earliest$</eval>
<eval token="drilldown.latest">$latest$</eval>
<set token="tkn_search_txt">StatusCode=$click.value$</set>
</drilldown>
</chart>
</panel>
</row>
<row>
<panel id="DataPanel">
<event>
<title>Errors</title>
<search>
<query>index=$tkn_server$ host=$tkn_host$ sourcetype=$tkn_sourcetype$ $tkn_search_txt$</query>
<earliest>$drilldown.earliest$</earliest>
<latest>$drilldown.latest$</latest>
</search>
<option name="list.drilldown">none</option>
<option name="refresh.display">progressbar</option>
<option name="rowNumbers">1</option>
<option name="table.drilldown">none</option>
<option name="type">list</option>
</event>
</panel>
</row>
</form>

[kamlesh_vaghela · Accepted solution]

@vikas_sood 

This behaviour is due to tkn_search_txt token which is used in Area chart also.

So what I suggest just change the token name to tkn_search_txt_1 in both drilldown and use it in table search.

Like this.

<form theme="light">
    <label>Dashboard</label>
    <fieldset submitButton="false" autoRun="false">
        <input type="time" token="tkn_search" searchWhenChanged="true">
            <label>Select Time Range</label>
            <default>
                <earliest>-12h@h</earliest>
                <latest>now</latest>
            </default>
        </input>
        <input type="dropdown" token="tkn_server">
            <label>Domain</label>
            <fieldForLabel>index</fieldForLabel>
            <fieldForValue>index</fieldForValue>
            <search>
                <query>|eventcount summarize=false index="*" | dedup index | fields index</query>
                <earliest>-30d@d</earliest>
                <latest>now</latest>
            </search>
        </input>
        <input type="dropdown" token="tkn_host" searchWhenChanged="true">
            <label>Host</label>
            <fieldForLabel>host</fieldForLabel>
            <fieldForValue>host</fieldForValue>
            <search>
                <query>| metadata type=hosts index=$tkn_server$ | fields host</query>
                <earliest>-30d@d</earliest>
                <latest>now</latest>
            </search>
        </input>
        <input type="text" token="tkn_search_txt" searchWhenChanged="true">
            <label>Search Text</label>
            <default>ERROR</default>
        </input>
    </fieldset>
    <row>
        <panel id="DataChartPanel" depends="tkn_search_txt">
            <title>Logs Time Series</title>
            <chart>
                <search>
                    <query>index=$tkn_server$ host=$tkn_host$  $tkn_search_txt$ | timechart count</query>
                    <earliest>$tkn_search.earliest$</earliest>
                    <latest>$tkn_search.latest$</latest>
                    <sampleRatio>1</sampleRatio>
                </search>
                <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
                <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
                <option name="charting.axisTitleX.text">Time ( EST TZ )</option>
                <option name="charting.axisTitleX.visibility">visible</option>
                <option name="charting.axisTitleY.text">Number of Errors</option>
                <option name="charting.axisTitleY.visibility">visible</option>
                <option name="charting.axisTitleY2.visibility">visible</option>
                <option name="charting.axisX.abbreviation">none</option>
                <option name="charting.axisX.scale">linear</option>
                <option name="charting.axisY.abbreviation">none</option>
                <option name="charting.axisY.scale">linear</option>
                <option name="charting.axisY2.abbreviation">none</option>
                <option name="charting.axisY2.enabled">0</option>
                <option name="charting.axisY2.scale">inherit</option>
                <option name="charting.chart">area</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.showDataLabels">all</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.layout.splitSeries.allowIndependentYRanges">0</option>
                <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
                <option name="charting.legend.mode">standard</option>
                <option name="charting.legend.placement">none</option>
                <option name="charting.lineWidth">2</option>
                <option name="height">175</option>
                <option name="refresh.display">progressbar</option>
                <drilldown>
                    <eval token="drilldown.earliest">$earliest$</eval>
                    <eval token="drilldown.latest">$latest$</eval>
                    <set token="tkn_sourcetype">*</set>
                    <set token="tkn_search_txt_1">$tkn_search_txt$</set>
                </drilldown>
            </chart>
        </panel>
    </row>
    <row>
        <panel id="AcessData">
            <title>Access Logs</title>
            <chart>
                <search>
                    <query>index=$tkn_server$ host=$tkn_host$  | chart count by StatusCode</query>
                    <earliest>$tkn_search.earliest$</earliest>
                    <latest>$tkn_search.latest$</latest>
                </search>
                <option name="charting.axisTitleX.visibility">visible</option>
                <option name="charting.axisTitleY.text">Count of Status Codes</option>
                <option name="charting.axisTitleY.visibility">visible</option>
                <option name="charting.axisY.scale">log</option>
                <option name="charting.chart">bar</option>
                <option name="charting.chart.showDataLabels">all</option>
                <option name="charting.drilldown">all</option>
                <option name="charting.legend.placement">none</option>
                <option name="height">175</option>
                <option name="refresh.display">progressbar</option>
                <drilldown>
                    <set token="tkn_sourcetype">access</set>
                    <eval token="drilldown.earliest">$earliest$</eval>
                    <eval token="drilldown.latest">$latest$</eval>
                    <set token="tkn_search_txt_1">StatusCode=$click.value$</set>
                </drilldown>
            </chart>
        </panel>
    </row>
    <row>
        <panel id="DataPanel">
            <event>
                <title>Errors</title>
                <search>
                    <query>index=$tkn_server$ host=$tkn_host$ sourcetype=$tkn_sourcetype$ $tkn_search_txt_1$</query>
                    <earliest>$drilldown.earliest$</earliest>
                    <latest>$drilldown.latest$</latest>
                </search>
                <option name="list.drilldown">none</option>
                <option name="refresh.display">progressbar</option>
                <option name="rowNumbers">1</option>
                <option name="table.drilldown">none</option>
                <option name="type">list</option>
            </event>
        </panel>
    </row>
</form>

Thanks
KV
▄︻̷̿┻̿═━一

If any of my reply helps you to solve the problem Or gain knowledge, an upvote would be appreciated.

[vikas_sood]

Thanks... i suspected it was token issue, but was this close..din't know that