Skip to content

Problems with Widget Resizing Inside {xaringan} slides #40

@BradyAJohnston

Description

@BradyAJohnston

When rendering a widget with {xaringan} slides, the widget resizes strangely.

In the example below, when rendered, each time the browser window is resized, the widget resizes as well. The problem arises because the container the widget canvas resizes, then the container that the canvas is is also resizes, leading to exaggerated shrinking and growing of the widget.

---
title: "Protein Example"
output: 
  xaringan::moon_reader:
    css: xaringan-themer.css
    seal: false
    nature:

      highlightStyle: github
      highlightLines: true
      ratio: 16:9
      countIncrementalSlides: true
      navigation:
        scroll: false

---

## Protein Viewer

```{r echo=FALSE, message=FALSE}
library(r3dmol)
model <- r3dmol(width = 400, height = 400) %>%
  m_add_model(r3dmol::pdb_1j72) %>%
  m_set_style(m_style_cartoon(color = "spectrum")) %>%
  m_zoom_to()
model
```

Widget after render.

image

Widget after shrinking the browser window.

image

Widget after enlarging the browser window.

image

I have tested it with {plotly} and the same problem doesn't happen - so it is something specific with r3dmol / 3dmol.js that is causing the problem. I just don't know enough javascript to track it down.

> sessionInfo()
R version 4.1.0 (2021-05-18)
Platform: x86_64-apple-darwin17.0 (64-bit)
Running under: macOS Big Sur 11.4

Matrix products: default
LAPACK: /Library/Frameworks/R.framework/Versions/4.1/Resources/lib/libRlapack.dylib

locale:
[1] en_AU.UTF-8/en_AU.UTF-8/en_AU.UTF-8/C/en_AU.UTF-8/en_AU.UTF-8

attached base packages:
[1] stats     graphics  grDevices utils     datasets  methods  
[7] base     

other attached packages:
[1] ggplot2_3.3.5 r3dmol_0.1.2 

loaded via a namespace (and not attached):
 [1] pillar_1.6.2         compiler_4.1.0      
 [3] sysfonts_0.8.5       tools_4.1.0         
 [5] digest_0.6.27        jsonlite_1.7.2      
 [7] evaluate_0.14        lifecycle_1.0.0     
 [9] tibble_3.1.3         gtable_0.3.0        
[11] viridisLite_0.4.0    pkgconfig_2.0.3     
[13] rlang_0.4.11         rstudioapi_0.13     
[15] cli_3.0.1            DBI_1.1.1           
[17] yaml_2.2.1           xfun_0.25           
[19] withr_2.4.2          showtextdb_3.0      
[21] xaringanthemer_0.4.0 knitr_1.33          
[23] dplyr_1.0.7          httr_1.4.2          
[25] generics_0.1.0       vctrs_0.3.8         
[27] htmlwidgets_1.5.3    DT_0.18             
[29] grid_4.1.0           tidyselect_1.1.1    
[31] glue_1.4.2           data.table_1.14.0   
[33] R6_2.5.1             fansi_0.5.0         
[35] plotly_4.9.4.1       xaringan_0.22       
[37] rmarkdown_2.10       purrr_0.3.4         
[39] tidyr_1.1.3          magrittr_2.0.1      
[41] scales_1.1.1         ellipsis_0.3.2      
[43] htmltools_0.5.1.1    rsconnect_0.8.24    
[45] showtext_0.9-4       assertthat_0.2.1    
[47] colorspace_2.0-2     utf8_1.2.2          
[49] lazyeval_0.2.2       munsell_0.5.0       
[51] crayon_1.4.1      

Metadata

Metadata

Assignees

Labels

bugSomething isn't working

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions