<p><div><div><div><div data-show-faces="false" data-height="21" data-width="100" data-layout="button_count" data-send="true" data-href="https://www.r-bloggers.com/shiny-slider-examples-with-the-intrval-r-package/"></div></div><div></div></div><div></div></div>
<div>
(This article was first published on <strong><a href="http://peter.solymos.org/code/2018/03/08/shiny-slider-examples-with-the-intrval-r-package.html"> Peter Solymos - R related posts</a></strong>, and kindly contributed to <a rel="nofollow" href="https://www.r-bloggers.com/">R-bloggers)</a> </div>
<p>The <a rel="nofollow" href="https://github.com/psolymos/intrval#readme" target="_blank"><strong>intrval</strong></a> R package is lightweight (~11K), standalone (apart from importing from <strong>graphics</strong>, has exactly 0 non-<strong>base</strong> dependency), and it has a very narrow scope: it implements relational operators for intervals — very well aligned with the <a rel="nofollow" href="http://www.tinyverse.org/" target="_blank"><em>tiny manifesto</em></a>. In this post we will explore the use of the package in two <a rel="nofollow" href="https://shiny.rstudio.com/" target="_blank"><strong>shiny</strong></a> apps with <a rel="nofollow" href="https://shiny.rstudio.com/articles/sliders.html" target="_blank">sliders</a>.</p>
<p>The first example uses a regular slider that returns a single value. To make that an interval, we will use standard deviation (SD, <em>sigma</em>) in a quality control chart (<a rel="nofollow" href="https://en.wikipedia.org/wiki/Control_chart" target="_blank">QCC</a>). The code is based on the <code>pistonrings</code> data set from the <a rel="nofollow" href="https://cran.r-project.org/package=qcc" target="_blank"><strong>qcc</strong></a> package. The Shewhart chart sets 3-_sigma_ limit to indicate state of control. The slider is used to adjusts the <em>sigma</em> limit and the GIF below plays is as an animation.</p>
<div>
<div>
<pre><code><span>library</span><span>(</span><span>shiny</span><span>)</span><span>
</span><span>library</span><span>(</span><span>intrval</span><span>)</span><span>
</span><span>library</span><span>(</span><span>qcc</span><span>)</span><span>
</span><span>data</span><span>(</span><span>pistonrings</span><span>)</span><span>
</span><span>mu</span><span> </span><span>&lt;-</span><span> </span><span>mean</span><span>(</span><span>pistonrings</span><span>$</span><span>diameter</span><span>[</span><span>pistonrings</span><span>$</span><span>trial</span><span>])</span><span>
</span><span>SD</span><span> </span><span>&lt;-</span><span> </span><span>sd</span><span>(</span><span>pistonrings</span><span>$</span><span>diameter</span><span>[</span><span>pistonrings</span><span>$</span><span>trial</span><span>])</span><span>
</span><span>x</span><span> </span><span>&lt;-</span><span> </span><span>pistonrings</span><span>$</span><span>diameter</span><span>[</span><span>!</span><span>pistonrings</span><span>$</span><span>trial</span><span>]</span><span>
</span><span>## UI function</span><span>
</span><span>ui</span><span> </span><span>&lt;-</span><span> </span><span>fluidPage</span><span>(</span><span>
</span><span>plotOutput</span><span>(</span><span>&quot;plot&quot;</span><span>),</span><span>
</span><span>sliderInput</span><span>(</span><span>&quot;x&quot;</span><span>,</span><span> </span><span>&quot;x SD:&quot;</span><span>,</span><span>
</span><span>min</span><span>=</span><span>0</span><span>,</span><span> </span><span>max</span><span>=</span><span>5</span><span>,</span><span> </span><span>value</span><span>=</span><span>0</span><span>,</span><span> </span><span>step</span><span>=</span><span>0.1</span><span>,</span><span>
</span><span>animate</span><span>=</span><span>animationOptions</span><span>(</span><span>100</span><span>)</span><span>
</span><span>)</span><span>
</span><span>)</span><span>
</span><span># Server logic</span><span>
</span><span>server</span><span> </span><span>&lt;-</span><span> </span><span>function</span><span>(</span><span>input</span><span>,</span><span> </span><span>output</span><span>)</span><span> </span><span>{</span><span>
</span><span>output</span><span>$</span><span>plot</span><span> </span><span>&lt;-</span><span> </span><span>renderPlot</span><span>({</span><span>
</span><span>Main</span><span> </span><span>&lt;-</span><span> </span><span>paste</span><span>(</span><span>&quot;Shewhart quality control chart&quot;</span><span>,</span><span>
</span><span>&quot;diameter of piston rings&quot;</span><span>,</span><span> </span><span>sprintf</span><span>(</span><span>&quot;+/- %.1f SD&quot;</span><span>,</span><span> </span><span>input</span><span>$</span><span>x</span><span>),</span><span>
</span><span>sep</span><span>=</span><span>&quot;\n&quot;</span><span>)</span><span>
</span><span>iv</span><span> </span><span>&lt;-</span><span> </span><span>mu</span><span> </span><span>+</span><span> </span><span>input</span><span>$</span><span>x</span><span> </span><span>*</span><span> </span><span>c</span><span>(</span><span>-</span><span>SD</span><span>,</span><span> </span><span>SD</span><span>)</span><span>
</span><span>plot</span><span>(</span><span>x</span><span>,</span><span> </span><span>pch</span><span> </span><span>=</span><span> </span><span>19</span><span>,</span><span> </span><span>col</span><span> </span><span>=</span><span> </span><span>x</span><span> </span><span>%)(%</span><span> </span><span>iv</span><span> </span><span>+1</span><span>,</span><span> </span><span>type</span><span> </span><span>=</span><span> </span><span>&quot;b&quot;</span><span>,</span><span>
</span><span>ylim</span><span> </span><span>=</span><span> </span><span>mu</span><span> </span><span>+</span><span> </span><span>5</span><span> </span><span>*</span><span> </span><span>c</span><span>(</span><span>-</span><span>SD</span><span>,</span><span> </span><span>SD</span><span>),</span><span> </span><span>main</span><span> </span><span>=</span><span> </span><span>Main</span><span>)</span><span>
</span><span>abline</span><span>(</span><span>h</span><span> </span><span>=</span><span> </span><span>mu</span><span>)</span><span>
</span><span>abline</span><span>(</span><span>h</span><span> </span><span>=</span><span> </span><span>iv</span><span>,</span><span> </span><span>lty</span><span> </span><span>=</span><span> </span><span>2</span><span>)</span><span>
</span><span>})</span><span>
</span><span>}</span><span>
</span><span>## Run shiny app</span><span>
</span><span>if</span><span> </span><span>(</span><span>interactive</span><span>())</span><span> </span><span>shinyApp</span><span>(</span><span>ui</span><span>,</span><span> </span><span>server</span><span>)</span><span>
</span></code></pre>
</div>
</div>
<p><img alt="regular slider" src="https://i1.wp.com/github.com/psolymos/intrval/raw/master/extras/regular_slider.gif?w=456&ssl=1" data-recalc-dims="1"></p>
<p>The second example uses range slider returning two values, which is our interval. To spice things up a bit, we combine intervals on two axes to color some random points. The next range slider defines a distance interval and colors the random points inside the ring.</p>
<div>
<div>
<pre><code><span>library</span><span>(</span><span>shiny</span><span>)</span><span>
</span><span>library</span><span>(</span><span>intrval</span><span>)</span><span>
</span><span>set.seed</span><span>(</span><span>1</span><span>)</span><span>
</span><span>n</span><span> </span><span>&lt;-</span><span> </span><span>10</span><span>^</span><span>4</span><span>
</span><span>x</span><span> </span><span>&lt;-</span><span> </span><span>round</span><span>(</span><span>runif</span><span>(</span><span>n</span><span>,</span><span> </span><span>-2</span><span>,</span><span> </span><span>2</span><span>),</span><span> </span><span>2</span><span>)</span><span>
</span><span>y</span><span> </span><span>&lt;-</span><span> </span><span>round</span><span>(</span><span>runif</span><span>(</span><span>n</span><span>,</span><span> </span><span>-2</span><span>,</span><span> </span><span>2</span><span>),</span><span> </span><span>2</span><span>)</span><span>
</span><span>d</span><span> </span><span>&lt;-</span><span> </span><span>round</span><span>(</span><span>sqrt</span><span>(</span><span>x</span><span>^</span><span>2</span><span> </span><span>+</span><span> </span><span>y</span><span>^</span><span>2</span><span>),</span><span> </span><span>2</span><span>)</span><span>
</span><span>## UI function</span><span>
</span><span>ui</span><span> </span><span>&lt;-</span><span> </span><span>fluidPage</span><span>(</span><span>
</span><span>titlePanel</span><span>(</span><span>&quot;intrval example with shiny&quot;</span><span>),</span><span>
</span><span>sidebarLayout</span><span>(</span><span>
</span><span>sidebarPanel</span><span>(</span><span>
</span><span>sliderInput</span><span>(</span><span>&quot;bb_x&quot;</span><span>,</span><span> </span><span>&quot;x value:&quot;</span><span>,</span><span>
</span><span>min</span><span>=</span><span>min</span><span>(</span><span>x</span><span>),</span><span> </span><span>max</span><span>=</span><span>max</span><span>(</span><span>x</span><span>),</span><span> </span><span>value</span><span>=</span><span>range</span><span>(</span><span>x</span><span>),</span><span>
</span><span>step</span><span>=</span><span>round</span><span>(</span><span>diff</span><span>(</span><span>range</span><span>(</span><span>x</span><span>))</span><span>/</span><span>20</span><span>,</span><span> </span><span>1</span><span>),</span><span> </span><span>animate</span><span>=</span><span>TRUE</span><span>
</span><span>),</span><span>
</span><span>sliderInput</span><span>(</span><span>&quot;bb_y&quot;</span><span>,</span><span> </span><span>&quot;y value:&quot;</span><span>,</span><span>
</span><span>min</span><span> </span><span>=</span><span> </span><span>min</span><span>(</span><span>y</span><span>),</span><span> </span><span>max</span><span> </span><span>=</span><span> </span><span>max</span><span>(</span><span>y</span><span>),</span><span> </span><span>value</span><span> </span><span>=</span><span> </span><span>range</span><span>(</span><span>y</span><span>),</span><span>
</span><span>step</span><span>=</span><span>round</span><span>(</span><span>diff</span><span>(</span><span>range</span><span>(</span><span>y</span><span>))</span><span>/</span><span>20</span><span>,</span><span> </span><span>1</span><span>),</span><span> </span><span>animate</span><span>=</span><span>TRUE</span><span>
</span><span>),</span><span>
</span><span>sliderInput</span><span>(</span><span>&quot;bb_d&quot;</span><span>,</span><span> </span><span>&quot;radial distance:&quot;</span><span>,</span><span>
</span><span>min</span><span> </span><span>=</span><span> </span><span>0</span><span>,</span><span> </span><span>max</span><span> </span><span>=</span><span> </span><span>max</span><span>(</span><span>d</span><span>),</span><span> </span><span>value</span><span> </span><span>=</span><span> </span><span>c</span><span>(</span><span>0</span><span>,</span><span> </span><span>max</span><span>(</span><span>d</span><span>)</span><span>/</span><span>2</span><span>),</span><span>
</span><span>step</span><span>=</span><span>round</span><span>(</span><span>max</span><span>(</span><span>d</span><span>)</span><span>/</span><span>20</span><span>,</span><span> </span><span>1</span><span>),</span><span> </span><span>animate</span><span>=</span><span>TRUE</span><span>
</span><span>)</span><span>
</span><span>),</span><span>
</span><span>mainPanel</span><span>(</span><span>
</span><span>plotOutput</span><span>(</span><span>&quot;plot&quot;</span><span>)</span><span>
</span><span>)</span><span>
</span><span>)</span><span>
</span><span>)</span><span>
</span><span># Server logic</span><span>
</span><span>server</span><span> </span><span>&lt;-</span><span> </span><span>function</span><span>(</span><span>input</span><span>,</span><span> </span><span>output</span><span>)</span><span> </span><span>{</span><span>
</span><span>output</span><span>$</span><span>plot</span><span> </span><span>&lt;-</span><span> </span><span>renderPlot</span><span>({</span><span>
</span><span>iv1</span><span> </span><span>&lt;-</span><span> </span><span>x</span><span> </span><span>%[]%</span><span> </span><span>input</span><span>$</span><span>bb_x</span><span> </span><span>&amp;</span><span> </span><span>y</span><span> </span><span>%[]%</span><span> </span><span>input</span><span>$</span><span>bb_y</span><span>
</span><span>iv2</span><span> </span><span>&lt;-</span><span> </span><span>x</span><span> </span><span>%[]%</span><span> </span><span>input</span><span>$</span><span>bb_y</span><span> </span><span>&amp;</span><span> </span><span>y</span><span> </span><span>%[]%</span><span> </span><span>input</span><span>$</span><span>bb_x</span><span>
</span><span>iv3</span><span> </span><span>&lt;-</span><span> </span><span>d</span><span> </span><span>%()%</span><span> </span><span>input</span><span>$</span><span>bb_d</span><span>
</span><span>op</span><span> </span><span>&lt;-</span><span> </span><span>par</span><span>(</span><span>mfrow</span><span>=</span><span>c</span><span>(</span><span>1</span><span>,</span><span>2</span><span>))</span><span>
</span><span>plot</span><span>(</span><span>x</span><span>,</span><span> </span><span>y</span><span>,</span><span> </span><span>pch</span><span> </span><span>=</span><span> </span><span>19</span><span>,</span><span> </span><span>cex</span><span> </span><span>=</span><span> </span><span>0.25</span><span>,</span><span> </span><span>col</span><span> </span><span>=</span><span> </span><span>iv1</span><span> </span><span>+</span><span> </span><span>iv2</span><span> </span><span>+</span><span> </span><span>3</span><span>,</span><span>
</span><span>main</span><span> </span><span>=</span><span> </span><span>&quot;Intersecting bounding boxes&quot;</span><span>)</span><span>
</span><span>plot</span><span>(</span><span>x</span><span>,</span><span> </span><span>y</span><span>,</span><span> </span><span>pch</span><span> </span><span>=</span><span> </span><span>19</span><span>,</span><span> </span><span>cex</span><span> </span><span>=</span><span> </span><span>0.25</span><span>,</span><span> </span><span>col</span><span> </span><span>=</span><span> </span><span>iv3</span><span> </span><span>+</span><span> </span><span>1</span><span>,</span><span>
</span><span>main</span><span> </span><span>=</span><span> </span><span>&quot;Deck the halls:\ndistance range from center&quot;</span><span>)</span><span> </span><span>par</span><span>(</span><span>op</span><span>)</span><span>
</span><span>})</span><span>
</span><span>}</span><span>
</span><span>## Run shiny app</span><span>
</span><span>if</span><span> </span><span>(</span><span>interactive</span><span>())</span><span> </span><span>shinyApp</span><span>(</span><span>ui</span><span>,</span><span> </span><span>server</span><span>)</span><span>
</span></code></pre>
</div>
</div>
<p><img alt="range slider" src="https://i1.wp.com/github.com/psolymos/intrval/raw/master/extras/range_slider.gif?w=456&ssl=1" data-recalc-dims="1"></p>
<p>If you think there are other use cases for <strong>intrval</strong> in <strong>shiny</strong> applications, let me know in the comments section!</p>
	<p>
<div>
<div>To <strong>leave a comment</strong> for the author, please follow the link and comment on their blog: <strong><a href="http://peter.solymos.org/code/2018/03/08/shiny-slider-examples-with-the-intrval-r-package.html"> Peter Solymos - R related posts</a></strong>.</div>
<hr>
<a rel="nofollow" href="https://www.r-bloggers.com/">R-bloggers.com</a> offers <strong><a rel="nofollow" href="https://feedburner.google.com/fb/a/mailverify?uri=RBloggers">daily e-mail updates</a></strong> about <a rel="nofollow" href="https://www.r-project.org/" title="The R Project for Statistical Computing">R</a> news and <a rel="nofollow" href="https://www.r-bloggers.com/search/tutorial" title="R tutorials">tutorials</a> on topics such as: <a rel="nofollow" href="https://www.r-bloggers.com/search/data%20science" title="Data science">Data science</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/Big%20Data" title="Big Data">Big Data, <a rel="nofollow" href="https://www.r-users.com/" title="R jobs">R jobs</a>, visualization (<a rel="nofollow" href="https://www.r-bloggers.com/search/ggplot2" title="ggplot and ggplot2 tutorials">ggplot2</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/boxplot" title="Boxplots using lattice and ggplot2 tutorials">Boxplots</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/map" title="Maps and gis">maps</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/animation" title="Animation in R">animation</a>), programming (<a rel="nofollow" href="https://www.r-bloggers.com/search/RStudio" title="RStudio IDE for R">RStudio</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/sweave" title="Sweave and literate programming">Sweave</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/LaTeX" title="LaTeX in R">LaTeX</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/SQL" title="SQL and databases">SQL</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/eclipse" title="Eclipse IDE for R">Eclipse</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/git" title="git and github, Version Control System">git</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/hadoop" title="Large data in R using Hadoop">hadoop</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/Web+Scraping" title="Web Scraping of google, facebook, yahoo, twitter and more using R">Web Scraping</a>) statistics (<a rel="nofollow" href="https://www.r-bloggers.com/search/regression" title="Regressions and ANOVA analysis tutorials">regression</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/PCA" title="principal component analysis tutorial">PCA</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/time+series" title="Time series">time series</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/trading" title="finance trading">trading</a>) and more...
<img width="1" alt="" src="http://feeds.feedburner.com/~r/RBloggers/~4/VaY95ab1U7g" height="1"></a></div>