Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Selecting a default value in an R plotly plot using a selectize box via crosstalk in R, using static html not shiny

In an Rmarkdown html document, how does one select a default value for a crosstalk::filter_select dropdown that will work with plotly plots? E.g., in the example below, to have just group 'a' selected when the RMD is knitted.

I know that for the reprex below example using plotly buttons would be easier, but when there are more than 4-5 or so choices the plotly dropdowns/buttons take up too much room/are quite ugly. Also hoping to avoid running a shiny server, the idea is to have everything running client side for speed purposes.

There is a PR in crosstalk that adds a "default choice" argument to the filter_select function, but that version doesn't work with plotly (https://github.com/rstudio/crosstalk/pull/70). I would guess the easiest way would be to add javascript to the doc to manipulate the crosstalk object, but a few experiments haven't gotten very far yet.

Reprex rmd:

---
output:
  html_document
---

```{r echo=FALSE, message=FALSE, warning=FALSE}


library(plotly)
# example data 
dat <- tibble::tribble(~filterBy, ~x, ~y,
                        "a", 1, 1,
                        "b", 2, 1,
                        "a", 1, 2,
                        "b", 2, 2,
                        "a", 1, 3,
                        "b", 2, 3,
                        "a", 1, 2,
                        "b", 2, 3,
                        "c", 3, 1,
                        "c", 3, 2,
                        "c", 3, 3
                        )  

# initializing a crosstalk shared data object  
plotdat <- highlight_key(dat)

# Filter dropdown
question_filter <- crosstalk::filter_select(
   "filter", "Select a group to examine",
   plotdat, ~filterBy, multiple = F
)

# Plotting:
plot <-  plot_ly( plotdat, 
    x = ~x, y = ~y, text = ~filterBy,  mode = "markers+text", 
    textposition = "top", hoverinfo = "x+y"
  )

# Just putting things together for easy display:
shiny::tags$div(class = 'flexbox',
                question_filter,
                shiny::tags$br(), 
                plot)


```
like image 912
FelixST Avatar asked Oct 06 '20 22:10

FelixST


People also ask

What R packages can I use with Plotly?

The plotly package is able to share graphical queries with a limited set of other R packages that build upon the htmlwidgets standard. At the moment, graphical queries work best with leaflet and DT.

How to create a graph with multiple boxplots in R?

If we want to create a graphic with multiple boxplots, we have to specify a column containing our numeric values, the grouping column, and the data frame containing our data: Figure 2: Multiple Boxplots in Same Graphic. As you can see based on Figure 2, the previous R code created a graph with multiple boxplots.

How to align boxplots horizontally in R?

We can align our boxplots horizontally with the argument horizontal = TRUE: Figure 4: Horizontally Aligned Boxplots. As you can see based on Figure 4, the previous R syntax changed the X- and Y-Axes of our plot. If we want to make the middle of our boxplots thinner, we can use the notch argument:

How do I plot data from base installation of R?

We can now plot these data with the boxplot () function of the base installation of R: Figure 1 visualizes the output of the boxplot command: A box-and-whisker plot.


3 Answers

You can directly manipulate the selectize boxes that crosstalk filter_select ouputs using javascript, the trick is triggering it on load like so:

```{js}
function filter_default() {
    document.getElementById("filter").getElementsByClassName("selectized")[0].selectize.setValue("a", false);
}
window.onload = filter_default;
```
like image 162
FelixST Avatar answered Oct 06 '22 13:10

FelixST


Just to complement the accepted answer, which did function in the RStudio viewer in my case, but not in Chrome/Edge/IE/Firefox: the jQuery event Document.ready solved the problem (idea from this thread)

$(document).ready(function() {
    document.getElementById("filter").getElementsByClassName("selectized")[0].selectize.setValue("a", false);
});
like image 30
Laszlo Avatar answered Oct 06 '22 12:10

Laszlo


The problem appeared to have been solved here by installing ”rstudio/crosstalk#70”. Then you will be able to use the select option

like image 2
Cesautica Avatar answered Oct 06 '22 13:10

Cesautica