jbkunst / d3wordcloud

:cloud: htmlwidgets for D3js Word Cloud Layout
http://rpubs.com/jbkunst/133106
66 stars 15 forks source link

Error with d3wordcloud an hiden {.tabset} #19

Closed diegocgaona closed 8 years ago

diegocgaona commented 8 years ago

Hi,

I'm trying to put the clouds in a RMD and export to html with knitr in Rstudio, but my file came in blank and freezes Rstudio.

What options I need to use in the chunks? I need to do something special? I tried results = "asis", but without success.

My reproducible example:


---
title: "test"
output:
  html_document:
    theme: flatly
    highlight: tango
    self_contained: FALSE

---
``{r source}
require(magrittr)
require(dygraphs)
ptcolsumm <-  c("Usuários", "Sessões", "Pageview Único", "Pageviews",  "Tempo Médio", "Rejeição", "Taxa de Rejeição", "Taxa de Saída", "não sei", "ACENTUAÇÃO", "Teste")

organic <- data.frame(organic = as.numeric(c(186,640,278,11,267,117,41,17,38)))
organic <- as.ts(organic)

# Facebook impressions by type
teste <- dygraph(organic) %>%
  dySeries("organic", label = "Orgânico") %>%
  dyLegend(width = 400, show = "always") %>%
  dyOptions(fillGraph = TRUE, fillAlpha = 0.2, drawGrid = FALSE, drawPoints = TRUE, pointSize = 2)
``
<style> /* CSS style to solve the problem with the sparkline tooltip */
.jqstooltip {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
</style>

## Quarterly Results {.tabset}

### By Region

``{r3}
teste
``
### BLOH BLOH 3
```{r wordcloudteste, results = "asis"}
require(d3wordcloud)
words <- c("I", "love", "this", "package", "but", "I", "don't", "like", "use", "wordclouds")
freqs <- sample(seq(length(words)))

d3wordcloud(words, freqs)

Thanks!

jbkunst commented 8 years ago

Hi @diegocgaona ,

I can replicate your examples. Do you have the lastet version of the packages?

Note your script saids ``{r source} with two commas. Is this a copy paste error o your code use two commas to open chunks?

Anyway here is my session info

R version 3.2.3 (2015-12-10)
Platform: x86_64-w64-mingw32/x64 (64-bit)
Running under: Windows >= 8 x64 (build 9200)

locale:
[1] LC_COLLATE=Spanish_Chile.1252  LC_CTYPE=Spanish_Chile.1252    LC_MONETARY=Spanish_Chile.1252 LC_NUMERIC=C                   LC_TIME=Spanish_Chile.1252    

attached base packages:
[1] stats     graphics  grDevices utils     datasets  methods   base     

other attached packages:
[1] dygraphs_0.9 magrittr_1.5

loaded via a namespace (and not attached):
 [1] Rcpp_0.12.4     lattice_0.20-33 zoo_1.7-12      digest_0.6.9    withr_1.0.1     grid_3.2.3      R6_2.1.2        git2r_0.13.1    httr_1.1.0      curl_0.9.6      rmarkdown_0.9.5
[12] devtools_1.10.0 tools_3.2.3     htmlwidgets_0.6 yaml_2.1.13     rsconnect_0.4.2 memoise_1.0.0   htmltools_0.3.5
jbkunst commented 8 years ago

Oops. When I show the dygraph and the wordcloud the rstudio freeze. Mmm... I need to check this carefully.

If I have some news I'll tell you.

diegocgaona commented 8 years ago

I modified the code because Github markdown, sorry. Ah, yeah, maybe is a incompatibility with dygraphs

diegocgaona commented 8 years ago

According to @jjallaire (https://github.com/rstudio/dygraphs/issues/114#issuecomment-219027897) responsible for the dygraphs:

I did notice the browser hanging on attempting to talk to fonts.googleapis.com and found there is a reference to an external font in d3wordcloud here:

https://github.com/jbkunst/d3wordcloud/blob/f1cecb8830bba02f51df9a0898baff58a70ad914/inst/htmlwidgets/d3wordcloud.js#L38

What do you think, maybe it is the error?

jbkunst commented 8 years ago

I think is windows! I guees @jjallaire is not using windows or maybe the issues are the special characters like: õ ç ã. Have you tried removing them?

That line is just to call a external font.

I tested with highcharter instead of dygraph and it works http://rpubs.com/jbkunst/d3wordcloud-issues-19

timelyportfolio commented 8 years ago

I'll try to look into it in just a bit.

jbkunst commented 8 years ago

@timelyportfolio Oh! Thanks in advance :smiley_cat:

timelyportfolio commented 8 years ago

I believe the issue is pandoc does not like woff2. I have run into this quite a few times with other htmlwidgets and css frameworks. We can confirm that the packages can peacefully coexist by running without rmarkdown.

require(magrittr)
require(dygraphs)
ptcolsumm <-  c("Usuários", "Sessões", "Pageview Único", "Pageviews",  "Tempo Médio", "Rejeição", "Taxa de Rejeição", "Taxa de Saída", "não sei", "ACENTUAÇÃO", "Teste")

organic <- data.frame(organic = as.numeric(c(186,640,278,11,267,117,41,17,38)))
organic <- as.ts(organic)

# Facebook impressions by type
teste <- dygraph(organic) %>%
  dySeries("organic", label = "Orgânico") %>%
  dyLegend(width = 400, show = "always") %>%
  dyOptions(fillGraph = TRUE, fillAlpha = 0.2, drawGrid = FALSE, drawPoints = TRUE, pointSize = 2)

teste

require(d3wordcloud)
words <- c("I", "love", "this", "package", "but", "I", "don't", "like", "use", "wordclouds")
freqs <- sample(seq(length(words)))

wc <- d3wordcloud(words, freqs)

library(htmltools)
browsable(tagList(teste,wc))

I'll submit a pull shortly to get d3wordcloud working properly with rmarkdown still including Open Sans. I will say though that adding the font will make the standalone document much bigger, but the font is pretty :)

timelyportfolio commented 8 years ago

Hard for me to diagnose, since the simplified version works fine for me on Windows 7 with and without pandoc/rmarkdown. However, I do get the freeze with your version. I thought i knew the source of the trouble, but woff2 does not seem to be blameworthy. pandoc/rmarkdown do not try to base64 encode this, since the css is injected with JavaScript.

@jbkunst, any ideas? I thought eliminating/chaging the font injection would fix, but now I don't think so.

@diegocgaona

timelyportfolio commented 8 years ago

@diegocgaona, the source of the trouble is the {.tabset}. I'll dig in to find what is happening, but I have traced to that.

It seems the wordcloud algorithm gets stuck in an infinite loop when tabsets are used probably because size is not provided when a tab is hidden. Put the d3wordcloud in the first tabset and the problem is magically solved.

@jbkunst I'll work on a pull.

diegocgaona commented 8 years ago

Thanks! Unfortunately, in my final report, I have many tabs, and I can't put in the first :(

But nice to know what is causing the problem, and I hope you can find a solution.

timelyportfolio commented 8 years ago

There is definitely a fix, but unfortunately not an easy one. I should have something by end of day.

timelyportfolio commented 8 years ago

@diegocgaona, I have submitted a pull, but for now you can try it out by

devtools::install_github("timelyportfolio/d3wordcloud@fix/resize")

and then use your example or try this. Please let me know how it works.

    ---
    title: "test"
    output:
      html_document:
        theme: flatly
        highlight: tango
        self_contained: FALSE
    ---

    ## Quarterly Results {.tabset}

    ### dygraph in first

    ```{r}
    library(dygraphs)
    lungDeaths <- cbind(mdeaths, fdeaths)
    dygraph(lungDeaths)
### d3wordcloud in second

```{r wordcloudteste, results = "asis"}
require(d3wordcloud)
words <- c("I", "love", "this", "package", "but", "I", "don't", "like", "use", "wordclouds")
freqs <- sample(seq(length(words)))

d3wordcloud(
  words,
  freqs,
  tooltip=TRUE
)
```

### d3wordcloud with resize

```{r wordcloudteste2, echo=FALSE, results = "asis"}
words <- c("I", "love", "this", "package", "but", "I", "don't", "like", "use", "wordclouds")
freqs <- sample(seq(length(words)))

d3wordcloud(
  words,
  freqs,
  tooltip=TRUE,
  width = "100%"
)

```
diegocgaona commented 8 years ago

unfortunatelly i'm away from my computer, but in a few hours I will test and let you know. Thanks

diegocgaona commented 8 years ago

Hi, @timelyportfolio Your solution worked fine in my example and another test! Many thanks!!

jacob-ogre commented 8 years ago

I was running into the same "hang" problem in a flex dashboard storyboard, but not using a tabset...just a wordcloud in one of the storyboard frames. And the patch avoiding the infinite loop worked! Thanks @timelyportfolio! 👍 👍

jbkunst commented 8 years ago

Nice! @timelyportfolio You're are the man! Thanks :D.

timelyportfolio commented 8 years ago

Glad it worked. This should also help anyone who might use d3wordcloud in a html slide show.