Quarto Panel Tabset and Wordcloud #5884

racing-focus · 2023-06-12T01:11:22Z

Bug description

I produced a quarto file to produce the following in January 2023.

https://racing-focus.netlify.app/data/article_4/article_4.html

The code can be found at

https://github.com/racing-focus/racing/tree/main/data/article_4

I had attempted to loop through the tabset, but that failed. So I produced them manually like so.

### 2015 {.active}


#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 1
wordcloud2(y1, size = 0.36)


### 2016 {.active}


#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 2
wordcloud2(y2, size = 0.36)

etc....

the main issue I had, when they appear, they appear vertically, but after clicking through the tabsets they appear as they should. I don't know why.

I don't know what version of quarto I was using at the time. I am now using.

Mac OS | quarto-1.3.361-macos.pkg
-- | --
Mac OS	[quarto-1.3.361-macos.pkg](https://github.com/quarto-dev/quarto-cli/releases/download/v1.3.361/quarto-1.3.361-macos.pkg)

the issue I am having is when I render the qmd file, 2015 wordcloud appears, but 2016 and beyond are blank.

Is there a reason why this is happening. I really don't have knowledge about how widgets work. I know it worked repetitively in January, and now I have updated two csv input files for the qmd, it now doesn't work.

Any understanding would be appreciated.

You may be able to reproduce the problem with the GitHub repo I have provided a link to.

Cheers,

Steps to reproduce

No response

Expected behavior

All Wordclouds should appear in tabsets.

Actual behavior

Only one wordcloud appears for the first tabset.

Your environment

RStudio
2023.03.1 Build 446
"Cherry Blossom" Release (6e31ffc3, 2023-05-09) for macOS

Quarto check output

[✓] Checking versions of quarto binary dependencies...
Pandoc version 3.1.1: OK
Dart Sass version 1.55.0: OK
[✓] Checking versions of quarto dependencies......OK
[✓] Checking Quarto installation......OK
Version: 1.3.361
Path: /Applications/quarto/bin

[✓] Checking basic markdown render....OK

[✓] Checking Python 3 installation....OK
Version: 3.9.13
Path: /usr/local/opt/[email protected]/bin/python3.9
Jupyter: (None)

  Jupyter is not available in this Python installation.
  Install with python3 -m pip install jupyter

[✓] Checking R installation...........OK
Version: 4.3.0
Path: /Library/Frameworks/R.framework/Resources
LibPaths:
- /Library/Frameworks/R.framework/Versions/4.3-x86_64/Resources/library
knitr: 1.42
rmarkdown: 2.21

[✓] Checking Knitr engine render......OK

The text was updated successfully, but these errors were encountered:

mcanouil · 2023-06-12T05:02:59Z

Thanks for the report!

Could you format your example as described below, and make it self-contained? Thanks.

You can share a Quarto document using the following syntax, i.e., using more backticks than you have in your document (usually four ````).

````qmd
---
title: "Reproducible Quarto Document"
format: html
---

This is a reproducible Quarto document using `format: html`.
It is written in Markdown and contains embedded R code.
When you run the code, it will produce a plot.

```{r}
plot(cars)
```

The end.
````

racing-focus · 2023-06-12T06:51:12Z

Thankyou for your reply.

My quarto file I have linked to opens up a csv file.

How do I self contain that here, to make it reproducible?

Here it is.

---
title: "aus racing pm - part 4"
date: "2023-01-11"
image: "preview.png"
categories:
  - nsw racing
  - pm
  - data
format:
  html:
    toc: true
    toc-depth: 2
    toc-location: left 
    number-sections: true
    number-depth: 3
    html-math-method: katex
    css: styles.css
    anchor-sections: true
    smooth-scroll: true
    embed-resources: false
execute: 
  echo: false
  warning: false
  message: false
params:
  da: "2023-01-17"
---

```{=html}
<style type="text/css">

.tab-content{
    #margin-bottom: 50px;
    #margin-top: 50px;
}

h2 { /* Header 2 */
  
  color: mediumaquamarine;
  text-transform: lowercase;
}


</style>
```
```{r}
#| label: setup
#| include: false

library(tidyverse)
library(lubridate) # need to install
library(broom)
library(kableExtra)
library(dplyr)
library(emo)
library(wordcloud)
library(wordcloud2)
library(scales)
library(plotly)
library(gt)
library(gtExtras)
library(knitr)
library(skimr) # need to install
library(bslib) # need to install
```

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false

pp <- read.csv("pp.csv")
qq <- read.csv("qq.csv")

qq <- qq %>%
  arrange(year) %>%
  mutate(pm_per = 100 - pm_per)

ss <- qq %>%
  filter(year == "2022")

x <- 1


```

Plan to look at some data and present it in a few articles. The fourth is this, a continuation, looking at prize money in australian racing.

This looks at how many golden tickets exist each year. How exclusive is the club that have the opportunity to race for the 'riches' on offer from racing nsw.

The 2022 prize money distribution charts showed that 1.5% of the races returned approximately 33% of the prize money.

This looks a reasonable point to take a cut, year on year to see who has the most opportunities to play.

## the 1.5% {.unnumbered}

In `r ss$year[1]`, there were `r ss$n_r[1]` races run for `r ss$pm_per[1]`% of the prize money available. The average prize money of these races was `r ss$ve_pm[1]` for a total of `r ss$to_pm[1]`.

An increase on the preceding years.

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false

qq %>%
  select(year, r_pm, pm_per, ve_pm, to_pm, n_r) %>%
  #mutate(pm_per = 100 - pm_per) %>%
  #mutate(pm = label_comma()(pm)) %>%
  #mutate(number_of_races = label_comma()(number_of_races)) %>%
  gt(rowname_col = "year") %>%
  gt_theme_espn() %>%
  #tab_header(title = y) %>%
  cols_width(
    year ~ px(75),
    r_pm ~ px(75),
    pm_per ~ px(75),
    n_r ~ px(75),
    ve_pm:to_pm ~ px(75)) %>%
  tab_spanner(
    label = "prize money",
    columns = r_pm:to_pm) %>%
  cols_align(
    align = "center",
    columns = year) %>%
  cols_align(
    align = "right",
    columns = r_pm:to_pm) %>%
  cols_label(
    r_pm = "minimum",
    pm_per = "percent",
    n_r = "# of races",
    ve_pm = "average",
    to_pm = "total")






```

## who are the 1.5% {.unnumbered}

The only way to practically look at 'who' is through trainers. I won't necessarily look at success, but opportunity. The opportunity to race for this level of prize money.

Therefore I will look at the individual runners trainers have and will consider runners starting at less than 15/1 as having an opportunity.

*For whatever reason, you need to go back and forth through the tabs to see one on each site. I don't know why,* `r emo::ji("shrug")`

<br />

::: panel-tabset
```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y1 <- pp %>%
    filter(year == "2015") %>%
    select(tr_name, n) %>%
    filter(n > 1)
y2 <- pp %>%
    filter(year == "2016") %>%
    select(tr_name, n) %>%
    filter(n > 1)
y3 <- pp %>%
    filter(year == "2017") %>%
    select(tr_name, n) %>%
    filter(n > 1)
y4 <- pp %>%
    filter(year == "2018") %>%
    select(tr_name, n) %>%
    filter(n > 1)
y5 <- pp %>%
    filter(year == "2019") %>%
    select(tr_name, n) %>%
    filter(n > 1)
y6 <- pp %>%
    filter(year == "2020") %>%
    select(tr_name, n) %>%
    filter(n > 1)
y7 <- pp %>%
    filter(year == "2021") %>%
    select(tr_name, n) %>%
    filter(n > 1)
y8 <- pp %>%
    filter(year == "2022") %>%
    select(tr_name, n) %>%
    filter(n > 1)




```

### 2015 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 1
wordcloud2(y1, size = 0.36)
```

### 2016 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 2
wordcloud2(y2, size = 0.36)
```

### 2017 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 3
wordcloud2(y3, size = 0.36)
```

### 2018 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 4
wordcloud2(y4, size = 0.36)
```

### 2019 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 5
wordcloud2(y5, size = 0.36)
```

### 2020 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 6
wordcloud2(y6, size = 0.36)
```

### 2021 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 7
wordcloud2(y7, size = 0.36)
```

### 2022 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 8
wordcloud2(y8, size = 0.36)
```
:::

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false



```

<br /> In `r ss$year[1]`, there were `r ss$n_tr[1]` trainers with one horse and `r ss$n_tr2[1]` with two horses in the stable capable of competing at this level. The number of horses capable is `r ss$n_run[1]`.

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false

qq %>%
  select(year, n_tr, n_tr2, n_run) %>%
  #mutate(pm_per = 100 - pm_per) %>%
  #mutate(pm = label_comma()(pm)) %>%
  #mutate(number_of_races = label_comma()(number_of_races)) %>%
  gt(rowname_col = "year") %>%
  gt_theme_espn() %>%
  #tab_header(title = y) %>%
  cols_width(
    year ~ px(75),
    n_tr ~ px(75),
    n_tr2 ~ px(75),
    n_run ~ px(75)) %>%
  tab_spanner(
    label = "trainers with",
    columns = n_tr:n_tr2) %>%
  cols_align(
    align = "center",
    columns = year) %>%
  cols_align(
    align = "right",
    columns = n_tr:n_run) %>%
  cols_label(
    n_tr = "one horse",
    n_tr2 = "two horses",
    n_run = "# of horses")



```

mcanouil · 2023-06-12T07:27:45Z

The idea was mostly to add the format (such as html) and to format your original post (you can edit it) to ensure the code blocks appear.

Are everything in your example (the big one) really needed for us to reproduce?

racing-focus · 2023-06-12T07:40:22Z

Thankyou.

Probably only the following might be needed.

It does look up csv files that are in the repo.

---
title: "aus racing pm - part 4"
date: "2023-01-11"
image: "preview.png"
categories:
  - nsw racing
  - pm
  - data
format:
  html:
    toc: true
    toc-depth: 2
    toc-location: left 
    number-sections: true
    number-depth: 3
    html-math-method: katex
    css: styles.css
    anchor-sections: true
    smooth-scroll: true
    embed-resources: false
execute: 
  echo: false
  warning: false
  message: false
params:
  da: "2023-01-17"
---

```{=html}
<style type="text/css">

.tab-content{
    #margin-bottom: 50px;
    #margin-top: 50px;
}

h2 { /* Header 2 */
  
  color: mediumaquamarine;
  text-transform: lowercase;
}


</style>
```
```{r}
#| label: setup
#| include: false

library(tidyverse)
library(lubridate) # need to install
library(broom)
library(kableExtra)
library(dplyr)
library(emo)
library(wordcloud)
library(wordcloud2)
library(scales)
library(plotly)
library(gt)
library(gtExtras)
library(knitr)
library(skimr) # need to install
library(bslib) # need to install
```

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false

pp <- read.csv("pp.csv")
qq <- read.csv("qq.csv")

qq <- qq %>%
  arrange(year) %>%
  mutate(pm_per = 100 - pm_per)

ss <- qq %>%
  filter(year == "2022")

x <- 1


```


*For whatever reason, you need to go back and forth through the tabs to see one on each site. I don't know why,* `r emo::ji("shrug")`

<br />

::: panel-tabset
```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y1 <- pp %>%
    filter(year == "2015") %>%
    select(tr_name, n) %>%
    filter(n > 1)
y2 <- pp %>%
    filter(year == "2016") %>%
    select(tr_name, n) %>%
    filter(n > 1)
y3 <- pp %>%
    filter(year == "2017") %>%
    select(tr_name, n) %>%
    filter(n > 1)
y4 <- pp %>%
    filter(year == "2018") %>%
    select(tr_name, n) %>%
    filter(n > 1)
y5 <- pp %>%
    filter(year == "2019") %>%
    select(tr_name, n) %>%
    filter(n > 1)
y6 <- pp %>%
    filter(year == "2020") %>%
    select(tr_name, n) %>%
    filter(n > 1)
y7 <- pp %>%
    filter(year == "2021") %>%
    select(tr_name, n) %>%
    filter(n > 1)
y8 <- pp %>%
    filter(year == "2022") %>%
    select(tr_name, n) %>%
    filter(n > 1)




```

### 2015 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 1
wordcloud2(y1, size = 0.36)
```

### 2016 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 2
wordcloud2(y2, size = 0.36)
```

### 2017 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 3
wordcloud2(y3, size = 0.36)
```

### 2018 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 4
wordcloud2(y4, size = 0.36)
```

### 2019 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 5
wordcloud2(y5, size = 0.36)
```

### 2020 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 6
wordcloud2(y6, size = 0.36)
```

### 2021 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 7
wordcloud2(y7, size = 0.36)
```

### 2022 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 8
wordcloud2(y8, size = 0.36)
```
:::

cscheid · 2023-06-12T15:08:53Z

Can you please try to create a smaller file that still causes your problem? That will make it easier for us to track down the issue.

racing-focus · 2023-06-13T04:26:15Z

how about this? the 2016 doesn't plot?

as you can see, it was plotting in January.

https://racing-focus.netlify.app/data/article_4/article_4.html

---
title: "aus racing pm - part 4"
date: "2023-01-11"
categories:
  - nsw racing
  - pm
  - data
format:
  html:
    toc: true
    toc-depth: 2
    toc-location: left 
    number-sections: true
    number-depth: 3
    html-math-method: katex
    css: styles.css
    anchor-sections: true
    smooth-scroll: true
    embed-resources: false
execute: 
  echo: false
  warning: false
  message: false
params:
  da: "2023-01-17"
---

```{=html}
<style type="text/css">

.tab-content{
    #margin-bottom: 50px;
    #margin-top: 50px;
}

h2 { /* Header 2 */
  
  color: mediumaquamarine;
  text-transform: lowercase;
}


</style>
```
```{r}
#| label: setup
#| include: false

library(tidyverse)
library(lubridate) # need to install
library(broom)
library(kableExtra)
library(dplyr)
library(emo)
library(wordcloud)
library(wordcloud2)
library(scales)
library(plotly)
library(gt)
library(gtExtras)
library(knitr)
library(skimr) # need to install
library(bslib) # need to install
```

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false

y1 <- tribble(
  ~tr_name, ~n,
  "David", 5,
  "John", 62,
  "Samantha", 15,
  "Rex", 9,
  "Jennifer", 7,
)

y2 <- tribble(
  ~tr_name, ~n,
  "David", 5,
  "John", 62,
  "Samantha", 15,
  "Rex", 9,
  "Jennifer", 7,
)

y1 <- data.frame(y1)

y2 <- data.frame(y2)


```



::: panel-tabset


### 2015 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 1
wordcloud2(y1, size = 0.36)
```

### 2016 {.active}

```{r}
#| echo: false
#| results: asis
#| warning: false
#| message: false
y <- 2
wordcloud2(y2, size = 0.36)
```

:::

mcanouil · 2023-06-13T12:37:59Z

@racing-focus Thanks. Could you remove evrything that is not relevant, such as the CSS code, all the R packages not used, the YAML options used only for website, etc.

See #5884 (comment).

Edit: I believe the following is sufficient to reproduce, although I cannot work on this now (maybe @cderv can).
wordcloud2 produces an HTML widget.
The issue is unrelated to tabset.

---
format: html
---

```{r}
df <- tibble::tribble(
  ~tr_name, ~n,
  "David", 5,
  "John", 62,
  "Samantha", 15,
  "Rex", 9,
  "Jennifer", 7,
)
```

### 2015

```{r}
wordcloud2::wordcloud2(df, size = 0.36)
```

### 2016

```{r}
wordcloud2::wordcloud2(df, size = 0.36)
```

cderv · 2023-06-13T13:17:10Z

Thanks @mcanouil . I believe this is not related to Quarto at all, and an issue maybe with wordcloud itself.

I can reproduce this also with rmarkdown (thus without Quarto).

There is an error in Browser Console which prevent the htmlwidget wordcloud to load correctly

Uncaught ReferenceError: iii is not defined
    at HTMLCanvasElement.eval (eval at tryEval (test.html:252:16), <anonymous>:3:25)
    at test.html:468:18
    at Array.forEach (<anonymous>)
    at forEach (test.html:283:14)
    at evalAndRun (test.html:458:7)
    at test.html:881:11
    at Array.forEach (<anonymous>)
    at forEach (test.html:283:14)
    at test.html:802:7
    at Array.forEach (<anonymous>)

Related issue I believe

Wordcloud failing in Rmarkdown tabsets Lchiffon/wordcloud2#65 (see this comment too)

It seems an issue with wordcloud.js (Lchiffon/wordcloud2#65 (comment))

This is to solve on the R side. I guess.

as you can see, it was plotting in January.

I don't explain this though.

racing-focus · 2023-06-15T01:57:01Z

I was able to work on it yesterday. Yes, the wordcloud appears to be the problem.

I updated rstudio. Can I ask a question, when I update rstudio, I have to install all packages again?

Well I installed all packages, but forgot when I was doing this in January that I had to remove wordcloud and install this version.

devtools::install_github("gaospecial/wordcloud2")

Which I have now done.

Just to confirm when I update rstudio again, I need to remember this version of wordcloud2 at the same time?

Cheers,

bhattmaulik · 2023-06-15T02:58:42Z

Can I ask a question, when I update rstudio, I have to install all packages again?
@racing-focus No, you don't have to install all the packages again, when you update your version of RStudio. But if you update R (e.g., from R 4.1 to R 4.3), then you have to move all the packages from the old folder to the new folder. If you have package like installR, this is an easy task. But please note that this package is available only for Windows.

racing-focus · 2023-06-15T03:17:16Z

thanks, when I say I update rstudio, I updated r and rstudio at the same time. but I get your point.

I just need to work out where the package folder is kept.

/Library/Frameworks/R.framework/Resources/library

done.

cheers,

mcanouil · 2023-06-15T06:09:02Z

Can I ask a question, when I update rstudio, I have to install all packages again?

@racing-focus No, you don't have to install all the packages again, when you update your version of RStudio. But if you update R (e.g., from R 4.1 to R 4.3), then you have to move all the packages from the old folder to the new folder. If you have package like installR, this is an easy task. But please note that this package is available only for Windows.

You definitely should never do that.
I apologise, but this is a pretty bad advice/suggestion that can lead to a lot of issues pretty undetectable.

@racing-focus Use renv (or similar).
You can also get the data.frame of installed packages (installed.packages()), write it to file and use that to install them again.

mcanouil · 2023-06-15T06:13:46Z

I am closing to close this since it was confirmed to be a third party bug.

cderv · 2023-06-15T08:13:17Z

I apologise, but this is a pretty bad advice/suggestion that can lead to a lot of issues pretty undetectable.

Just to add to that and explain a bit more. When upgrading to a new minor version (so 4.1.x to 4.2.x), you should indeed reinstall the packages so that they are rebuild with the correct R versions.

update.packages() even has a checkBuilt argument useful when using global unversioned library to set to TRUE so that packages are reinstalled and rebuild if there is a R version change.

Use renv (or similar).

You could indeed use renv for project related library and fine-grainded control of versions.

Though, if your workflow is more with a global library, you should consider pak https://pak.r-lib.org/
It will have the benefit of parallel installation which will be faster for reinstalling everything.

Anyhow, do not hesitate to share questions and experience on https://community.rstudio.com/ for example, you'll find a lot of experienced user there who will have good advice !

mcanouil · 2023-06-15T08:23:22Z

To note, there is also "r2u" (for Unbuntu) which is the fastest approach to install pre-built binary R packages, especially if you only want the latest version from CRAN, see https://eddelbuettel.github.io/r2u/.

pak is also able to use RSPM (pre-built packages) hence the speed gain over install.packages().

racing-focus · 2023-06-15T08:32:13Z

thank you all. I just have a pacman load command for the packages I use. but what it won't do is pull the non-cran packages like the wordcloud2 that is on the developers GitHub page. I've just made a not about that.

racing-focus added the bug Something isn't working label Jun 12, 2023

mcanouil added the third-party Issues involving interaction with a third-party library label Jun 14, 2023

mcanouil closed this as not planned Won't fix, can't repro, duplicate, stale Jun 15, 2023

mcanouil removed the bug Something isn't working label Jun 15, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Quarto Panel Tabset and Wordcloud #5884

Quarto Panel Tabset and Wordcloud #5884

racing-focus commented Jun 12, 2023

mcanouil commented Jun 12, 2023 •

edited

Loading

racing-focus commented Jun 12, 2023

mcanouil commented Jun 12, 2023

racing-focus commented Jun 12, 2023

cscheid commented Jun 12, 2023

racing-focus commented Jun 13, 2023

mcanouil commented Jun 13, 2023 •

edited

Loading

cderv commented Jun 13, 2023

racing-focus commented Jun 15, 2023 •

edited

Loading

bhattmaulik commented Jun 15, 2023

racing-focus commented Jun 15, 2023

mcanouil commented Jun 15, 2023 •

edited

Loading

mcanouil commented Jun 15, 2023

cderv commented Jun 15, 2023

mcanouil commented Jun 15, 2023

racing-focus commented Jun 15, 2023

Quarto Panel Tabset and Wordcloud #5884

Quarto Panel Tabset and Wordcloud #5884

Comments

racing-focus commented Jun 12, 2023

Bug description

Steps to reproduce

Expected behavior

Actual behavior

Your environment

Quarto check output

mcanouil commented Jun 12, 2023 • edited Loading

racing-focus commented Jun 12, 2023

mcanouil commented Jun 12, 2023

racing-focus commented Jun 12, 2023

cscheid commented Jun 12, 2023

racing-focus commented Jun 13, 2023

mcanouil commented Jun 13, 2023 • edited Loading

cderv commented Jun 13, 2023

racing-focus commented Jun 15, 2023 • edited Loading

bhattmaulik commented Jun 15, 2023

racing-focus commented Jun 15, 2023

mcanouil commented Jun 15, 2023 • edited Loading

mcanouil commented Jun 15, 2023

cderv commented Jun 15, 2023

mcanouil commented Jun 15, 2023

racing-focus commented Jun 15, 2023

mcanouil commented Jun 12, 2023 •

edited

Loading

mcanouil commented Jun 13, 2023 •

edited

Loading

racing-focus commented Jun 15, 2023 •

edited

Loading

mcanouil commented Jun 15, 2023 •

edited

Loading