0

我正在尝试通过在我的文档中更改plotly图表。这原则上可以正常工作,但是,我想将下拉菜单设置为启动时的第一个元素。但是,此更改不会更新图表。如果我在呈现整个页面后运行相同的代码,或者使用延迟它可以工作。crosstalkRmarkdownJavaScript

因此,我假设在JavaScript运行更新时,plotly图形尚未呈现。该setTimeout解决方案有效,但这感觉是hackis。那么通知plotly/crosstalk输入更改的规范方法是什么?

在 gif 中,您会看到启动时绘图显示完整范围,仅在更改为b然后a相应地更新图表之后。我希望图表在启动时已经正确过滤。

代码

---
title: "Delay Plotly"
date: "1 2 2021"
output: html_document
---

```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE, message = FALSE)
```
```{r libs}
library(crosstalk)
library(plotly)
```

```{r gen-data}
set.seed(1)
mdat <- data.frame(x = rep(LETTERS[1:6], 6),
                   y = sample(100, 36, TRUE),
                   fill = factor(rep(rep(1:3, each = 6), 2)),
                   grp = rep(letters[1:2], each = 18),
                   id = paste0("id", 1:36),
                   stringsAsFactors = FALSE)
sd <- SharedData$new(mdat, key = ~ id)

```

```{js}
$(function() {
   // set dropdown to first element
   // setTimeout(function() { // uncomment for workaround
      $('.selectized').each(function(idx, el) {
         const sel = this.selectize;
         const options = Object.keys(sel.options);
         sel.setValue(options[0]);
      });
   // }, 1000); // uncomment for workaround
})
```


```{r}
bscols(
   filter_select("grp",
                "Group:",
                sd,
                ~ grp, multiple = FALSE),
   plot_ly(sd) %>%
      add_trace(x = ~ x, y = ~ y, type = "bar", color = ~ fill,
                marker = list(line = list(color = "white", width = 1)) ## add border to see the 2 groups
                ) %>%
      layout(barmode = "stack"))
```

图表未更新

4

1 回答 1

0

更顺畅的解决方法是使用window.onload钩子。这避免了指定超时延迟的需要,而$.ready不是在 DOM 加载后触发,而是整个页面准备就绪。正是我需要的,除非有专门的钩子plotly用于这种操作?plotly_afterplot似乎是合适的人选。再一次,这在$.ready

window.onload = function() {
   // set dropdown to first element
   $('.selectized').each(function(idx, el) {
      const sel = this.selectize;
      const options = Object.keys(sel.options);
      sel.setValue(options[0]);
   });

于 2021-02-02T08:09:03.593 回答