Skip to main content

Animated Scalable Vector Graphics

Project description

Animated Scalable Vector Graphics (SVG)

This library provides an easy way to make animations using the scalable vector graphics (SVG) format. SVG is a web-standard format and can be opened by all modern web browsers. An SVG can often be placed wherever any other image type can be placed. Even many email clients can view SVG animations. This format provides an easy way for others to view an animation without requiring any additional software installation.

Shapes

First, create your shapes with the shape class. A shape object can be initialized with the following parameters:

  • x : float or array, default 0.0 x values of the shape or the x-axis radius of an ellipse.
  • y : float or array, default 0.0 y values of the shape or the y-axis radius of an ellipse.
  • stroke : float or array, default 1.0 Stroke width or animated widths.
  • color : float or array, default 0x000000 Stroke or fill color or animated colors. It is a fill color or colors if stroke is a scalar zero.
  • alpha : float or array, default 1.0 Opacity or animated opacity values. A 0.0 means fully transparent and a 1.0 means fully opaque.
  • dur : float, default 1.0 Animation duration in seconds.

Here is an example:

theta = [2*m.pi*n/(100 - 1) for n in range(100)]
stroke = [0.5 + 0.3*m.sin(2*t) for t in theta]
color = [(cl(t) << 16) +
        (cl(t - 120*m.pi/180) << 8) +
        (cl(t + 120*m.pi/180)) for t in theta]
alpha = [0.6 + 0.4*m.cos(6*t) for t in theta]
tri = avg.shape([-1.0, 1.0, 0.0, -1.0], [-0.866, -0.866, 0.866, -0.866],
        stroke=stroke, color=color, alpha=alpha, dur=10)

In this example, the stroke, color, and alpha have all been made to change over the period of 10 seconds. The cl( ) is just a custom triangle function.

Frames

Second, place shapes or other frames into frames. The frame class provides the following initialization parameters:

  • objs : shape or frame or list of such A single shape or frame object or a list of such objects.
  • x : float or array_like, default 0.0 x-axis values of translation of the objects within the frame.
  • y : float or array_like, default 0.0 y-axis values of translation of the objects within the frame.
  • ang : float or array_like, default 0.0 Angles of rotation of the objects within the frame in degrees.
  • scale : float or array_like, default 1.0 Scaling factors of the objects within the frame.
  • dur : float, default 1.0 Animation duration in seconds.

Here is an example:

x = [2*m.sin(3*t) for t in theta]
y = [-m.cos(3*t) for t in theta]
ang = [-3*t*180/m.pi for t in theta]
scale = [1 + 0.5*m.sin(2*t) for t in theta]
frm = avg.frame(tri, x, y, ang, scale, dur=10)

So, the tri shape will move to the postions (x, y), rotate to the angles ang, and scale by scale. You can put multiple shapes and frames into another frame. Suppose a and b are shapes and C, D, and E are frames. These can be put into another frame as follows:

frm = avg.frame([a, b, C, D, E], x, y, dur=10)

Animate

When you have finished defining all your shapes and frames, you can create the animation file using the animate function. This function takes the following paramters:

  • obj : shape object, frame object, or list of such objects The data to create an animation.
  • filename : string, default 'ani.svg' The desired name of output file. End it with '.svg' in order for your system to know which application to use to open it.
  • x_lim : array, default [-1, 1] A list of the minimum and maximum x values to display in the animation.
  • y_lim : array, default [-1, 1] A list of the minimum and maximum y values to display in the animation.
  • width : float, default 640 Desired width of the animation image in pixels. This is also used in determining the scaling factor for the dimensions of the image. If not specified, the image will actually automatically scale to fit the size of the browser window.
  • progress : bool, default False Flag to show progress bar.

Here is an example:

avg.animate(frm, x_lim=[-3, 3], y_lim=[-3, 3])

Note that not specifying the width will make the image scale to the size of its container, like the browser window. However, it also means that parts of the animation can sometimes be viewable outside the limits specified.

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

avg-1.0.2.tar.gz (12.0 kB view details)

Uploaded Source

Built Distribution

avg-1.0.2-py3-none-any.whl (11.2 kB view details)

Uploaded Python 3

File details

Details for the file avg-1.0.2.tar.gz.

File metadata

  • Download URL: avg-1.0.2.tar.gz
  • Upload date:
  • Size: 12.0 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/5.1.1 CPython/3.12.7

File hashes

Hashes for avg-1.0.2.tar.gz
Algorithm Hash digest
SHA256 5c9788219e4ab85dca6359c8db0f97b4ad0d84b2fd09bd681b93f7e8ccc4f3b1
MD5 b143250a15e8699672808ce79f05b265
BLAKE2b-256 629c38975f6ef7947bca266ee5467824d6fd1222b3520fff59ad556109097eb4

See more details on using hashes here.

File details

Details for the file avg-1.0.2-py3-none-any.whl.

File metadata

  • Download URL: avg-1.0.2-py3-none-any.whl
  • Upload date:
  • Size: 11.2 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/5.1.1 CPython/3.12.7

File hashes

Hashes for avg-1.0.2-py3-none-any.whl
Algorithm Hash digest
SHA256 ffe595d7c06cf2c1b86178ed305e378bbe4a4b9face9f031f8cd9026446c7565
MD5 1f5a84e4db6ea3cf3aa24a7c829c2962
BLAKE2b-256 665fbe12c73fd569859c2d05cab247ebc22be92c545d154eb048abb74533f28c

See more details on using hashes here.

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page