Plotting and Graphics

Dynamic data visualisation for interactive code blocks

The quarto-live extension prepares the R and Python environment with WebAssembly-compatible graphics devices, and so plotting should work out of the box.

Customising plot size

Configure the plot size using the fig-width and fig-height cell options. Figure size is measured in “inches”. Plots are rendered for a given dots-per-inch (DPI) with an internal 2x scaling.

When using webR, the DPI is fixed at a value of 72.

Source

```{webr}
#| fig-width: 8
#| fig-height: 4
plot(rnorm(10000), t = 'l')
```

Output

When using Pyodide, the default DPI value is 100, but can be configured using the fig-dpi cell option.

Source

```{pyodide}
#| fig-width: 8
#| fig-height: 4
#| fig-dpi: 72
import matplotlib.pyplot as plt
import numpy as np

x = np.random.normal(1, 1, 10000)
plt.plot(x, '-')
plt.show() 
```

Output

Browser requirements

For both R and Python, the default canvas-based graphics device requires a web browser that supports the OffscreenCanvas API. Most modern and up-to-date web browsers will have this capability, but some older operating systems or mobile devices might not.

R

For webR graphics, there is a fallback bitmap device based on a WebAssembly build the of Cairo graphics library. This works well, but will be slower and invoke an additional resource download as the page is loaded.

Python

For Pyodide graphics, there is currently no bitmap fallback in place. Unsupported browsers will see the error message:

Cannot import 'OffscreenCanvas' from 'js'
Note

A similar bitmap graphics fallback for Python is planned for a future version of quarto-live.