# Recommendation for animated 3D diagram

**URL:** <https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903>\
**Category:** Visualization\
**Created:** [June 5, 2023, 4:56pm UTC](https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903 "2023-06-05T16:56:50Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![goerz](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/goerz/32/3269_2.png) [@goerz](https://discourse.julialang.org/u/goerz)\
**Post date:** [June 5, 2023, 4:56pm UTC](https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903/1 "2023-06-05T16:56:50Z")

</div>

I’m contemplating trying to make an animation based on the following figure:

 ![CleanShot 2023-06-05 at 12.39.17@2x](https://global.discourse-cdn.com/julialang/original/3X/b/b/bb832998f9b420b8227318a12145c05e317d8402.jpeg)

In the animation, I’d like to have the two red cups (and the blue balls contained in them) rotate independently around the circle, with a position ϕ(t) that follows a specific equation.

Does anyone have a recommendation on what packages to use to create such an animation? It doesn’t need to copy the figure _exactly_, but I’d like to more or less retain the 3D-like character, and the unicode labels are pretty important. It doesn’t need to be fancy 3D (raytraced). In fact, I’d probably prefer the “diagram” look that the figure has now.

I’m open to any solutions in Julia or Python (matplotlib), and possibly also TeX/TikZ in combination with some scripting (this animation is going into a Beamer presentation). If someone has code-snippets for parts of such a figure, to get me started, that would be especially helpful, since I’d need to finish this animation within the next 24 hours or so if I want to put it in the talk. 😉

(the original was created by a collaborator, probably mostly manually in Inkscape; I don’t have access to the underlying document)

---

<div class="post-metadata">

**Author:** ![goerz](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/goerz/32/3269_2.png) [@goerz](https://discourse.julialang.org/u/goerz)\
**Post date:** [June 5, 2023, 6:12pm UTC](https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903/2 "2023-06-05T18:12:42Z")

</div>

I’m making some progress with TikZ based on [3d-plane and rotating coordinate system in TiKZ - TeX - LaTeX Stack Exchange](https://tex.stackexchange.com/questions/72959/3d-plane-and-rotating-coordinate-system-in-tikz) and having been able to extract just the “cup” from the figure as a semi-transparent pdf, so I think that’s going to be the way to go…

---

<div class="post-metadata">

**Author:** ![empet](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/empet/32/221303_2.png) [@empet](https://discourse.julialang.org/u/empet)\
**Post date:** [June 5, 2023, 8:16pm UTC](https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903/3 "2023-06-05T20:16:15Z")

</div>

I defined a “bell” as minus the rescaled pdf of the bivariate normal distribution and this is how it looks: [https://nbviewer.org/gist/empet/8879dbaecd6f46e4ebcb2526ec8c0df0](https://nbviewer.org/gist/empet/8879dbaecd6f46e4ebcb2526ec8c0df0). The perspective projection makes the two “bells” look as being non-orthogonal to the disk. Also the lighting could be better.

---

<div class="post-metadata">

**Author:** ![jar1](https://avatars.discourse-cdn.com/v4/letter/j/c0e974/32.png) [@jar1](https://discourse.julialang.org/u/jar1)\
**Post date:** [June 5, 2023, 8:23pm UTC](https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903/4 "2023-06-05T20:23:30Z")

</div>

I expect Makie can do this.

---

<div class="post-metadata">

**Author:** ![goerz](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/goerz/32/3269_2.png) [@goerz](https://discourse.julialang.org/u/goerz)\
**Post date:** [June 6, 2023, 6:03am UTC](https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903/5 "2023-06-06T06:03:25Z")

</div>

Well, TikZ with a little bit of Python scripting did the trick:

[https://global.discourse-cdn.com/julialang/original/3X/8/9/8905a4b4d513b0e5c668c73b8ae017acbbc1e2d0.mp4](https://global.discourse-cdn.com/julialang/original/3X/8/9/8905a4b4d513b0e5c668c73b8ae017acbbc1e2d0.mp4)

(source once I clean this up and put it on Github later this week)

---

<div class="post-metadata">

**Author:** ![Freya\_the\_Goddess](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/freya_the_goddess/32/36835_2.png) [@Freya\_the\_Goddess](https://discourse.julialang.org/u/Freya_the_Goddess)\
**Post date:** [June 6, 2023, 8:34am UTC](https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903/6 "2023-06-06T08:34:32Z")

</div>

I’ll be waiting for the source code for this in Tikz Latex. No Julia expert here can create animation for this one?

---

<div class="post-metadata">

**Author:** ![sijo](https://avatars.discourse-cdn.com/v4/letter/s/da6949/32.png) [@sijo](https://discourse.julialang.org/u/sijo)\
**Post date:** [June 6, 2023, 11:43am UTC](https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903/7 "2023-06-06T11:43:20Z")

</div>

Here’s a sketch with Makie:

```julia
f(x, y) = 1-exp(-(x^2+y^2))

r = 0:0.1:2
theta = LinRange(-pi, pi, 100)
x = r .* cos.(theta')
y = r .* sin.(theta')

R = 5.0
alpha = Observable(0.0)
x0 = @lift(R*cos($alpha))
y0 = @lift(R*sin($alpha))

fig = Figure()
ax = Axis3(fig[1,1], aspect=(3,3,1))
surface!(ax, @lift(x .- $x0), @lift(y .- $y0), f.(x, y), color=fill(:blue, size(x)), transparency=true)
surface!(ax, @lift(x .- $x0), @lift(y .+ $y0), f.(x, y), color=fill(:red, size(x)), transparency=true)
lines!(ax, R*cos.(theta), R*sin.(theta), color=:black, linestyle=:dash)
hidedecorations!(ax)
hidespines!(ax)

record(fig, "figure.mp4", -pi:0.05:pi; framerate=30) do α
    alpha[] = α
end

```

[https://global.discourse-cdn.com/julialang/original/3X/3/6/3623726f5a509dbb089689f4c5bad79647371d3a.mp4](https://global.discourse-cdn.com/julialang/original/3X/3/6/3623726f5a509dbb089689f4c5bad79647371d3a.mp4)

---

<div class="post-metadata">

**Author:** ![BambOoxX](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/bambooxx/32/22179_2.png) [@BambOoxX](https://discourse.julialang.org/u/BambOoxX)\
**Post date:** [June 6, 2023, 1:39pm UTC](https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903/8 "2023-06-06T13:39:13Z")

</div>

This reminds me of an old question of mine on stackexchange … [pgfplots - How to display a duck or marmot swallowed by a darkhole - TeX - LaTeX Stack Exchange](https://tex.stackexchange.com/questions/505844/how-to-display-a-duck-or-marmot-swallowed-by-a-darkhole)

---

<div class="post-metadata">

**Author:** ![cormullion](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/cormullion/32/49131_2.png) [@cormullion](https://discourse.julialang.org/u/cormullion)\
**Post date:** [June 6, 2023, 2:31pm UTC](https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903/9 "2023-06-06T14:31:03Z")

</div>

A bit late - I hope your talk went well!

This was a little challenging in Julia, I admit … 🙂

![mov](https://global.discourse-cdn.com/julialang/original/3X/0/f/0fe0ff0e2c7844fe076b09bcbe9058c1eb5f1392.gif)

---

<div class="post-metadata">

**Author:** ![goerz](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/goerz/32/3269_2.png) [@goerz](https://discourse.julialang.org/u/goerz)\
**Post date:** [June 8, 2023, 6:10pm UTC](https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903/10 "2023-06-08T18:10:07Z")

</div>

Ok, so the Python/TikZ source for [the animation](https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903/5) is now at

> <https://github.com/ARLQCI/2023-06_DAMOP_Goerz_RotTAI_Slides/blob/master/images/animate_rottai.py>

(together with a call to `ffmpeg` in the [`Makefile`](https://github.com/ARLQCI/2023-06_DAMOP_Goerz_RotTAI_Slides/blob/master/images/Makefile))

> A bit late - I hope your talk went well!

Thanks! I think so! 🙂 A recording of the trial talk is on [YouTube](https://www.youtube.com/watch?v=2_6KC89pTJI), for anyone who might be interested.

Even though TikZ turned out as the easiest way for me to make this animation, I’d like to thank everyone for their suggestions! It’s definitely good to have some ideas on how to do these kinds of animation with Julia.

---

<div class="post-metadata">

**Author:** ![goerz](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/goerz/32/3269_2.png) [@goerz](https://discourse.julialang.org/u/goerz)\
**Post date:** [June 8, 2023, 6:11pm UTC](https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903/11 "2023-06-08T18:11:52Z")

</div>

Is that done with `Luxor.jl` (which is definitely a package I’d like to explore for this kind of thing, alongside Makie)? Can you share the script you used to generate the animation?

---

<div class="post-metadata">

**Author:** ![cormullion](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/cormullion/32/49131_2.png) [@cormullion](https://discourse.julialang.org/u/cormullion)\
**Post date:** [June 8, 2023, 6:29pm UTC](https://discourse.julialang.org/t/recommendation-for-animated-3d-diagram/99903/12 "2023-06-08T18:29:50Z")

</div>

haha, sure, I just wanted to see how tricky it would be… (I needed some 3D points at one stage…)

> <https://gist.github.com/cormullion/ac8c456d68931befbe86634ef7c644f0>