rstudio / flexdashboard

Easy interactive dashboards for R
https://pkgs.rstudio.com/flexdashboard/
Other
814 stars 300 forks source link

Flexdashboard / RColorBrewer / parcoords rendering #24

Closed ghost closed 8 years ago

ghost commented 8 years ago

The combination of RColorBrewer with parcoords and (new) page leads to a blank parcoords chart - sometimes. It's hard to reproduce because it is so irregular (regular enough to pull your hairs out). If it occurs then the rendered result opens at page 3 instead of page 1. When going to page 1, this is what you see:

selection_005

Test script:


---
title: "Untitled"
output: 
  flexdashboard::flex_dashboard:
    orientation: rows
    vertical_layout: scroll

---

```{r setup, include=FALSE}
# install.packages("pacman")
pacman::p_load_gh("timelyportfolio/parcoords", "jbkunst/highcharter", "rstudio/d3heatmap")
pacman::p_load(ggplot2, RColorBrewer)
Page 1
==========================

Column
-----------------------------------------------------------------------

### Chart A
data( mtcars )
parcoords( mtcars )
Page 2
======================================

Column
-----------------------------------------------------------------------

### Chart B
d3heatmap(mtcars, scale = "column", colors = "Blues")
Page 3
===================================

Column
----------------------------------------------------------------

### Chart C
data(economics, package = "ggplot2")

hc_add_series_times_values(hc = highchart(),
                           dates = economics$date,
                           values = economics$psavert, 
                           name = "Personal Savings Rate")
sessionInfo()
R version 3.2.2 (2015-08-14)
Platform: x86_64-pc-linux-gnu (64-bit)
Running under: Ubuntu 14.04.3 LTS

locale:
[1] LC_CTYPE=en_US.UTF-8       LC_NUMERIC=C               LC_TIME=en_US.UTF-8        LC_COLLATE=en_US.UTF-8     LC_MONETARY=en_US.UTF-8    LC_MESSAGES=en_US.UTF-8    LC_PAPER=en_US.UTF-8    
[8] LC_NAME=C                  LC_ADDRESS=C               LC_TELEPHONE=C             LC_MEASUREMENT=en_US.UTF-8 LC_IDENTIFICATION=C       

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

loaded via a namespace (and not attached):
[1] htmltools_0.3.5     tools_3.2.2         flexdashboard_0.1.0 yaml_2.1.13         Rcpp_0.12.4         rmarkdown_0.9.6     jsonlite_0.9.20     digest_0.6.9       
jjallaire commented 8 years ago

This is unlikely to have anything to do with flexdashboard. @timelyportfolio ?

One thing I noticed is that the parcoords package doesn't implement resize which if not the cause of this problem will result in all kinds of other layout problems within flexdashboard.

timelyportfolio commented 8 years ago

@jjallaire, resize will be a curse to last year's widgets, since I did not implement resize in many of them. In parcoords I deliberately avoided because render can be so resource intensive, and since it combines canvas with svg, re-render is the only way to resize.

@carbonmetrics, I'll try to quickly implement resize, but I'm not positive it will resolve this problem. I will say that I don't think RColorBrewer has any part in this. I also don't think it is flexdashboard. Based on my experience, I would say tabset is the source of this trouble. There are lots of dependencies and asynchronous behaviors at play here, so as you say, debugging can be a nightmare.

ghost commented 8 years ago

@timelyportfolio Thanks! That would be great. I use parcoords all the time, my clients all go wild when they see it/get it. I indeed noticed that removing tabsets and pages solved the misbehaviour.

timelyportfolio commented 8 years ago

The life of a htmlwidget developer gets harder and harder.

@carbonmetrics, I just started work on this. Will you please help me test?

devtools::install_github("timelyportfolio/parcoords@feature/resize")
ghost commented 8 years ago

@timelyportfolio, I have made a flexdashboard with different layouts and uploaded it to rpubs.

As long as you switch autoresize=T it will work, also with tabsets. The problem (it seems to me) is valueboxes. The parcoord size gets stuck if you use them, also if you try to adjust data-width or data-height. Something similar is happening with d3heatmap.

The life of a htmlwidget developer is probably indeed getting harder and harder, so I will try to get you a picture of someone who is using this widget for the first time here in Nairobi, Kenya.