Using the code below, I am only getting the alt text to appear.
Any suggestions on what may be the problem?
From server.R:
output$face <- renderImage({
list(src = "http://www.clipartbest.com/cliparts/yco/GGE/ycoGGEacE.png",
filetype = "image/png",
alt = "YOU MUST BE KIDDING ME!")
}, deleteFile = FALSE)
From ui.R:
imageOutput("face")
Thanks,
Chad
Adding to the explanation of the problem - I am not just trying to display the image. Rather, I am trying to make it reactive - and display a different image, based on inputs... per the server.R code below:
output$imagegauge <- renderImage({
if (is.null(IRR_calc()))
return(NULL)
if (IRR_calc() > .085) {
return(list(
src = "http://www.i2symbol.com/images/abc-123/o/white_smiling_face_u263A_icon_256x256.png",
contentType = "image/png",
alt = "Smiley Face"
))
} else {
return(list(
src = "http://www.clipartbest.com/cliparts/yco/GGE/ycoGGEacE.png",
filetype = "image/png",
alt = "Sad Face"
))
}
}, deleteFile = FALSE)
Thanks again,
Chad
renderImage takes a file as src input rather then a url. You can just include this image directly using tags$img :
library(shiny)
runApp(list(
ui = fluidPage(
titlePanel("Hello Shiny!"),
sidebarLayout(
sidebarPanel(
numericInput('n', 'Number of obs', 100),
numericInput('m', 'Select image (Happy (1) or Sad(2))', 1, min = 1, max = 2),
uiOutput('test')
),
mainPanel(
plotOutput('plot')
)
)
),
server = function(input, output) {
output$plot <- renderPlot({ hist(runif(input$n)) })
output$test <- renderUI({
images <- c("http://www.i2symbol.com/images/abc-123/o/white_smiling_face_u263A_icon_256x256.png"
, "http://www.clipartbest.com/cliparts/yco/GGE/ycoGGEacE.png")
tags$img(src= images[input$m])
})
}
))
Related
I want to develop a feature that when opening the switch the image can show outside of the page and when closing the switch, the image is hidden. Here is my sample code for showing/hiding the image in the page but if we can make the image be a floating window and can be moved around the exiting app page?
library("shinydashboard")
library("shinyWidgets")
ui <- fluidPage(
h4("Embedded image"),
uiOutput("img"),
fluidRow(
tags$h4("Show and Hide Image"),
materialSwitch(
inputId = "get_image",
label = "Show Image",
value = FALSE,
status = "success"
),
),
)
server <- function(input, output, session) {
observeEvent(input$get_image, {
if(input$get_image == TRUE){
output$img <- renderUI({
tags$img(src = "https://www.r-project.org/logo/Rlogo.png")
})
}else{
output$img <- NULL
}
})
}
shinyApp(ui, server)
Something like this?
library(shiny)
library("shinydashboard")
library("shinyWidgets")
ui <- fluidPage(
h4("Embedded image"),
uiOutput("img"),
fluidRow(
tags$h4("Show and Hide Image"),
materialSwitch(
inputId = "get_image",
label = "Show Image",
value = FALSE,
status = "success"
),
),
)
server <- function(input, output, session) {
output$img <- renderUI({
if(input$get_image)
absolutePanel(
tags$img(src = "https://www.r-project.org/logo/Rlogo.png", width = "512"),
draggable = TRUE
)
})
}
shinyApp(ui, server)
Need Help, I would like to upload an image file display it on shiny and the image can be remove.
I already tried but the problem is first attemp upload file is OK but second attemp is the image are not displayed.
library(shiny)
ui <- fluidPage(
sidebarLayout(
sidebarPanel(
fluidRow(
fileInput("myFile", "Choose a file", accept = c('image/png', 'image/jpeg')),
actionButton('reset', 'Reset Input')
)
),
mainPanel(
div(id = "image-container", style = "display:flexbox")
)
)
)
server <- function(input, output) {
observeEvent(input$myFile, {
inFile <- input$myFile
if (is.null(inFile))
return()
b64 <- base64enc::dataURI(file = inFile$datapath, mime = "image/png")
insertUI(
selector = "#image-container",
where = "afterBegin",
ui = img(src = b64, width = 600, height = 600)
)
})
observeEvent(input$reset, {
removeUI(
selector = "#image-container",
)
})
}
shinyApp(ui = ui, server = server)
Any solution is really appreciated
With your removeUI you are removing the container. Remove its content instead:
observeEvent(input$reset, {
removeUI(
selector = "#image-container > *"
)
})
I am trying to upload images to my shiny app, but seem to be stuck on a basic step. The images are in my www directory. I am able to implement a drop down option, and would like the user to select an image (e.g, mouse.png) which would upload said image. However, the image itself is not uploading.
This is my code, does anyone have any ideas?
library(shiny)
#create a box function
my.box <- function(title, obj) {
box(
title = title,
status = "primary",
solidHeader = TRUE,
collapsible = TRUE,
plotOutput(obj, height = "300px")
)
}
# List of choices for selectInput
mylist <- list.files("~/APP/www/")
body <- dashboardBody(tableOutput("filtered_table"),
my.box("Table1", "Table1"))
#create dropbox
ui <- fluidPage(
#drop down box
selectInput(inputId ="gene",label = h3("Select an image from below"),choices = mylist),
#name of the plot.
mainPanel(plotOutput("image")) #NOT SURE WHAT TO PLACE HERE
)
#server function
server = shinyServer(function(input, output,session){
observeEvent(input$myFile, {
inFile <- input$myFile
if (is.null(inFile))
return()
file.copy(inFile$datapath, file.path("~/APP/www/", inFile$name) )
})
})
Following the example from the shiny tutorial, you can use renderImage/imageOutput. Note that I've adjusted the file paths a bit.
library(shiny)
library(shinydashboard)
#create a box function
my.box <- function(title, obj) {
box(
title = title,
status = "primary",
solidHeader = TRUE,
collapsible = TRUE,
plotOutput(obj, height = "300px")
)
}
# List of choices for selectInput
mylist <- list.files("./www")
body <- dashboardBody(tableOutput("filtered_table"),
my.box("Table1", "Table1"))
#create dropbox
ui <- fluidPage(
#drop down box
selectInput(inputId ="gene",label = h3("Select an image from below"),choices = mylist),
#name of the plot.
mainPanel(imageOutput("image"))
)
#server function
server = shinyServer(function(input, output,session){
output$image <- renderImage({
filename <- normalizePath(file.path('www',
input$gene))
list(src = filename)
}, deleteFile = FALSE)
})
shinyApp(ui, server)
I want to create a shiny application which will the user the ability to browse and load an image and then display it. My question is whether this is supported by shiny.
#ui.r
pageWithSidebar(
headerPanel('Image Recognition'),
sidebarPanel(
fileInput("file1", "Choose Image",
accept = c(
".jpg")
))
,
mainPanel(
imageOutput("file1")
)
)
#server.r
library(shiny)
function(input, output, session) {
(shiny.maxRequestSize=30*1024^2)
output$myImage <- renderImage({
# A temp file to save the output.
# This file will be removed later by renderImage
file1 <- tempfile(fileext = '.png')
# Generate the PNG
png(file1, width = 400, height = 300)
dev.off()
# Return a list containing the filename
list(src = file1,
contentType = 'image/png',
width = 400,
height = 300,
alt = "This is alternate text")
}, deleteFile = TRUE)
}
Here is a solution using base64 encoding of the uploaded file.
library(shiny)
library(base64enc)
options(shiny.maxRequestSize = 30*1024^2)
ui <- fluidPage(
fileInput("upload", "Upload image", accept = "image/png"),
uiOutput("image")
)
server <- function(input, output){
base64 <- reactive({
inFile <- input[["upload"]]
if(!is.null(inFile)){
dataURI(file = inFile$datapath, mime = "image/png")
}
})
output[["image"]] <- renderUI({
if(!is.null(base64())){
tags$div(
tags$img(src= base64(), width="100%"),
style = "width: 400px;"
)
}
})
}
shinyApp(ui, server)
I am trying to display a png file using shiny. file is uploaded but not displayed properly. I have included both ui and server code
ui <- fluidPage(
titlePanel("Upload Slide Image"),
sidebarLayout(
sidebarPanel(fileInput("file1", "Choose png File", multiple = TRUE,
accept = c(".png")) ), # Input: Select a file ----
mainPanel(imageOutput("myImage"))
)
)
server <- function(input, output, session){
output$myImage <- renderImage({
outfile <- tempfile(fileext = '.png')
png(outfile, width = 400, height = 300) # Generate the PNG
dev.off()
list(src = outfile,contentType = 'image/png',width = 400, height = 300,
alt = "This is alternate text")
}, deleteFile = TRUE)
}
# Create Shiny app ----
shinyApp(ui, server)
You are not doing anything with input (as mentioned by #RolandASc). Rather you are generating a new png file in your server.
As a source, you need to add input$file1$datapath to use the file that has been uploaded using the UI, as mentioned in this answer.
ui <- fluidPage(
titlePanel("Upload Slide Image"),
sidebarLayout(
sidebarPanel(fileInput("file1", "Choose png File", multiple = TRUE,
accept = c(".png")) ), # Input: Select a file ----
mainPanel(imageOutput("myImage"))
)
)
server <- function(input, output, session){
observe({
if (is.null(input$file1)) return()
output$myImage <- renderImage({
## Following three lines CREATE a NEW image. You do not need them
#outfile <- tempfile(fileext = '.png')
#png(outfile, width = 400, height = 300) # Generate the PNG
#dev.off()
list(src = input$file1$datapath, contentType = 'image/png',width = 400, height = 300,
alt = "This is alternate text")
}, deleteFile = TRUE)
})
}
# Create Shiny app ----
shinyApp(ui, server)
EDIT: I have added a check in observe to cater for error when the app is first run.