Added Dash code

Kalpit Desai · Kalpit Desai · commit 8c4a8edd800e · 2021-08-05T22:27:22.000+05:30
diff --git a/r/2021-08-03-horizontal-vertical-shapes.rmd b/r/2021-08-03-horizontal-vertical-shapes.rmd
@@ -56,6 +56,68 @@ fig <- plot_ly(data = iris, x = ~Petal.Length, y = ~Petal.Width,
 fig
 ```
 
+### Horizontal and Vertical Lines in Dash
+
+[Dash for R](https://dashr.plotly.com) is an open-source framework for building analytical applications, with no Javascript required, and it is tightly integrated with the Plotly graphing library.
+
+Learn about how to install Dash for R at https://dashr.plot.ly/installation.
+
+Everywhere in this page that you see fig, you can display the same figure in a Dash for R application by passing it to the figure argument.
+
+```{r}
+
+library(dash)
+library(dashCoreComponents)
+library(dashHtmlComponents)
+library(plotly)
+data("iris")
+
+vline <- function(x = 0, color = "green") {
+  list(
+    type = "line", 
+    y0 = 0, 
+    y1 = 1, 
+    yref = "paper",
+    x0 = x, 
+    x1 = x, 
+    line = list(color = color, dash="dot")
+  )
+}
+
+app <- Dash$new()
+
+app$layout(
+  htmlDiv(
+    list(
+      dccGraph(id = 'graph-with-slider'),
+      htmlLabel('Position of hline'),
+      dccSlider(
+        id='slider',
+        min = 1,
+        max = 7,
+        marks = c("","1","","","","","","7"),
+        value = 2.5, 
+        step=0.1
+      )
+      
+    )
+  )
+)
+app$callback(
+  output(id = 'graph-with-slider', property='figure'),
+  params=list(input(id='slider', property='value')),
+  function(value) {
+    fig <- plot_ly(data = iris, x = ~Petal.Length, y = ~Petal.Width, 
+                   type = 'scatter', mode = 'markers') %>%
+      layout(shapes = list(vline(value), list(type = "rect",
+                                            fillcolor = "red", line = list(color = "red"), opacity = 0.2,
+                                            y0 = 0.9, y1 = 2.6, x0 = 0.5, x1 = 7.5))) 
+    return(fig)
+  })
+```
+
+After executing this code, give app$run_server() in the console to start the dash.
+
 ### Adding Text Annotations
 
 [Text annotations](https://plotly.com/r/text-and-annotations/) can optionally be added to a shape using the `add_text` keyword argument, and positioned using the `x` and `y` arguments:
