quarto-dev / quarto-dev/quarto-cli
Plotly plots don't load at correct size
@cderv is already working on this.
Since Sep 20, 2023.
- Dominant language
- JavaScript
- Stars
- 6k
- Forks
- 458
- Avg merge
- 1d 9h
- Merged PRs (30d)
- 41
Description
Bug description
This could be a Plotly bug as far as I know, but I'm working around it with a Quarto revealjs plugin, so I'm reporting it here for reference.
In a presentation with lots of Plotly plots, the plots initially load with an incorrect width. It's not that far off, so I usually don't notice it, but sometimes things get cut off on the sides.
I made a quick hacky workaround by manually running Plotly.js's resize handler when a slide containing a plotly plot loads: https://gist.github.com/kcarnold/551feebb4f7bd54e0e530174e75a04da
I have a hunch that some Plotly initialization code is getting called before Reveal has finished setting up the slide layout. In light of that, perhaps an alternative workaround might be to trigger a window resize event as soon as Reveal is ready.
Steps to reproduce
Page through https://calvin-data-science.github.io/data202/units/04vis2/w4d1-vis2.html — you'll see some plots "jump" as the slide loads. That's my hacky workaround forcing a resize.
Expected behavior
Plots should load at the correct size in the first place.
Actual behavior
Plots resize to the correct size only when the window resizes (or when manually triggered).
Your environment
No response
Quarto check output
Seen on both Firefox and Chrome.
Quarto 99.9.9
[✓] Checking versions of quarto binary dependencies...
Pandoc version 3.1.8: OK
Dart Sass version 1.55.0: OK
Deno version 1.33.4: OK
[✓] Checking versions of quarto dependencies......OK
[✓] Checking Quarto installation......OK
Version: 99.9.9
Path: /Users/ka37/code/github.com/quarto-dev/quarto-cli/package/dist/bin
(/) Checking tools....................Check file:///Users/ka37/code/github.com/quarto-dev/quarto-cli/src/resources/vendor/deno-land/x/puppeteer@9-0-2/mod.ts
[✓] Checking tools....................OK
TinyTeX: (not installed)
Chromium: (not installed)
[✓] Checking LaTeX....................OK
Using: Installation From Path
Path: /Library/TeX/texbin
Version: 2023
[✓] Checking basic markdown render....OK
[✓] Checking Python 3 installation....OK
Version: 3.11.5
Path: /usr/local/opt/python@3.11/bin/python3.11
Jupyter: (None)
Jupyter is not available in this Python installation.
Install with python3 -m pip install jupyter
[✓] Checking R installation...........OK
Version: 4.3.1
Path: /Library/Frameworks/R.framework/Resources
LibPaths:
- /Users/ka37/Library/R/4.2/library
- /Library/Frameworks/R.framework/Versions/4.3-x86_64/Resources/library
knitr: 1.44
rmarkdown: 2.24
[✓] Checking Knitr engine render......OK
(note that the Python 3 installation error there is a lie; Jupyter rendering is working fine for me.)
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Assessment
This issue has not been assessed yet.