Main entry-point for accessing an animation. Creates a program that takes the following command-line arguments:

Usage: PROG [COMMAND]
  This program contains an animation which can either be viewed in a web-browser
  or rendered to disk.

Available options:
  -h,--help                Show this help text

Available commands:
  check                    Run a system's diagnostic and report any missing
                           external dependencies.
  view                     Play animation in browser window.
  render                   Render animation to file.

Neither the 'check' nor the 'view' command take any additional arguments. Rendering animation can be controlled with these arguments:

Usage: PROG render [-o|--target FILE] [--fps FPS] [-w|--width PIXELS]
                   [-h|--height PIXELS] [--compile] [--format FMT]
                   [--preset TYPE]
  Render animation to file.

Available options:
  -o,--target FILE         Write output to FILE
  --fps FPS                Set frames per second.
  -w,--width PIXELS        Set video width.
  -h,--height PIXELS       Set video height.
  --compile                Compile source code before rendering.
  --format FMT             Video format: mp4, gif, webm
  --preset TYPE            Parameter presets: youtube, gif, quick
  -h,--help                Show this help text

SVG node.

Time signal. Goes from 0 to 1, inclusive.

Duration of an animation or effect. Usually measured in seconds.

Animations are SVGs over a finite time.

Construct an animation with a given duration.

Construct an animation with a duration of 1.

Create an animation with provided duration, which consists of stationary frame displayed for its entire duration.

Query the duration of an animation.

Calculate the frame that would be displayed at given point in time of running animation.

The provided time parameter is clamped between 0 and animation duration.

Play animations in sequence. The lhs animation is removed after it has completed. New animation duration is 'duration lhs + duration rhs'.

Example:

drawBox `seqA' drawCircle

Play two animation concurrently. Shortest animation freezes on last frame. New animation duration is 'max (duration lhs) (duration rhs)'.

Example:

drawBox `parA' adjustDuration (*2) drawCircle

Play two animation concurrently. Shortest animation loops. New animation duration is 'max (duration lhs) (duration rhs)'.

Example:

drawBox `parLoopA' adjustDuration (*2) drawCircle

Play two animation concurrently. Animations disappear after playing once. New animation duration is 'max (duration lhs) (duration rhs)'.

Example:

drawBox `parLoopA' adjustDuration (*2) drawCircle

Empty animation (no SVG output) with a fixed duration.

Example:

pause 1 `seqA' drawProgress

Play left animation and freeze on the last frame, then play the right animation. New duration is 'duration lhs + duration rhs'.

Example:

drawBox `andThen' drawCircle

Map over the SVG produced by an animation at every frame.

Example:

mapA (scale 0.5) drawCircle

Freeze the last frame for t seconds at the end of the animation.

Example:

pauseAtEnd 1 drawProgress

Freeze the first frame for t seconds at the beginning of the animation.

Example:

pauseAtBeginning 1 drawProgress

Freeze the first and the last frame of the animation for a specified duration.

Example:

pauseAround 1 1 drawProgress

Change the duration of an animation. Animates are stretched or squished (rather than truncated) to fit the new duration.

Set the duration of an animation by adjusting its playback rate. The animation is still played from start to finish without being cropped.

Play an animation in reverse. Duration remains unchanged. Shorthand for: signalA reverseS.

Example:

reverseA drawCircle

Play animation before playing it again in reverse. Duration is twice the duration of the input.

Example:

playThenReverseA drawCircle

Loop animation n number of times. This number may be fractional and it may be less than 1. It must be greater than or equal to 0, though. New duration is n*duration input.

Example:

repeatA 1.5 drawCircle

freezeAtPercentage time animation creates an animation consisting of stationary frame, that would be displayed in the provided animation at given time. The duration of the new animation is the same as the duration of provided animation.

Overlay animation on top of static SVG image.

Example:

addStatic (mkBackground "lightblue") drawCircle

Modify the time component of an animation. Animation duration is unchanged.

Example:

signalA (fromToS 0.25 0.75) drawCircle

Signals are time-varying variables. Signals can be composed using function composition.

Constant signal.

Example:

signalA (constantS 0.5) drawProgress

Signal with new starting and end values.

Example:

signalA (fromToS 0.8 0.2) drawProgress

Reverse signal order.

Example:

signalA reverseS drawProgress

S-curve signal. Takes a steepness parameter. 2 is a good default.

Example:

signalA (curveS 2) drawProgress

Power curve signal. Takes a steepness parameter. 2 is a good default.

Example:

signalA (powerS 2) drawProgress

Bell-curve signal. Takes a steepness parameter. 2 is a good default.

Example:

signalA (bellS 2) drawProgress

Oscillate signal.

Example:

signalA oscillateS drawProgress

Cubic Bezier signal. Gives you a fair amount of control over how the signal will curve.

Example:

signalA (cubicBezierS (0.0, 0.8, 0.9, 1.0)) drawProgress

A Scene represents a sequence of animations and variables that change over time.

The ZIndex property specifies the stack order of sprites and animations. Elements with a higher ZIndex will be drawn on top of elements with a lower index.

Render a Scene to an Animation.

Play an animation once and then remove it. This advances the clock by the duration of the animation.

Example:

do play drawBox
   play drawCircle

Execute actions in a scene without advancing the clock. Note that scenes do not end before all forked actions have completed.

Example:

do fork $ play drawBox
   play drawCircle

Query the current clock timestamp.

Example:

do now <- play drawCircle *> queryNow
   play $ staticFrame 1 $ scale 2 $ withStrokeWidth 0.05 $
     mkText $ "Now=" <> T.pack (show now)

Advance the clock by a given number of seconds.

Example:

do fork $ play drawBox
   wait 1
   play drawCircle

Wait until the clock is equal to the given timestamp.

Wait until all forked and sequential animations have finished.

Example:

do waitOn $ fork $ play drawBox
   play drawCircle

Change the ZIndex of a scene.

Query the duration of a scene.

Time dependent variable.

Create a new variable with a default value. Variables always have a defined value even if they are read at a timestamp that is earlier than when the variable was created. For example:

do v <- fork (wait 10 >> newVar 0) -- Create a variable at timestamp '10'.
   readVar v                       -- Read the variable at timestamp '0'.
                                   -- The value of the variable will be '0'.

Read the value of a variable at the current timestamp.

Write the value of a variable at the current timestamp.

Example:

do v <- newVar 0
   newSprite $ mkCircle <$> unVar v
   writeVar v 1; wait 1
   writeVar v 2; wait 1
   writeVar v 3; wait 1

Modify the value of a variable at the current timestamp and all future timestamps.

Modify a variable between now and now+duration.

Create and render a variable. The rendering will be born at the current timestamp and will persist until the end of the scene.

Example:

do var <- simpleVar mkCircle 0
   tweenVar var 2 $ \val -> fromToS val (screenHeight/2)

Helper function for filtering variables.

Sprites are animations with a given time of birth as well as a time of death. They can be controlled using variables, tweening, and effects.

Sprite frame generator. Generates frames over time in a stateful environment.

Dereference a variable as a Sprite frame.

Example:

do v <- newVar 0
   newSprite $ mkCircle <$> unVar v
   tweenVar v 1 $ \val -> fromToS val 3
   tweenVar v 1 $ \val -> fromToS val 0

Dereference seconds since sprite birth.

Dereference duration of the current sprite.

Create new sprite defined by a frame generator. Unless otherwise specified using destroySprite, the sprite will die at the end of the scene.

Example:

do newSprite $ mkCircle <$> spriteT -- Circle sprite where radius=time.
   wait 2

Create new sprite defined by a frame generator. The sprite will die at the end of the scene.

Create a new sprite from an animation. This advances the clock by the duration of the animation. Unless otherwise specified using destroySprite, the sprite will die at the end of the scene.

Note: If the scene doesn't end immediately after the duration of the animation, the animation will be stretched to match the lifetime of the sprite. See newSpriteA' and play.

Example:

do fork $ newSpriteA drawCircle
   play drawBox
   play $ reverseA drawBox

Create a new sprite from an animation and specify the synchronization policy. This advances the clock by the duration of the animation.

Example:

do fork $ newSpriteA' SyncFreeze drawCircle
   play drawBox
   play $ reverseA drawBox

Create a sprite from a static SVG image.

Example:

do newSpriteSVG $ mkBackground "lightblue"
   play drawCircle

Create a permanent sprite from a static SVG image. Same as newSpriteSVG but the sprite isn't returned and thus cannot be destroyed.

Destroy a sprite, preventing it from being rendered in the future of the scene. If destroySprite is invoked multiple times, the earliest time-of-death is used.

Example:

do s <- newSpriteSVG $ withFillOpacity 1 $ mkCircle 1
   fork $ wait 1 >> destroySprite s
   play drawBox

Change the rendering of a sprite using data from a variable. If data from several variables is needed, use a frame generator instead.

Example:

do s <- fork $ newSpriteA drawBox
   v <- newVar 0
   applyVar v s rotate
   tweenVar v 2 $ \val -> fromToS val 90

Low-level frame modifier.

Map the SVG output of a sprite.

Example:

do s <- fork $ newSpriteA drawCircle
   wait 1
   spriteMap s flipYAxis

Modify the output of a sprite between now and now+duration.

Example:

do s <- fork $ newSpriteA drawCircle
   spriteTween s 1 $ \val -> translate (screenWidth*0.3*val) 0

Create a new variable and apply it to a sprite.

Example:

do s <- fork $ newSpriteA drawBox
   v <- spriteVar s 0 rotate
   tweenVar v 2 $ \val -> fromToS val 90

Apply an effect to a sprite.

Example:

do s <- fork $ newSpriteA drawCircle
   spriteE s $ overBeginning 1 fadeInE
   spriteE s $ overEnding 0.5 fadeOutE

Set new ZIndex of a sprite.

Example:

do s1 <- newSpriteSVG $ withFillOpacity 1 $ withFillColor "blue" $ mkCircle 3
   newSpriteSVG $ withFillOpacity 1 $ withFillColor "red" $ mkRect 8 3
   wait 1
   spriteZ s1 1
   wait 1

Destroy all local sprites at the end of a scene.

Example:

do -- the rect lives through the entire 3s animation
   newSpriteSVG_ $ translate (-3) 0 $ mkRect 4 4
   wait 1
   spriteScope $ do
     -- the circle only lives for 1 second.
     local <- newSpriteSVG $ translate 3 0 $ mkCircle 2
     spriteE local $ overBeginning 0.3 fadeInE
     spriteE local $ overEnding 0.3 fadeOutE
     wait 1
   wait 1

An Effect represents a modification of a SVG Tree that can vary with time.

Modify the effect so that it only applies to the initial part of the animation.

Modify the effect so that it only applies to the ending part of the animation.

Modify the effect so that it only applies within given interval of animation's running time.

reverseE effect starts where the effect ends and vice versa.

Delay the effect so that it only starts after specified duration and then runs till the end of animation.

Modify the animation by applying the effect. If desired, you can apply multiple effects to single animation by calling this function multiple times.

Build an effect from an image-modifying function. This effect does not change as time passes.

Change image opacity from 0 to 1.

Change image opacity from 1 to 0. Reverse of fadeInE.

Change stroke width from 0 to given value.

Change stroke width from given value to 0. Reverse of fadeLineInE.

Effect of progressively drawing the image. Note that this will only affect primitive shapes (see pathify).

Reverse of drawInE.

Change fill opacity from 0 to 1.

Change scale from 1 to given value.

Move the image from its current position to the target x y coordinates.

Transform the effect so that the image passed to the effect's image-modifying function has coordinates (0, 0) shifted to the center of its bounding box. Also see aroundCenter.

Load an external image. Width and height must be specified, ignoring the image's aspect ratio. The center of the image is placed at position (0,0).

For security reasons, must SVG renderer do not allow arbitrary image links. For some renderers, we can get around this by placing the images in the same root directory as the parent SVG file. Other renderers (like Chrome and ffmpeg) requires that the image is inlined as base64 data. External SVG files are an exception, though, as must always be inlined directly. mkImage attempts to hide all the complexity but edge-cases may exist.

Example:

mkImage screenWidth screenHeight "../data/haskell.svg"

Embed an in-memory PNG image. Note, the pixel size of the image is used as the dimensions. As such, embedding a 100x100 PNG will result in an image 100 units wide and 100 units high. Consider using with scaleToSize.

Embed an in-memory image. Note, the pixel size of the image is used as the dimensions. As such, embedding a 100x100 image will result in an image 100 units wide and 100 units high. Consider using with scaleToSize.

Embed in-memory PNG bytestring without parsing it.

Convert an SVG object to a pixel-based image. The default resolution is 2560x1440. See also rasterSized. Multiple raster engines are supported and are selected using the '--raster' flag in the driver.

Convert an SVG object to a pixel-based image.

Convert an SVG object to a pixel-based image and save it to disk, returning the filepath. The default resolution is 2560x1440. See also svgAsPngFile'. Multiple raster engines are supported and are selected using the '--raster' flag in the driver.

Convert an SVG object to a pixel-based image and save it to disk, returning the filepath.

Use 'potrace' to trace edges in a raster image and convert them to SVG polygons.

Same as vectorize but takes a list of arguments for 'potrace'.

Invoke latex and import the result as an SVG object. SVG objects are cached to improve performance.

Example:

latex "$e^{i\\pi}+1=0$"

Invoke latex and import the result as an SVG object. SVG objects are cached to improve performance. This wraps the TeX code in an 'align*' context.

Example:

latexAlign "R = \\frac{{\\Delta x}}{{kA}}"

Invoke xelatex and import the result as an SVG object. SVG objects are cached to improve performance. Xelatex has support for non-western scripts.

Invoke xelatex with "usepackage[UTF8]{ctex}" and import the result as an SVG object. SVG objects are cached to improve performance. Xelatex has support for non-western scripts.

Example:

ctex "中文"

Run the povray raytracer with a default resolution of 320x180 and antialiasing enabled. The resulting image is scaled to fit the screen exactly.

Run the povray raytracer with a default resolution of 320x180 and antialiasing enabled. The FilePath points to a PNG file containing the resulting image.

Run a Blender script and embed the resulting image file. The image will be scaled to fit the screen exactly (assuming a default canvas layout). Note that Blender resolution defaults to 1920x1080 but can be changed in the script code.

Generate Blender image as a separate PNG file. Can be embedded with mkImage.

Given a number t in the range [0,1], returns the corresponding color from the “turbo” color scheme by Anton Mikhailov.

Given a number t in the range [0,1], returns the corresponding color from the “viridis” perceptually-uniform color scheme designed by van der Walt, Smith and Firing for matplotlib, represented as an RGB string.

Given a number t in the range [0,1], returns the corresponding color from the “magma” perceptually-uniform color scheme designed by van der Walt and Smith for matplotlib, represented as an RGB string.

Given a number t in the range [0,1], returns the corresponding color from the “inferno” perceptually-uniform color scheme designed by van der Walt and Smith for matplotlib, represented as an RGB string.

Given a number t in the range [0,1], returns the corresponding color from the “plasma” perceptually-uniform color scheme designed by van der Walt and Smith for matplotlib, represented as an RGB string.

Given a number t in the range [0,1], returns the corresponding color from the “sinebow” color scheme by Jim Bumgardner and Charlie Loyd.

Parula is the default colormap for matlab.

Given a number t in the range [0,1], returns the corresponding color from the “cividis” color vision deficiency-optimized color scheme designed by Nuñez, Anderton, and Renslow, represented as an RGB string.

Jet colormap. Used to be the default in matlab. Obsolete.

hsv colormap. Goes from 0 degrees to 360 degrees.

Matlab hsv colormap. Goes from 0 degrees to 330 degrees.

Greyscale colormap.

Number of units from the left-most point to the right-most point on the screen.

Number of units from the bottom to the top of the screen.

Position of the top of the screen.

Position of the bottom of the screen.

Position of the left side of the screen.

Position of the right side of the screen.

SVG allows measurements in inches which have to be converted to local units. This value describes how many local units there are in an inch.

Default thickness of lines.

Selected framerate.

Height of animation in pixel.

Width of animation in pixel.