# Converting an array of matrices into a gif

I have an array of 2d matrices and I would like to turn these into a gif. Each of the matrix has an entry from 1 to 8, denoting fixed states. I would like to specify a color for each state, so for example 1 is red, 2 is blue, 3 is green and so on.

The context is an agent-based model of disease spread. Each matrix (100 x 100) represents a square grid environment of individuals and the elements represent the health status. I would like to visualize the spread of disease.

Does anyone have a `Makie.jl`, `Images.jl` or `Reel.jl` tutorial to do this?

My favourite way to do this is with Interact and Plots, which will give you an â€śinteractive animationâ€ť. Use heatmap to do the actual plotting.

If you really want a gif, you can use @gif from Plots, but itâ€™s slow in my experience.

Makie has a record function to do this.

1 Like

Interactivity is nice, but I want to email or host the gifs/webm figures. Plus how to do a heatmap with fixed colors?

``````using IndirectArrays, FileIO, Colors
idxarray = rand(1:3, 100, 100, 50);
colorarray = IndirectArray(idxarray, [colorant"red", colorant"purple", colorant"indigo"])
save("myanimation.gif", colorarray; fps=10)
``````

(You need ImageMagick.jl for this.)

3 Likes

I am getting some errors with thisâ€¦ mainly that each matrix can have unique numbers from 0 to 8 (like in your example, each matrix will have a number from 1:3). Except, my matrices are little bit different. The â€śfirstâ€ť matrix is all zeros. The second matrix may have a 1 in there. The third matrix may have 0, 1, and 2â€¦ and so on. (Basically the matrices evolve over time).

If the first matrix is all zeros (or not exactly 9 unique elements), then I get the following error:

``````ERROR: BoundsError: attempt to access 10-element Array{RGB{N0f8},1} with eltype RGB{FixedPointNumbers.Normed{UInt8,8}}
``````

In your example, if you just do `idxarray[:, :, 1] = zeros(Int64, 100, 100)` you will get the same error.

Since some of your entries are zero, you need to supply a lookup array that can be indexed with 0. Try OffsetArrays.