shiny- Why changing the order of tabpanels, tabPanel not displaying plot?

Question

I am a newbie of shiny. I would like to upload data set from file and display it in a tabPanel. And the next step is to plot the data set and display the plot in another tabPanel. But I found that when the order of tabPanels was changed, the plot did not show. If the "3D" tabPanel was the first, the plot would be shown:

tabsetPanel(
            tabPanel("3D", webGLOutput("threeDPlot")), 
            tabPanel("Data", tableOutput("cont"))
          )

But if the "Data" tabPanel was the first, the plot would not be shown:

tabsetPanel(
            tabPanel("Data", tableOutput("cont")),
            tabPanel("3D", webGLOutput("threeDPlot"))                 
          )

Any help? Thank you in advance!

ui.R

library(shiny)
library(shinyRGL)
library(rgl)

shinyUI(fluidPage(

  titlePanel(h2("TEST")),

  sidebarLayout(        
    sidebarPanel(
      fileInput("df", label = h3("Load .txt data"), accept=c('text/csv', 
                                                   'text/comma-separated-values,text/plain', 
                                                   '.csv'))  
    ),        
    mainPanel(
      tabsetPanel(
        tabPanel("3D", webGLOutput("threeDPlot")), 
        tabPanel("Data", tableOutput("cont"))
      )
    )
  )
))

serve.R

options(rgl.useNULL=TRUE)

library(shiny)
library(shinyRGL)
library(rgl)

shinyServer(function(input, output) {

  dataInput <- reactive({
    validate(
      need(input$df != "", label = "Data set")
    )  

    inFile <- input$df
    data <- read.table(inFile$datapath, header=TRUE, sep="")
    data
  })

  output$cont <- renderTable({
    dataInput()
  })

    output$threeDPlot <- renderWebGL({          
      mydata <- dataInput()          
      clr <- mydata$value/max(mydata$value)
      f <- colorRamp(c("green", "yellow", "purple", "red"))

      for(i in 1:length(mydata$x)){
        shade3d(translate3d(scale3d(cube3d(col=rgb(f(clr[i])/255), alpha=0.15),
                            10.0, 10.0, 2.5), mydata$x[i], mydata$y[i], mydata$z[i]))
      }
    })
})

test.txt

x y z value
1 3 5 33
2 4 6 45
3 6 9 72
4 8 12 81

Answer 1

I had the same issue before and the way you can solve this is adjusting the server.R code to match the ui.R layout.

For some reason, the order in which you put your tabPanels MUST correspond with the way youve order the output$plot statements in Shiny. I can't give you an explanation, but below is how to fix this possibly.

I don't understand why Shiny doesn't just look for the proper output statement and instead looks for the correct order.

WORKS

 #ui.R

mainPanel(
  tabsetPanel(
    tabPanel("3D", webGLOutput("threeDPlot")), 
    tabPanel("Data", tableOutput("cont"))
  )


#server.R

output$threeDPlot <- renderWebGL({          
  mydata <- dataInput()          
  clr <- mydata$value/max(mydata$value)
  f <- colorRamp(c("green", "yellow", "purple", "red"))

  output$cont <- renderTable({
  dataInput()
   })

The order in which the ui.R calls upon the server.R output statements matters. Make sure you sort it properly!

---

The following will NOT output properly!

DOESN'T WORK

#ui.R

tabsetPanel(
        tabPanel("3D", webGLOutput("threeDPlot")), 
        tabPanel("Data", tableOutput("cont"))
      )

 #server.R

 output$cont <- renderTable({
dataInput()
 })

output$threeDPlot <- renderWebGL({          
  mydata <- dataInput()          
  clr <- mydata$value/max(mydata$value)
  f <- colorRamp(c("green", "yellow", "purple", "red"))