Zoom in renderImage or zoom of an image in a renderPlot

[charlott...@gmail.com]

Hello everybody !

I am still trying to zoom in an plot containing an image (https://groups.google.com/forum/#!searchin/shiny-discuss/svgPanZoom%7Csort:relevance/shiny-discuss/F3Y2yBO-mEY/JnbXJfywAAAJ).

A brief context for my app: the aim of this app would be to determine the structure of a biological tissue. So this app would upload an image of the tissue (a picture from a microscope for instance) and the user will have to click on the image to place the nucleus of each cell to finally get the coordinates of each nucleus (and thus draw a map of the tissue).

However, the problem is that sometimes the cells are so small that users will have to zoom on the picture to see correctly the nucleus.

1/ So I tried first to include this image in a plot. But when users zoom, the plot is correctly zoomed but not the image on the background. It remains with the same dimensions:

library(ggplot2)
library(Cairo)   # For nicer ggplot2 output when deployed on Linux

ui <- fluidPage(
  fluidRow(
    column(width = 4, class = "well",
           h4("Brush and double-click to zoom"),
           plotOutput("plot1", height = 300,
                      dblclick = "plot1_dblclick",
                      brush = brushOpts(
                        id = "plot1_brush",
                        resetOnNew = TRUE
                      )
           )
    )
   
  )
)

server <- function(input, output) {
 
  # -------------------------------------------------------------------
  # Single zoomable plot (on left)
  ranges <- reactiveValues(x = NULL, y = NULL)
 
  # Write to a temporary PNG file
  outfile <- tempfile(fileext = ".jpg")
 
  jpeg(outfile)
  plot(rnorm(200), rnorm(200))
  dev.off()
 
  image <- readJPEG(outfile)
 
  g <- rasterGrob(image, interpolate=TRUE)
 
  output$plot1 <- renderPlot({
    ggplot(mtcars, aes(wt, mpg)) +
      geom_point() +
      coord_cartesian(xlim = ranges$x, ylim = ranges$y) +
      annotation_custom(g)
  })
 
  # When a double-click happens, check if there's a brush on the plot.
  # If so, zoom to the brush bounds; if not, reset the zoom.
  observeEvent(input$plot1_dblclick, {
    brush <- input$plot1_brush
    if (!is.null(brush)) {
      ranges$x <- c(brush$xmin, brush$xmax)
      ranges$y <- c(brush$ymin, brush$ymax)
     
    } else {
      ranges$x <- NULL
      ranges$y <- NULL
    }
  })
 

 
}

shinyApp(ui, server)

2/ I tried with a renderImage. But in this case no zoom is happening although all the elements are present for working.

library(ggplot2)
library(Cairo)   # For nicer ggplot2 output when deployed on Linux

ui <- fluidPage(
  fluidRow(
    column(width = 4, class = "well",
           h4("Brush and double-click to zoom"),
           plotOutput("plot1", height = 300,
                      dblclick = "plot1_dblclick",
                      brush = brushOpts(
                        id = "plot1_brush",
                        resetOnNew = TRUE
                      )
           )
    )
   
  )
)

server <- function(input, output) {
 
  # -------------------------------------------------------------------
  # Single zoomable plot (on left)
  ranges <- reactiveValues(x = NULL, y = NULL)
 
  # Write to a temporary PNG file
  outfile <- tempfile(fileext = ".jpg")
 
  jpeg(outfile)
  plot(rnorm(200), rnorm(200))
  dev.off()
 
  image <- readJPEG(outfile)
 
  g <- rasterGrob(image, interpolate=TRUE)
 
  output$plot1 <- renderPlot({
    ggplot(mtcars, aes(wt, mpg)) +
      geom_point() +
      coord_cartesian(xlim = ranges$x, ylim = ranges$y) +
      annotation_custom(g)
  })
 
  # When a double-click happens, check if there's a brush on the plot.
  # If so, zoom to the brush bounds; if not, reset the zoom.
  observeEvent(input$plot1_dblclick, {
    brush <- input$plot1_brush
    if (!is.null(brush)) {
      ranges$x <- c(brush$xmin, brush$xmax)
      ranges$y <- c(brush$ymin, brush$ymax)
     
    } else {
      ranges$x <- NULL
      ranges$y <- NULL
    }
  })
 

 
}

shinyApp(ui, server)

I cannot understand? except the ggplot all the elements are correctly organized for a zoom? no?

Does anyone have any ideas on how fix these problems?

Thank you veru much in advance !

Cha