title: Exporting a PNG from a dygraph plot in Shiny
body: <p>I'm having difficulty exporting a PNG of a dygraph in a Shiny app.  I have been using <a href="http://cavorite.com/labs/js/dygraphs-export/dygraph-extra.js" rel="nofollow">this script</a> following <a href="http://cavorite.com/labs/js/dygraphs-export/" rel="nofollow">the example</a> and modifying it for Shiny.  I'm using the <code>shinyjs</code> library to pass my dygraph object to the client.  I'm running into the following error: </p>
  
  <p><em>Uncaught TypeError: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The provided value is not of type '(HTMLImageElement or HTMLVideoElement or HTMLCanvasElement or ImageBitmap)'</em></p>
  
  <p>Here is a hopefully reproducible example:</p>
  
  <p>ui.R</p>
  
  <pre><code>library(shiny)
  library(dygraphs)
  library(shinyjs)
  
  js.png &lt;- '
    shinyjs.exportPNG = function(params) {
      var defaultParams = {
        dygraph : null,
        img : null,
        userOptions : null,
      }
      params = shinyjs.getParams(params, defaultParams);  
  
      var image = document.getElementById(params.img);
      Dygraph.Export.asPNG(params.dygraph, image);
    }
    '
  
  shinyUI(fluidPage(
    useShinyjs(),
    extendShinyjs(text = js.png),
    actionButton('btn', 'Go'),
    includeScript('./www/dygraph-extra.js'),
    dygraphOutput("plot"),
    img(id = 'plot-static')
    )
  )
  </code></pre>
  
  <p>server.R</p>
  
  <pre><code>library(dplyr)
  library(xts)
  
  shinyServer(function(input, output) {
  
    observeEvent(input$btn, {
      js$exportPNG(dygraph = dyplot.global, img = 'plot-static')
    })
  
    plot.data &lt;- reactive({
      d &lt;- airquality %&gt;%
        mutate(Date = as.Date(paste('1973', Month, Day, sep = '-'))) %&gt;%
        select(Date, Ozone, Temp) %&gt;%
        arrange(Date)
      d.xts &lt;- xts(d[,-1], order.by = d$Date)
    })
  
    output$plot &lt;- renderDygraph({
      g &lt;- dygraph(plot.data()) %&gt;%
        dyRangeSelector()
      dyplot.global &lt;&lt;- g
      g
    })
  })
  </code></pre>
  
  <p>I'm very novice with javascript, so please be gentle.  The actual plot and data are quite a bit more involved and I'm pretty invested in the interaction and features in dygraphs.  Thank you.</p>