title: How to add controls in pan&zoom functionality in shiny app?
body: <p>I have used <code>panzoom</code> package in order to pan and zoom on my svg file in my shiny app. Is there a way to have controls like <a href="https://github.com/bumbu/svg-pan-zoom" rel="nofollow noreferrer">this</a>?</p>
  <pre><code>library(shiny)
  library(DiagrammeR)
  library(magrittr)
  
  ui &lt;- fluidPage(
    tags$head(
      tags$script(src = &quot;https://unpkg.com/panzoom@9.4.0/dist/panzoom.min.js&quot;)
    ),
  
    grVizOutput(&quot;grr&quot;, width = &quot;100%&quot;, height = &quot;90vh&quot;),
  
    tags$script(
      HTML('panzoom($(&quot;#grr&quot;)[0])')
    )
  )
  
  server &lt;- function(input, output) {
  
    reactives &lt;- reactiveValues()
  
    observe({
      reactives$graph &lt;- render_graph(create_graph() %&gt;%
                                        add_n_nodes(n = 2) %&gt;%
                                        add_edge(
                                          from = 1,
                                          to = 2,
                                          edge_data = edge_data(
                                            value = 4.3)))
    })
  
    output$grr &lt;- renderGrViz(reactives$graph)
  
  }
  
  shinyApp(ui, server)
  </code></pre>