https://community.splunk.com/t5/Dashboards-Visualizations/Visualization-to-mimic-Atlassian-Statuspage/m-p/708546#M57976 <P>&nbsp;</P><P>Format your chart as stacked</P><LI-CODE lang="markup">| rename myApp as up | eval down=1-up</LI-CODE><P>&nbsp;</P> Sun, 12 Jan 2025 11:37:01 GMT ITWhisperer 2025-01-12T11:37:01Z https://community.splunk.com/t5/Dashboards-Visualizations/Visualization-to-mimic-Atlassian-Statuspage/m-p/708538#M57975 <P>I'm trying to create a simple status page visualization that mimics the style I've seen by Atlassian Statuspage.&nbsp; &nbsp;You can see it on the status page for <A href="https://discordstatus.com/#past-incidents" target="_blank" rel="noopener">Discord</A> and <A href="https://status.wiz.io/" target="_blank" rel="noopener">Wiz</A>.</P><P>Currently, I have a timechart and if status=1 then it's up, but if status=0 then it's down.&nbsp; When the app is down, there is simply no bar on the graph.&nbsp; How do I "force" a value for the bar to appear but then color each bar based on the status value.&nbsp; I think I'm missing something really simple and hoping someone can point me in the right direction.</P><P><STRONG>Current SPL</STRONG></P><LI-CODE lang="markup">index=main app="myApp" | eval status=if(isnull(status), "0", status) | timechart span=1m max(status) by app</LI-CODE><P>&nbsp;</P><P><STRONG>Current XML</STRONG></P><P>&nbsp;</P><LI-CODE lang="markup">&lt;dashboard version="1.1" theme="light"&gt; &lt;label&gt;Application Status&lt;/label&gt; &lt;row&gt; &lt;panel&gt; &lt;chart&gt; &lt;search&gt; &lt;query&gt;index=main app="myApp" | eval status=if(isnull(status), "0", status) | timechart span=1m max(status) by app&lt;/query&gt; &lt;earliest&gt;-60m@m&lt;/earliest&gt; &lt;latest&gt;now&lt;/latest&gt; &lt;sampleRatio&gt;1&lt;/sampleRatio&gt; &lt;/search&gt; &lt;option name="charting.axisLabelsX.majorLabelStyle.overflowMode"&gt;ellipsisNone&lt;/option&gt; &lt;option name="charting.axisLabelsX.majorLabelStyle.rotation"&gt;0&lt;/option&gt; &lt;option name="charting.axisLabelsY.majorUnit"&gt;1&lt;/option&gt; &lt;option name="charting.axisTitleX.visibility"&gt;collapsed&lt;/option&gt; &lt;option name="charting.axisTitleY.visibility"&gt;collapsed&lt;/option&gt; &lt;option name="charting.axisTitleY2.visibility"&gt;visible&lt;/option&gt; &lt;option name="charting.axisX.abbreviation"&gt;none&lt;/option&gt; &lt;option name="charting.axisX.scale"&gt;linear&lt;/option&gt; &lt;option name="charting.axisY.abbreviation"&gt;none&lt;/option&gt; &lt;option name="charting.axisY.maximumNumber"&gt;1&lt;/option&gt; &lt;option name="charting.axisY.minimumNumber"&gt;0&lt;/option&gt; &lt;option name="charting.axisY.scale"&gt;linear&lt;/option&gt; &lt;option name="charting.axisY2.abbreviation"&gt;none&lt;/option&gt; &lt;option name="charting.axisY2.enabled"&gt;0&lt;/option&gt; &lt;option name="charting.axisY2.scale"&gt;inherit&lt;/option&gt; &lt;option name="charting.chart"&gt;column&lt;/option&gt; &lt;option name="charting.chart.bubbleMaximumSize"&gt;50&lt;/option&gt; &lt;option name="charting.chart.bubbleMinimumSize"&gt;10&lt;/option&gt; &lt;option name="charting.chart.bubbleSizeBy"&gt;area&lt;/option&gt; &lt;option name="charting.chart.columnSpacing"&gt;0&lt;/option&gt; &lt;option name="charting.chart.nullValueMode"&gt;gaps&lt;/option&gt; &lt;option name="charting.chart.showDataLabels"&gt;none&lt;/option&gt; &lt;option name="charting.chart.sliceCollapsingThreshold"&gt;0.01&lt;/option&gt; &lt;option name="charting.chart.stackMode"&gt;default&lt;/option&gt; &lt;option name="charting.chart.style"&gt;shiny&lt;/option&gt; &lt;option name="charting.drilldown"&gt;none&lt;/option&gt; &lt;option name="charting.seriesColors"&gt;[0x459240]&lt;/option&gt; &lt;option name="charting.layout.splitSeries"&gt;0&lt;/option&gt; &lt;option name="charting.layout.splitSeries.allowIndependentYRanges"&gt;0&lt;/option&gt; &lt;option name="charting.legend.labelStyle.overflowMode"&gt;ellipsisMiddle&lt;/option&gt; &lt;option name="charting.legend.mode"&gt;standard&lt;/option&gt; &lt;option name="charting.legend.placement"&gt;none&lt;/option&gt; &lt;option name="charting.lineWidth"&gt;2&lt;/option&gt; &lt;option name="trellis.enabled"&gt;0&lt;/option&gt; &lt;option name="trellis.scales.shared"&gt;1&lt;/option&gt; &lt;option name="trellis.size"&gt;medium&lt;/option&gt; &lt;/chart&gt; &lt;/panel&gt; &lt;/row&gt; &lt;/dashboard&gt;</LI-CODE><P><span class="lia-inline-image-display-wrapper lia-image-align-center" image-alt="visualize.png" style="width: 999px;"><img src="https://community.splunk.com/t5/image/serverpage/image-id/34111iA4950861F4F5C1E2/image-size/large?v=v2&amp;px=999" role="button" title="visualize.png" alt="visualize.png" /><span class="lia-inline-image-caption" onclick="event.preventDefault();">visualize.png</span></span></P><P>&nbsp;</P><P>&nbsp;</P> Sun, 12 Jan 2025 00:49:59 GMT https://community.splunk.com/t5/Dashboards-Visualizations/Visualization-to-mimic-Atlassian-Statuspage/m-p/708538#M57975 DEADBEEF 2025-01-12T00:49:59Z https://community.splunk.com/t5/Dashboards-Visualizations/Visualization-to-mimic-Atlassian-Statuspage/m-p/708546#M57976 <P>&nbsp;</P><P>Format your chart as stacked</P><LI-CODE lang="markup">| rename myApp as up | eval down=1-up</LI-CODE><P>&nbsp;</P> Sun, 12 Jan 2025 11:37:01 GMT https://community.splunk.com/t5/Dashboards-Visualizations/Visualization-to-mimic-Atlassian-Statuspage/m-p/708546#M57976 ITWhisperer 2025-01-12T11:37:01Z