Makie animations with Quarto and Julia

[plessl]

Hi all

I trying to generate animations with the Makie plotting library using the CairoMakie backend. While static plots are embedded by Quarto as expected, the result of the animation is not embedded.

You find a minimal working Quarto example below. You may have to change the name of the jupyter kernel to match your setup.

Any help is greatly appreciated.

Cheers
Christian

---
format:
  html:
    code-fold: true
    output: false
jupyter: julia-1.9
---

```{julia}
import Pkg;
Pkg.activate(".")
Pkg.add("Makie")
Pkg.add("CairoMakie")

using CairoMakie
using Makie.Colors

fig, ax, lineplot = lines(0..10, sin; linewidth=10)

# animation settings
nframes = 30
framerate = 30
hue_iterator = range(0, 360, length=nframes)

record(fig, "color_animation.gif", hue_iterator;
        framerate = framerate) do hue
    lineplot.color = HSV(hue, 1, 0.75)
end
current_figure()
```

[MHellmund]

Quarto shows the same as Jupyter: the content of fig, i.e., the last frame of the animation. How should it pick up the name of the gif file generated by the record command?

You may insert the gif figure after the code cell

![](color_animation.gif)

(and remove the current_figure line). Looks OK to me.

[plessl]

You are right. I expected that the animation must be included as a base64 encoded data section in HTML. But of course I can also render the animation into the Quarto output directory and simply link it as an image, as you suggested.

Thanks a lot!

[MHellmund]

Ah, you are right, too. From ?record:

Under the hood, record is just video_io = Record(func, figurelike, [iter]; same_kw...); save(path, video_io).
Record can be used directly as well to do the saving at a later point, or to inline a video directly into a 
Notebook (the video supports, show(video_io, "text/html") for that purpose).

So we have to use Record and display() the result:

using CairoMakie
using Makie.Colors

fig, ax, lineplot = lines(0..10, sin; linewidth=10)

# animation settings
nframes = 30
framerate = 30
hue_iterator = range(0, 360, length=nframes)

anim = Record(fig, hue_iterator;
        framerate = framerate) do hue
    lineplot.color = HSV(hue, 1, 0.75)
end

display(anim)

works great for me.

[plessl]

Works like a charm. Thank you very much!