In R, how to fit a plot made with plot_ly into an html page

Question

I'm building an html page with a plot made with plot_ly and under it I have some buttons connected to the data of the plot. Here is the layout so far.

I would like to fit the plot fully in the box.

Also, I would like to know why every time I'm double clicking the plot in the html page, it will be resized as the picture below. Is it a bug or is there a way to solve this issue?

This is part of my code:

p<-plot_ly(data = df, x = ~sample1, y = ~sample2, type = "scatter", mode = "markers", width = 600, height = 700,
       marker = list(symbol = "cross",size = 4, opacity = 0.5, color = "rgba(50,50,50,0.5)",alpha = I(0.8)))

#HTML code plot
html_plot <- tags$div(
  style = paste0(
    "width: ", "700px", "; ",
    "height: ", "700px", "; ",
    "border: 1px solid black;"
  ),
  p
)

#HTML complete code
html_code <- tagList(
  tags$h1(plot_title),
  html_plot,
  tags$p(plot_caption),
  tags$button(
    onclick = "toggleTable()",
    "Show/Hide data"
  ),
  tags$button(
    onclick = "copyTable()",
    "Copy data"
  ),
  html_table,
  HTML(html_script)
)

What you have here isn't reproducible. You can try this though: 1) When creating the plot object, `p`, **remove** the arguments for size: `width = 600, height = 700`. 2) After you creating `p`, run this code: `p$sizingPolicy$defaultHeight = '100%'`. Now your plot should fit in the styles you set in `html_plot`. If that doesn't work, make your question reproducible so I can be a better help: [making R reproducible questions](https://stackoverflow.com/q/5963269). — Kat, Jun 22 '23 at 05:06

In R, how to fit a plot made with plot_ly into an html page

0 Answers0