All Apps and Add-ons
Highlighted

How can I create a dashboard with six radial gauges in a single row?

Splunk Employee
Splunk Employee

I'm trying to create a dashboard that utilizes PostProcessing and the SideView add on. What this dashboard is supposed to produce is 6 radialGauge panels in a single row that are receiving data from a single query. When I run the below Source code and then go to view the dashboard, I receive this error message "Unable to load all the panels: a dashboard can have maximum of '50' rows," but I am unsure why when I only have 6 Panels in 1 row. Any suggestions?

Source Code:

<view autoCancelInterval="90" isSticky="False" isVisible="true" onunloadCancelJobs="true" template="dashboard.html">
<label>PostProcess - static config</label>
<module name="AccountBar" layoutPanel="appHeader"/>
<module name="AppBar" layoutPanel="appHeader"/>
<module name="SideviewUtils" layoutPanel="appHeader"/>
<module name="Message" layoutPanel="messaging">
<param name="filter">*</param>
<param name="maxSize">2</param>
<param name="clearOnJobDispatch">False</param>
</module>
<module name="HTML" layoutPanel="viewHeader">
<param name="html">
<![CDATA[
<h1>Ticketing Parking Capacity Test</h1>
]]>
</param>
</module>

<!-- EXAMPLE BEGIN -->
<module name="Search" layoutPanel="panel_row2_col1" autoRun="True">
<param name="search">
index=* (my search goes here)</param>
<param name="earliest">-7d</param>
<param name="latest">now</param>
<module name="JobProgressIndicator"/>
<module name="HTML">
<param name="html">
<![CDATA[ <h3>Lot Blue 1</h3> ]]>
</param>
</module>

<module name="PostProcess">
<param name="search">
search Lot="BLUE 1"|fields "Percentage Full"</param>
<module name="HiddenChartFormatter">
<param name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</param>
<param name="charting.axisLabelsX.majorLabelStyle.rotation">0</param>
<param name="charting.axisTitleX.visibility">visible</param>
<param name="charting.axisTitleY.visibility">visible</param>
<param name="charting.axisTitleY2.visibility">visible</param>
<param name="charting.axisX.scale">linear</param>
<param name="charting.axisY.scale">linear</param>
<param name="charting.axisY2.enabled">false</param>
<param name="charting.axisY2.scale">inherit</param>
<param name="charting.chart">radialGauge</param>
<param name="charting.chart.nullValueMode">gaps</param>
<param name="charting.chart.sliceCollapsingThreshold">0.01</param>
<param name="charting.chart.stackMode">default</param>
<param name="charting.chart.style">shiny</param>
<param name="charting.drilldown">all</param>
<param name="charting.layout.splitSeries">0</param>
<param name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</param>
<param name="charting.legend.placement">right</param>
<module name="FlashChart">
</module>
</module>
</module>

<module name="HTML" layoutPanel="panel_row2_col2">
<module name="JobProgressIndicator"/>
<module name="HTML">
<param name="html">
<![CDATA[ <h3>Lot Blue 2</h3> ]]>
</param>
</module>
<module name="PostProcess">
<param name="search">
search Lot="BLUE 2"|fields "Percentage Full"</param>
<module name="HiddenChartFormatter">
<param name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</param>
<param name="charting.axisLabelsX.majorLabelStyle.rotation">0</param>
<param name="charting.axisTitleX.visibility">visible</param>
<param name="charting.axisTitleY.visibility">visible</param>
<param name="charting.axisTitleY2.visibility">visible</param>
<param name="charting.axisX.scale">linear</param>
<param name="charting.axisY.scale">linear</param>
<param name="charting.axisY2.enabled">false</param>
<param name="charting.axisY2.scale">inherit</param>
<param name="charting.chart">radialGauge</param>
<param name="charting.chart.nullValueMode">gaps</param>
<param name="charting.chart.sliceCollapsingThreshold">0.01</param>
<param name="charting.chart.stackMode">default</param>
<param name="charting.chart.style">shiny</param>
<param name="charting.drilldown">all</param>
<param name="charting.layout.splitSeries">0</param>
<param name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</param>
<param name="charting.legend.placement">right</param>
<module name="FlashChart">
</module>
</module>
</module>
</module>

<module name="HTML" layoutPanel="panel_row2_col3">
<module name="JobProgressIndicator"/>
<module name="HTML">
<param name="html">
<![CDATA[ <h3>Lot Blue 3</h3> ]]>
</param>
</module>
<module name="PostProcess">
<param name="search">
search Lot="BLUE 3"|fields "Percentage Full"</param>
<module name="HiddenChartFormatter">
<param name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</param>
<param name="charting.axisLabelsX.majorLabelStyle.rotation">0</param>
<param name="charting.axisTitleX.visibility">visible</param>
<param name="charting.axisTitleY.visibility">visible</param>
<param name="charting.axisTitleY2.visibility">visible</param>
<param name="charting.axisX.scale">linear</param>
<param name="charting.axisY.scale">linear</param>
<param name="charting.axisY2.enabled">false</param>
<param name="charting.axisY2.scale">inherit</param>
<param name="charting.chart">radialGauge</param>
<param name="charting.chart.nullValueMode">gaps</param>
<param name="charting.chart.sliceCollapsingThreshold">0.01</param>
<param name="charting.chart.stackMode">default</param>
<param name="charting.chart.style">shiny</param>
<param name="charting.drilldown">all</param>
<param name="charting.layout.splitSeries">0</param>
<param name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</param>
<param name="charting.legend.placement">right</param>
<module name="FlashChart">
</module>
</module>
</module>
</module>

<module name="HTML" layoutPanel="panel_row2_col4">
<module name="JobProgressIndicator"/>
<module name="HTML">
<param name="html">
<![CDATA[ <h3>Lot GREEN 1</h3> ]]>
</param>
</module>
<module name="PostProcess">
<param name="search">
search Lot="GREEN 1"|fields "Percentage Full"</param>
<module name="HiddenChartFormatter">
<param name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</param>
<param name="charting.axisLabelsX.majorLabelStyle.rotation">0</param>
<param name="charting.axisTitleX.visibility">visible</param>
<param name="charting.axisTitleY.visibility">visible</param>
<param name="charting.axisTitleY2.visibility">visible</param>
<param name="charting.axisX.scale">linear</param>
<param name="charting.axisY.scale">linear</param>
<param name="charting.axisY2.enabled">false</param>
<param name="charting.axisY2.scale">inherit</param>
<param name="charting.chart">radialGauge</param>
<param name="charting.chart.nullValueMode">gaps</param>
<param name="charting.chart.sliceCollapsingThreshold">0.01</param>
<param name="charting.chart.stackMode">default</param>
<param name="charting.chart.style">shiny</param>
<param name="charting.drilldown">all</param>
<param name="charting.layout.splitSeries">0</param>
<param name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</param>
<param name="charting.legend.placement">right</param>
<module name="FlashChart">
</module>
</module>
</module>
</module>

<module name="HTML" layoutPanel="panel_row2_col5">
<module name="JobProgressIndicator"/>
<module name="HTML">
<param name="html">
<![CDATA[ <h3>Lot GREEN 2</h3> ]]>
</param>
</module>
<module name="PostProcess">
<param name="search">
search Lot="GREEN 2"|fields "Percentage Full"</param>
<module name="HiddenChartFormatter">
<param name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</param>
<param name="charting.axisLabelsX.majorLabelStyle.rotation">0</param>
<param name="charting.axisTitleX.visibility">visible</param>
<param name="charting.axisTitleY.visibility">visible</param>
<param name="charting.axisTitleY2.visibility">visible</param>
<param name="charting.axisX.scale">linear</param>
<param name="charting.axisY.scale">linear</param>
<param name="charting.axisY2.enabled">false</param>
<param name="charting.axisY2.scale">inherit</param>
<param name="charting.chart">radialGauge</param>
<param name="charting.chart.nullValueMode">gaps</param>
<param name="charting.chart.sliceCollapsingThreshold">0.01</param>
<param name="charting.chart.stackMode">default</param>
<param name="charting.chart.style">shiny</param>
<param name="charting.drilldown">all</param>
<param name="charting.layout.splitSeries">0</param>
<param name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</param>
<param name="charting.legend.placement">right</param>
<module name="FlashChart">
</module>
</module>
</module>
</module>

<module name="HTML" layoutPanel="panel_row2_col6">
<module name="JobProgressIndicator"/>
<module name="HTML">
<param name="html">
<![CDATA[ <h3>Lot GREEN 3</h3> ]]>
</param>
</module>
<module name="PostProcess">
<param name="search">
search Lot="GREEN 3"|fields "Percentage Full"</param>
<module name="HiddenChartFormatter">
<param name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</param>
<param name="charting.axisLabelsX.majorLabelStyle.rotation">0</param>
<param name="charting.axisTitleX.visibility">visible</param>
<param name="charting.axisTitleY.visibility">visible</param>
<param name="charting.axisTitleY2.visibility">visible</param>
<param name="charting.axisX.scale">linear</param>
<param name="charting.axisY.scale">linear</param>
<param name="charting.axisY2.enabled">false</param>
<param name="charting.axisY2.scale">inherit</param>
<param name="charting.chart">radialGauge</param>
<param name="charting.chart.nullValueMode">gaps</param>
<param name="charting.chart.sliceCollapsingThreshold">0.01</param>
<param name="charting.chart.stackMode">default</param>
<param name="charting.chart.style">shiny</param>
<param name="charting.drilldown">all</param>
<param name="charting.layout.splitSeries">0</param>
<param name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</param>
<param name="charting.legend.placement">right</param>
<module name="FlashChart">
</module>
</module>
</module>
</module>

</module>
</view> 
0 Karma
Highlighted

Re: How can I create a dashboard with six radial gauges in a single row?

SplunkTrust
SplunkTrust

The problem is a limitation in Splunk's core dashboard layout system, compounded by a bug in Splunk's error messaging (See below for more technical details)

The only solution is to rework your dashboard so that you only have 3 columns of panels. In other words you can't have any col4, col5, col6 as above.

What you might want to do, is to use the weird layoutPanel values that are internal to a given rounded-corner panel. each panel, say panelrow1col1, can have modules rendered into panelrow1col1grp1, panelrow1col1grp2, panelrow1col1_grp3, and so on and so forth. You should be able to do 6, although at some point they may start wrapping when the browser window is not wide enough.


Aforementioned More Technical Details

As of 6.0, that error message is displayed whenever various dashboard layout limitations are hit. One of those limitations is that there can only be 50 rows. However the same message is displayed if you have too many columns, or if you have a mistake in a layoutPanel attribute, or several other kinds of problems. It's quite confusing for the customer, because of course they take the error message at face value, when most of the time it is incorrect.

I filed this with splunk support late 2013 but as far as I know a bug was never filed. (support case number was 146260).

0 Karma