Pymations Outside Circuitry
Your animation files also run on your own computer, and become web pages.
Install
Pymations is also a free, open-source Python package (MIT licence): the files you write in Circuitry run with your own Python.
pip install pymations
It needs Python 3.9 or newer, and nothing else: no LaTeX, no video tools.
Run a file
pymations run scene.py
Your browser opens on the animation, with the same timeline to play, pause and scrub. Every scene in the file plays in order, errors show their line number, and saving the file runs it again.
| Option | What it does |
|---|---|
--port 8800 | The port to use (8770, or the next free one, unless you say) |
--host | The address to listen on |
--no-browser | Don't open the browser |
pymations run folder/ lists the scenes in a folder to pick from.
Make a web page
| Command | What it makes |
|---|---|
pymations build scene.py -o scene.html | One file with everything inside it (about 2.5 MB). It opens straight from disk, or can be emailed |
pymations build scene.py -o site/ | A folder of plain files for any web host |
pymations build folder/ -o site/ | A page for each scene in the folder, plus an index page |
--add FILE adds a file or folder the scene reads (pictures, data); give it more than once for several. --title sets the page title.
The page runs Python in the browser, loaded from the internet the first time, so nobody needs Python installed to watch it.
Put animations in your own page
Put the pymations/ folder from a built site next to your page, and add a <div> for each animation:
<div data-pymations-src="scene.py"></div>
<div data-pymations-src="intro.py" data-pymations-loop></div>
<script type="module" src="pymations/pymations.js"></script>
Each animation starts when it scrolls into view. Settings on the <div>:
| Setting | What it does |
|---|---|
data-pymations-loop | Plays again from the start when it ends |
data-pymations-autoplay="off" | Waits for a press of play |
data-pymations-controls="off" | Hides the timeline |
data-pymations-background | The colour behind the animation |
data-pymations-output="panel" | Shows what the file prints, under the animation |
data-pymations-files | Files the scene reads |
data-pymations-fullpage | Fills the whole page |
The same files everywhere
- A file written in Circuitry runs with the package unchanged, and one written for the package runs in Circuitry.
from manim import *scripts run too, inpymations runand in built pages (what matches).- To make a video, open the file in Circuitry and use Record Video.
The code, examples and instructions are on GitHub: github.com/johnwylie70/pymations. The package is on PyPI as pymations, and the browser files are on npm as pymations.