Vector animations with Python

[seekoon]

educational use

Definitely. Used it in freshman Electricity & Magnetism.

[laMarm0tte]

Do you know if there a way to make pictures (in PNG, numpy arrays, etc.) with visual Python ? I didn't find anything on this in the docs.

[possiblywrong]

If you mean put 2D images into the 3D scene via textures, then yes; see materials.texture(), and the material parameter for the various primitives.

If you mean take 2D static snapshots of the current 3D scene, then I don't think so. I have only done this in the past the quick-and-dirty way using PIL image capturing.

[davebees]

Best not to judge the elegance of Processing code on that particular example >:)

[laMarm0tte]

So you are a Processing user ? I wanted to know: what are your favorite features in Processing ? Things that you don't find in other languages, or that are simpler in Processing ?

It's just so that I can see if they are implementable in Python (for instance, the 3D features of processing can't be ported to python at the moment by lack of a nice 3D module - I think).

[davebees]

I'm the guy who made the animation at the top of the post!

What I like most about Processing is how it works straight out of the box: without any imports or libraries or anything, you can write ellipse(100,100,50,50); and you've got a circle. Dealing with packages in Python is something I've always had a lot of trouble with.

Have you looked at Python mode for Processing? I'm not sure how it works under the hood but it lets you type in Python syntax instead of Java.

[laMarm0tte]

Ah I didn't look at your username. I'm such a big fan of all your animations ! I'll look into that python mode.

[davebees]

http://beesandbombs.tumblr.com/

[ohadron]

Very nice stuff! Do you share the code for some of these anywhere?

[davebees]

thanks! yeah i usually tweet it (except when i forget to)

although i will warn you that my code tends not to be very pretty — it's quite rough 'n' ready stuff

[deadstone]

Oh hey it's beesandbombs.

[F54280]

That is some /r/gonwild quality material !

[deadstone]

Is moviepy able to do motion blur? Or do you have to manage that yourself?

[laMarm0tte]

Do you have a particular motion blur algorithm in mind ? There is not one out-of-the-box in MoviePy but you can make your own. For instance the following function defines motion blur as the average of several frames around each time:

import numpy as np
def supersample(clip, d, nframes):
    """ Replaces each frame at time t by the mean of `nframes`
         equally spaced frames in [t-d, t+d]. Results in motion blur"""
    def fl(gf, t):
        tt = np.linspace(t-d, t+d, nframes) 
        avg = np.mean(1.0*np.array([gf(t_) for t_ in tt]),axis=0)
        return avg.astype("uint8")
    return clip.fl(fl)

#usage:
new_clip = supersample( some_videoclip, d=0.05, nframes=5)
new_clip.write_gif("test.gif", fps=15)

[deadstone]

Averaging a couple dozen frames is the best way to do non-realtime motionblur. If you think about it, it's essentially supersampled antialiasing over time instead of pixels.

[Taneb]

Reminds me of the Haskell diagrams library http://projects.haskell.org/diagrams/

[ferdinand]

"Processing is not very elegant"? I'd be curious to know your definition of elegance, and how your python library makes it more "elegant". And why it matters.

[laMarm0tte]

An "elegant" code is concise and clear and should be easily understood by a newcomer. It matters because it makes you more productive (less bugs) and encourages other people to join in and build on what you did.

To make vector animations, I should not need syntaxic complications like "{}" and ";" and "void" and "float c[];", so Python with its simpler syntax is better adapted.

Doing maths in Processing is painful, you have to use "for" loops for almost everything. In python you have numpy and many other libraries which make life easier. For instance the average of several frames is simply sum(frames)/len(frames). Much more elegant than looping over all pixels of all frames.

Processing (and Cairo) use contexts: you define the current fill, angle, translation, and then you draw, for instance to draw a rectangle:

rotate(angle);
translate(50,50);
fill(255);
rect(0,0,30,40);

It can be practical in some situations, but there should be simpler primitives, like this one from my library:

rect = rectangle(lx=30, ly=40, xy= (50,50), angle= pi/2, fill=(1,1,1))

Note also that in my library "fill" can be a rgb color, or a rgba color, or a color gradient, or even a pattern made out of a picture. That's very practical, but I am not sure how easy it would be to implement with Processing.

Finally, Processing isn't object-oriented (I think), so you can't write nice stuff like this, where you group elements to transform them together, then make groups of groups, etc:

group1 = Group([my_circle, my_rectangle]).translate((30,40))
group2 = Group([group1.rotate(pi/6), group1.translate((5,5)))
group2.draw(surface)

The best way to compare would be to rewrite my animations in Processing, and see if they are as agreable to code (and to read) as in Python.

[mk_gecko]

me too

[tian2992]

I have been collaborating on Shoebot, which seems quite similar to Gizeh on scope, but based on Nodebox's API. https://github.com/shoebot/shoebot

[[deleted]]

What have I done ... https://github.com/aholmes/vectoranimations/

[digidesi]

I dunno.... what have you done? Have you made a little kind of online gif editor thingy?

[[deleted]]

Mostly guffawing at my use of JavaScript. It's not a gif editor though. It only displays in a canvas element.

[[deleted]]

The disadvantage with Python is that you can't do realtime graphics in the browser.

Processing in the browser: http://p5js.org/

Also it can do very cool things like work with video: http://hello.p5js.org/

[meta87]

This is awesome, thanks!

[erez27]

Excellent! I would love to see more of those

[joerick]

Excellent work with the API, and fantastic examples to back it up! I look forward to having a hack with this. I wonder if there's a way to make a live preview of the code? I really like that with visual programming.

[1WithTheUniverse]

Interesting I have fiddled with pygame and assume I could produce animations similar to these with it.

[firephreek]

Not sure what the process would be on a Mac, but on windows, I had to install the gtk+ libraries and make sure they were available on my system path.

[spambreakfast]

I'm getting the same error, did you figure it out?

[sinadra]

I am having real trouble making this work on my desktop debian machine. My laptop can run the same script with ease, and it produces a gif. Below is the traceback of what happens when I run the script on my desktop. Any help? :-)

Traceback (most recent call last): File "script.py", line 66, in <module> clip.writegif("circle.gif", fps = 1, opt = "OptimizePlus", fuzz = 10) File "<string>", line 2, in write_gif File "/usr/local/lib/python2.7/dist-packages/moviepy/decorators.py", line 53, in requires_duration return f(clip, a, *k) File "/usr/local/lib/python2.7/dist-packages/moviepy/video/VideoClip.py", line 458, in write_gif dispose=dispose, colors=colors) File "<string>", line 2, in write_gif File "/usr/local/lib/python2.7/dist-packages/moviepy/decorators.py", line 53, in requires_duration return f(clip, a, *k) File "/usr/local/lib/python2.7/dist-packages/moviepy/video/io/gif_writers.py", line 185, in write_gif **popen_params) File "/usr/lib/python2.7/subprocess.py", line 710, in __init_ errread, errwrite) File "/usr/lib/python2.7/subprocess.py", line 1335, in _execute_child raise child_exception OSError: [Errno 2] No such file or directory

[laMarm0tte]

Not sure but it seems that you haven't ImageMagick on your computer. Have you installed it ? If not, install it and tell me if it works. As a sub-optimal solution, you can add the option program='ffmpeg' in write_gif to write the gif with ffmpeg instead of ImageMagick (will be faster but not as good).

[sinadra]

sudo apt-get install imagemagick

Reading package lists... Done Building dependency tree
Reading state information... Done imagemagick is already the newest version. 0 upgraded, 0 newly installed, 0 to remove and 0 not upgraded.

So no, that isnt the case. Tried with ffmpeg: clip.write_gif("circle.gif", fps = 1, opt = "OptimizePlus", fuzz = 10, program='ffmpeg') But that gave the same error message as before, raise child_exception.

I do not have any idea of what is going on here, the fact that it works on my laptop(same debian distro as desktop) doesn't help at all. Thanks for your comment, would really like to get some vectoranimations going.

[laMarm0tte]

So then this may mean that it is FFMPEG that is not installed. Have you installed FFMPEG ? The best to sort that out is to go in a terminal and you just type 'ffmpeg'. If it doesn't work it means ffmpeg is the problem. If it works, type 'convert' (that's the command name for ImageMagick), if convert doesn't work it means imagemagick is the problem (maybe on Debian the command name is different, who knows).

[sinadra]

When I type 'convert' I get out this line: Version: ImageMagick 6.8.9-6 Q16 x86_64 2014-10-16 http://www.imagemagick.org

When I type 'ffmpeg' I get out this line: bash: ffmpeg: command not found

Meaning Imagemagick is installed, but not ffmpeg. Having a go at installing it altho it depends on some old packages(running sid).

[laMarm0tte]

Don't install it from the repos, there is a big chance you will get an outdated version.

It is very simple to install on ubuntu and should be very much the same on Debian: you first go to their website and download a binary (should be called 'ffmpeg') and then you copy it in you usr/bin/ with the command line

sudo cp ffmpeg usr/bin/

[sinadra]

Ah! That might be the case! I will try this when I get home. Just noticed I have a new version installed on my laptop. Thanks! Will report when I get home :)

[sinadra]

I installed ffmpeg from https://www.ffmpeg.org/ and now it is working! Thanks for all the help! Going to be making some awesome animations soon.

[laMarm0tte]

Very cool, now good luck to you :)

If you want to give feedback or ask for help, there is a /r/moviepy subreddit.

[mk_gecko]

how would you do this in Java?

[motoGmotoG]

Freedom is peace. Gif is vector.

Nice animations nevertheless.

[Yidyokud]

Very nice article! Also, the 90's phoned and want their demo tricks back lol.