使用选择框通过R中的串扰在R绘图图中选择默认值，使用静态html不发光

编程问答 2022-06-10

问题描述

在Rmarkdown html文档中，如何选择适用于可打印绘图的crosstalk :: filter_select下拉列表的默认值？例如，在下面的示例中，在编织RMD时只选择了“ a”组。

我知道对于下面的reprex示例，使用plotly按钮会更容易，但是当有4-5个左右的选项时，plotly下拉菜单/按钮会占用太多空间/非常难看。同样希望避免运行闪亮的服务器，其目的是使所有内容都在客户端运行以提高速度。

串扰中有一个PR，它向filter_select函数添加了“默认选择”参数，但是该版本不适用于plotly（https://github.com/rstudio/crosstalk/pull/70）。我想最简单的方法是将javascript添加到文档中以处理串扰对象，但是还没有进行一些实验。

Reprex rmd：

---
output:
  html_document
---

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


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


```

解决方法

您可以使用javascript直接操纵与filter_select输出串扰的选择框，诀窍是像这样在加载时触发它：

```{js}
function filter_default() {
    document.getElementById("filter").getElementsByClassName("selectized")[0].selectize.setValue("a",false);
}
window.onload = filter_default;
```
,

只是为了补充已接受的答案，在我的例子中它在 RStudio 查看器中起作用，但在 Chrome/Edge/IE/Firefox 中不起作用：jQuery 事件 Document.ready 解决了这个问题 (idea from this thread)> 

<!DOCTYPE html>
<html>

<head>
  <title>Hello world</title>
</head>

<body>
  <p>Lorem ipsum dolor sit amet,consectetur adipiscing elit,sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
    in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident,sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  <p>Lorem ipsum dolor sit amet,sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  <div id="hello-world">
    <p>Hello World</p>
  </div>
<p>Lorem ipsum dolor sit amet,sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</body>

</html>
flexdashboardjavascriptrrr-plotlyshiny