topic Re: Dropdown on a panel in Dashboards & Visualizations

Dropdown on a panel

dbcase — Tue, 30 Aug 2016 19:07:10 GMT

Hi,

I have the below simple XML code for a dropdown on a panel but for some reason I can't get it to show on the panel. What am I missing? (tablevariablescubscribers is set from a table selection and the resulting chart works just fine. Just no dropdown visible)

<!-- Begin create a line chart based off of the drilldown above -->
      <!-- Don't show a panel until tablevariable is set -->
      <chart depends="$tablevariablesubscribers$">
        <title>Expanded Subscriber Connectivity for - $tablevariablesubscribers$</title>

       <input type="dropdown" token="predict_time" searchWhenChanged="true">
      <label>Select number of days to predict:</label>
      <default>ccivirpxa0*</default>
      <choice value="90">90 Days</choice>
      <choice value="7">7 Days</choice>
      <choice value="30">30 Days</choice>
      <choice value="60">60 Days</choice>
      <choice value="180">180 Days</choice>
      <choice value="365">365 Days</choice>
      <choice value="1000">Maximum</choice>
    </input>









        <search>
          <query>index=mso_statistics sourcetype=ic_connectivity_5min-too_small stat_name=subscribers| where lower(mso)=lower("$tablevariablesubscribers$") | timechart avg(stat_val) as Trend|predict Trend as Prediction  future_timespan=90|eval Prediction=round(Prediction,0)</query>
          <earliest>0</earliest>
        </search>
        <option name="charting.chart">column</option>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">collapsed</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.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">zero</option>
        <option name="charting.chart.showDataLabels">none</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.placement">right</option>
        <option name="charting.axisTitleY.text">Subscriber Count</option>
      </chart>
      <!-- End create a line chart based off of the drilldown above -->
    </panel>
  </row>

Re: Dropdown on a panel

sundareshr — Tue, 30 Aug 2016 19:12:48 GMT

Try moving the input outside the chart and add depends to the panel instead. Like this

<panel depends="$tablevariablesubscribers$">
         <title>Expanded Subscriber Connectivity for - $tablevariablesubscribers$</title>

        <input type="dropdown" token="predict_time" searchWhenChanged="true">
       <label>Select number of days to predict:</label>
       <default>ccivirpxa0*</default>
       <choice value="90">90 Days</choice>
       <choice value="7">7 Days</choice>
       <choice value="30">30 Days</choice>
       <choice value="60">60 Days</choice>
       <choice value="180">180 Days</choice>
       <choice value="365">365 Days</choice>
       <choice value="1000">Maximum</choice>
     </input>








<chart>

         <search>
           <query>index=mso_statistics sourcetype=ic_connectivity_5min-too_small stat_name=subscribers| where lower(mso)=lower("$tablevariablesubscribers$") | timechart avg(stat_val) as Trend|predict Trend as Prediction  future_timespan=90|eval Prediction=round(Prediction,0)</query>
           <earliest>0</earliest>
         </search>
         <option name="charting.chart">column</option>
         <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
         <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
         <option name="charting.axisTitleX.visibility">collapsed</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.bubbleMaximumSize">50</option>
         <option name="charting.chart.bubbleMinimumSize">10</option>
         <option name="charting.chart.bubbleSizeBy">area</option>
         <option name="charting.chart.nullValueMode">zero</option>
         <option name="charting.chart.showDataLabels">none</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.placement">right</option>
         <option name="charting.axisTitleY.text">Subscriber Count</option>
       </chart>
       <!-- End create a line chart based off of the drilldown above -->
     </panel>
   </row>

Re: Dropdown on a panel

dbcase — Tue, 30 Aug 2016 19:16:28 GMT

Hi Sundareshr! Sorry I don't quite understand. The panel with the subscriber and prediction count shows up just fine. It's the dropdown that never shows up.

Re: Dropdown on a panel

sundareshr — Tue, 30 Aug 2016 19:23:42 GMT

The reason dropdown doesn't show is becuase you have it inside the chart tags. So it treats it as options/settings for the chart. Just the <input type=dropdown>.....</input> which is currently right after <chart depends="$tablevariablesubscribers$"> to before the <chart depends="$tablevariablesubscribers$"> and the set the token dependency at the panel level. SO your panel will look like this <panel depends="$tablevariablesubscribers$">

Re: Dropdown on a panel

dbcase — Tue, 30 Aug 2016 19:24:09 GMT

well I think I figured out what you are trying to tell me. Here is the updated code. But.... I get this error when trying to save

XML Syntax Error: Cannot find object mapper for panel type: panel

<panel depends="$tablevariablesubscribers$">
          <title>Expanded Subscriber Connectivity for - $tablevariablesubscribers$</title>

         <input type="dropdown" token="predict_time" searchWhenChanged="true">
        <label>Select number of days to predict:</label>
        <default>90</default>
        <choice value="90">90 Days</choice>
        <choice value="7">7 Days</choice>
        <choice value="30">30 Days</choice>
        <choice value="60">60 Days</choice>
        <choice value="180">180 Days</choice>
        <choice value="365">365 Days</choice>
        <choice value="1000">Maximum</choice>
      </input>




      <chart>


        <search>
          <query>index=mso_statistics sourcetype=ic_connectivity_5min-too_small stat_name=subscribers| where lower(mso)=lower("$tablevariablesubscribers$") | timechart avg(stat_val) as Trend|predict Trend as Prediction  future_timespan=90|eval Prediction=round(Prediction,0)</query>
          <earliest>0</earliest>
        </search>
        <option name="charting.chart">column</option>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">collapsed</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.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">zero</option>
        <option name="charting.chart.showDataLabels">none</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.placement">right</option>
        <option name="charting.axisTitleY.text">Subscriber Count</option>
      </chart>
      <!-- End create a line chart based off of the drilldown above -->
    </panel>
    </panel>
  </row>
</dashboard>

Re: Dropdown on a panel

sundareshr — Tue, 30 Aug 2016 19:27:40 GMT

You have two </panel> towards the end, remove one

Re: Dropdown on a panel

dbcase — Tue, 30 Aug 2016 19:31:13 GMT

Hmmm, (sorry for all the hand holding here)

When I do that the editor complains with Encountered the following error while trying to update: In handler 'views': Error parsing XML on line 462: Premature end of data in tag dashboard line 1

<panel depends="$tablevariablesubscribers$">


         <input type="dropdown" token="predict_time" searchWhenChanged="true">
        <label>Select number of days to predict:</label>
        <default>90</default>
        <choice value="90">90 Days</choice>
        <choice value="7">7 Days</choice>
        <choice value="30">30 Days</choice>
        <choice value="60">60 Days</choice>
        <choice value="180">180 Days</choice>
        <choice value="365">365 Days</choice>
        <choice value="1000">Maximum</choice>
      </input>





      <chart>
        <title>Expanded Subscriber Connectivity for - $tablevariablesubscribers$</title>

        <search>
          <query>index=mso_statistics sourcetype=ic_connectivity_5min-too_small stat_name=subscribers| where lower(mso)=lower("$tablevariablesubscribers$") | timechart avg(stat_val) as Trend|predict Trend as Prediction  future_timespan=90|eval Prediction=round(Prediction,0)</query>
          <earliest>0</earliest>
        </search>
        <option name="charting.chart">column</option>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">collapsed</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.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">zero</option>
        <option name="charting.chart.showDataLabels">none</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.placement">right</option>
        <option name="charting.axisTitleY.text">Subscriber Count</option>
      </chart>
      <!-- End create a line chart based off of the drilldown above -->
    </panel>

  </row>
</dashboard>

Re: Dropdown on a panel

dbcase — Tue, 30 Aug 2016 19:34:50 GMT

Ok found where the other panel was and fixed it 🙂 Now it shows WITH the dropdown !!!! Thank you!!!!