The shape-rendering attribute provides hints to the renderer about what tradeoffs to make when rendering shapes like paths, circles, or rectangles.

The paint-order attribute specifies the order that the fill, stroke, and markers of a given shape or text element are painted.

The rotate attribute specifies how the animated element rotates as it travels along a path specified in an <animateMotion> element.

When talking about text in SVG, we have to differentiate between two almost completely separate topics. One is the inclusion and display of text in an image, and the other is SVG fonts. The latter is described in a later section of the tutorial, while this page will focus on the first part: bringing text into an SVG image.

This guide gives you all you need to get started with JavaScript module syntax.

Patterns are arguably one of the more confusing fill types to use in SVG. They're also very powerful, so they're worth talking about and getting at least a fundamental grasp on. Like gradients, the <pattern> element should be put in the <defs> section of your SVG file.

The Uint8ClampedArray typed array represents an array of 8-bit unsigned integers clamped to 0–255. The contents are initialized to 0. Once established, you can reference elements in the array using the object's methods, or using standard array index syntax (that is, using bracket notation).

Let us dive straight in with a simple example. Take a look at the following code.

An Iterator object is an object that conforms to the iterator protocol by providing a next() method that returns an iterator result object. All built-in iterators inherit from the Iterator class. The Iterator class provides a @@iterator method that returns the iterator object itself, making the iterator also iterable. It also provides some helper methods for working with iterators.

The Function object provides methods for functions. In JavaScript, every function is actually a Function object.