The SVG xml data is capable of any type of drawing, from simple lines and shapes to complex shading, colouring and transformations.

Currently only a small set of the possibilities are implemented.

Lines can be draw, they map directly to PDF data. ex-lines The example above shows some lines.

The rectangle is a simple shape, which maps directly to PDF data. ex-rect The example above is a simple rectangle, circle and ellipse.

The circle and ellipse are drawn by creating four curves that make up the shape.

All shapes can have style applied to them. Style can also be inherited from a surrounding <svg:g> element.

ex-paths Paths have no effect by themselves unless there is some style applied. The default styling is set by the svg area.

There are many possible parts to a path. There are simple moveto, lineto and closepath commands. There are also a number of curve commands that create Bezier curves etc.

ex-poly Polylines and Polygons are multi-point lines made up of straight lines. A polygon has a close path at the end. Note how the numbers in the points property can be over a number of lines to make it easier to read.

The only difference between the polyline and the polygon is that a polygon has a close path at the end.

ex-style Most elements can have style. The style information is a list of properties separated by a ';'. The property name and value are separated by a ':'. Notice how the style of the sub-element overrides that of all the ones in the heirarchy, the element also inherits all the other style data.

ex-g The G element can contain any other graphic element, including other G elements. The purpose of this is to enable style and transform to apply to a group of graphic elements. The elements have no other relationship except they are drawn together.

The transform of an element can do all the usual mathematical transforms. These can be represented by a matrix for use in the pdf. The options include translate, scale, rotate, shear etc.

The transform of an element is accumulative from its ancestors. That is, if a transform is applied to a <svg:g> element then any graphic element also has that transform applied to it. If the child element has a transform then its transform is also applied after the transform of the parent.

ex-transform

ex-text Text can be placed in any position and with style.

Not yet implemented. The SVG area is clipped to start with.

ex-textpath The above example shows the <svg:use> and textPath elements in action.

ex-image The above example shows the <svg:image> with position and sizing elements in action.

ex-misc Doing some silly stuff with svg elements.