CODEWITHSUNDEEP
htmlruser-interfaceshiny
viktor_r
viktor_r

Reputation: 721

R Shiny: Translate into HTML UI uiOutput, htmlOutput and File Upload

I have a Shiny App which I want to implement in a existing website, therefore I need to translate the ui.R into a HTML UI.I got most of the things from ui.R work in HTML UI, but I have questions concerning uiOutput, html Output and the File Upload.

Q1:How do implement an dynamic Slider, that I have created with renderUI({})? The dynamic selection I have created with renderUI({}) works fine, but with the slider I get the following error:min, max, amd value must all be numeric values It seems that no numeric values can be send to server.R from the HMTL UI.

Q2:: How would a working HMTL File Upload would look like? Mine seems to upload files, but I cannot pass it to server.R.

Here is an example:

server.R:

library(shiny)

#sample data
years<-c(1990,1995,2000,2005,2010)
oryear<-years[3]

shinyServer(function(input, output, session) {

  #Input uploaded file
  inFile<-input$ascii_layer

  #make dynamic selection     
  output$selectUI <- renderUI({ 
   selectInput("test_select", "Test selection", years, selected=oryear) 
  })

  #make dynamic slider
  output$slider <- renderUI({
    sliderInput("inSlider", "Slider", min=input$min_val, max=input$max_val, value=2000)
  })

})

ui.R:

 library(shiny)

shinyUI(pageWithSidebar(
headerPanel("Test Shiny App"),

    sidebarPanel(

    #File Upload
        fileInput('ascii_layer', 'Choose ASCII Layer', multiple=FALSE, accept='asc'),

    #HTML Selection Output from server.R    
    htmlOutput("selectUI"),

    #Numeric Inputs
        numericInput("min_val", "Enter Minimum Value", 1993),
        numericInput("max_val", "Enter Maximum Value", 2013)

    #display dynamic UI
        uiOutput("slider")
        ),

    mainPanel()
    ))

HMTL UI:

<html>

<head>
  <script src="shared/jquery.js" type="text/javascript"></script>
  <script src="shared/shiny.js" type="text/javascript"></script>
  <link rel="stylesheet" type="text/css" href="shared/shiny.css"/> 
</head>

<body>
  <h1>HTML UI</h1>

 <!—- File Upload—->
  <p>
    <form action="input_file.htm" method="post" enctype="multipart/form-data">
    <p>Choose Distance to Road Layer:<br>
    <input name="ascii_layer" type="file" size="50" maxlength="100000" accept="*.asc">
    </p>
    </form>  
  </p>

 <!—-Numeric Inputs—->
  <p>
    <label>Enter Minimum Value:</label><br />
    <input type="number" name="min_val" value="1993" />
  </p>

  <p>
    <label>Enter Maximum Value:</label><br />
    <input type="number" name="max_val" value="1993" />
  </p>


 <!—-Dynamic Selection—->
  <div id="selectUI" class="shiny-html-output"></div>

 <!—-Dynamic Slider—->
  <div id="slider" class="shiny-html-output"></div> 


</body>

</html>

Upvotes: 0

Views: 5877

Answers (1)

Vincent
Vincent

Reputation: 5239

There were several errors in your Shiny code. A fixed version is given below. Run this by copy-and-pasting into the R terminal and view the source code from your browser to get your html-ui. I suggest you take a look at the Shiny tutorials online (e.g. http://rstudio.github.io/shiny/tutorial) for further detail on file upload etc.

library(shiny)

#sample data
years <- c(1990,1995,2000,2005,2010)
oryear <- years[3]

server <- function(input, output, session) {

  #Input uploaded file
  # inFile<-input$ascii_layer

  output$contents <- renderTable({
    inFile <- input$ascii_layer

    if (is.null(inFile))
      return(NULL)

    read.csv(inFile$datapath)
  })

  #make dynamic selection     
  output$selectUI <- renderUI({ 
   selectInput("test_select", "Test selection", years, selected=oryear) 
  })

  #make dynamic slider
  output$slider <- renderUI({
    sliderInput("inSlider", "Slider", min=input$min_val, max=input$max_val, value=2000)
  })
}

ui <- pageWithSidebar(

  headerPanel("Test Shiny App"),
  sidebarPanel(

    #File Upload
    fileInput('ascii_layer', 'Choose ASCII Layer', multiple=FALSE, accept='asc'),

    #HTML Selection Output from server.R    
    uiOutput("selectUI"),

    #Numeric Inputs
    numericInput("min_val", "Enter Minimum Value", 1993),
    numericInput("max_val", "Enter Maximum Value", 2013),

    #display dynamic UI
    uiOutput("slider")

  ),
  mainPanel(
    tableOutput('contents')
  )
)

runApp(list(ui = ui, server = server))

Upvotes: 2

Related Questions