4

I came across a problem while using rCharts in my Shiny application. I generate dynamically 1-3 tabPanels (depending on the user selection) and in each of them one plot is rendered. Plot may be of two types: simple (with graphics libary) or rCharts (with morris library). The whole tabsetPanel is rendered within the uiOutput component, each time an user changes his input. The type of the ui output (plotOutput for simple plot or showOutput for rCharts) is defined when a tabPanel is rendered, so the plot does have a proper environment.

And the problem: simple plots (with graphics, ggplot2 etc.) do work OK - they are displayed correctly in a tabPanel. However, when I work with application and have 2 or 3 rCharts to be displayed, it happens that one chart is not displaying - almost at all (see the images below). Of course, such a problem does not appear with simple plots.

I tried to have the output size fixed, size flexible, but the problem still exists. I have varsions of R and the libraries as follows:

> R.Version()$version.string
[1] "R version 3.0.1 (2013-05-16)"
> packageVersion("Shiny")
[1] ‘0.7.0’
> packageVersion("rCharts")
[1] ‘0.3.51’

Thank you a lot for any suggestions.

rCharts working OK:

enter image description here

rCharts FAIL to be dispkayed ok:

enter image description here

EDIT: my code below:

UI

library(shiny)
library(Epi)

shinyUI(pageWithSidebar(  
  headerPanel("Header"),  

  sidebarPanel(        
    checkboxInput(inputId = "checkboxInputx", label = "function: x", value = TRUE),
    checkboxInput(inputId = "checkboxInputxpower2", label = "function: x^2", value =     FALSE),
    checkboxInput(inputId = "checkboxInput2x", label = "function:  2x", value = FALSE),

    actionButton("gobutton","GO!")
   ),

  mainPanel(    
    radioButtons("plottypechoice", "Choose plot type", c("simple", "rCharts")),    
    uiOutput("plotpanelcontent")
  )   
))

SERVER

library(shiny)
library(rCharts)
library(Epi)
library(reshape2)

# build data frame 
x <- 1:100
df <- data.frame(x, x^2, 2*x)
names(df) <- c("x", "xpower2", "2productx")


shinyServer(function(input, output) {

  # generate tabsetPanel with tabPlots with plot of selected type 
  output$plotpanelcontent <- renderUI({ 

    if(input$gobutton != 0){


        # collect tab names 
        tab.names <- vector()
        if(input$checkboxInputx) tab.names <- c(tab.names, "x")
        if(input$checkboxInputxpower2) tab.names <- c(tab.names, "xpower2")
        if(input$checkboxInput2x) tab.names <- c(tab.names, "2productx")
        print(tab.names)

        # render tabs
        tabs <- lapply(tab.names, function(tab.name){ 
          # define tabPanel content depending on plot type selection 
          if(input$plottypechoice == "simple")
            tab <- tabPanel(tab.name, plotOutput(paste0("simpleplot", tab.name)))
          else
            tab <- tabPanel(tab.name, showOutput(paste0("rchartplot", tab.name), "morris"))
          return(tab)
        })  
        return(do.call(tabsetPanel, tabs))
    }
  })  


  # Render simple plots 
  output$simpleplotx <- renderPlot({ 
    print(plot(df[,1], df[,1]))
    plot(df[,1], df[,1]) 
  })
  output$simpleplotxpower2 <- renderPlot({ 
    print(plot(df[,1], df[,2]))
    plot(df[,1], df[,2])   
  })
  output$simpleplot2productx <- renderPlot({ 
    print(plot(df[,1], df[,3]))
    plot(df[,1], df[,3])   
  })


  # Render rCharts 
  output$rchartplotx <- renderChart({ 
    plot <- mPlot(x="x", y="x", type = "Line", data = df)
    plot$set(dom = "rchartplotx")
    return(plot)
  })
  output$rchartplotxpower2 <- renderChart({ 
    plot <- mPlot(x="x", y="xpower2", type = "Line", data = df)
    plot$set(dom = "rchartplotxpower2")
    return(plot)
  })
  output$rchartplot2productx <- renderChart({ 
    plot <- mPlot(x="x", y="2productx", type = "Line", data = df)
    plot$set(dom = "rchartplot2productx")
    return(plot)
  })
}) 

UPDATE:

I have asked Olly Smith, an author of morris.js library, to suggest a solution and I received a following response:

Morris can't correctly draw charts when they're not displayed on screen. When using Morris in tabbed applications, you need to redraw the active chart whenever the tab selection changes. There's a redraw() method on the chart objects that each of the Morris.Line/Bar/Donut constructors return that you can use to do this. Unfortunately, it's currently undocumented, but it's a stable part of the API now so it's safe to use.

UPDATE 2. :

I followed the Ramnath suggestions and update both Shiny and rCharts libraries version:

> packageVersion("Shiny")
[1] ‘0.8.0’
>  packageVersion("rCharts")
[1] ‘0.3.53’

and run the code just after restarting the R session. Unfortunately, plots seem to behave in even stranger way now. After doing actions in the following order:

  1. set: "function: x", "rCharts", GO [OK],

  2. add: "function: x^2" [see "not_ok_1" image attached below in the post],

  3. add: "function: 2x" [see "not_ok_2" image attached below in the post].

I received the plot visualizations as follows:

  1. OK enter image description here

  2. "not_ok_1" image enter image description here

  3. "not_ok_2" image enter image description here

Marta Karas
  • 4,967
  • 10
  • 47
  • 77
  • 1
    Show your code so that we can see how it differs from a working example such as [this one](http://ramnathv.github.io/rChartsShiny/) – GSee Nov 03 '13 at 14:43
  • 1
    Code supplied! Thank you for your interest, **GSee**. – Marta Karas Nov 03 '13 at 14:51
  • 1
    Try updating shiny. Your code worked for me with the same version of R, but with shiny 0.8.0 (I also have an old version of rCharts installed) – GSee Nov 03 '13 at 15:11
  • 2
    **GSee**, I followed your suggestion (getting `packageVersion("shiny") [1] ‘0.8.0’`) and the problem is not solved. As I mention, it takes place not every time, but under some circumstances (after some user input and action combinations). For example, **please try do actions in such an order**: 1. set: "function: x", plot: "simple" [OK] 2. change plot to: "rCharts" [OK] 3. add function: "function: 2x" [see both 2 tabPanels are displayed OK] 4. add function: "function: x^2" [see: 2 tabPanels ("x", "xpower2") OK, but tabPabpanel "2productx" is not displayed correctly !!! ] – Marta Karas Nov 03 '13 at 15:45
  • Please note I have updated the post with the suggestion of author of morris.js library. – Marta Karas Nov 03 '13 at 20:58
  • I tried your code and it works fine for me with Shiny 0.8.0. rCharts redraws the entire chart every time `renderChart` is invoked, so you should not run into this particular problem. Can you update `rCharts` to 0.3.53 (`devtool::install_github("rCharts", "ramnathv", ref = "dev")`) and also update your Shiny version? – Ramnath Nov 03 '13 at 23:10
  • **Ramnath**, thank you a lot for your attention and this suggestion! Unfortunately, it did not do the trick in my application :( I attached an *Update 2.* to this post - you can see the strange results I received. – Marta Karas Nov 04 '13 at 08:27
  • 1
    Okay. This is exactly what I got as well, so at least we are on the same page now :) The good thing is that the plots are showing up. I will investigate the reason behind the weirdness in the x-y ranges. – Ramnath Nov 04 '13 at 19:55
  • Thank you, **Ramnath**! I am looking forward to hearing any further suggestions. What I did today was excluding the possibility it is caused by re-rendering the `tabsetPanel` (thus `tabPanels` and `showOutput` too) over and over - I implemented `Conditional Tab Panels` (as proposed [here](https://groups.google.com/forum/#!topic/shiny-discuss/7kLFhrXPyQY)) so as to have `tabPanels` (and so the `rCharts` objects) be rendered ONLY one time - and the plots were displayed in EXACTLY the same bad way. – Marta Karas Nov 04 '13 at 20:34

0 Answers0