drawsvg iconDRAWSVG user's guide
PreviousNextContentsPDFdrawsvg home

8.4. Pattern dialog panel

The ‘ pattern ’ element defines the graphic that is to be used to fill a shape by replicating an object.

It performs two key functions: hatching and wallpaper.

These function uses two different units ( userSpaceOnUse , objectBoundingBox ).

A pattern is defined either in the coordinate system of the drawing (userSpaceOnUse) or in proportion to the bounding box of the object to fill (objectBoundingBox).

A pattern may be defined by extension of another. The most frequent case is the definition of a pattern by applying a transformation to another basic pattern.

The pattern dialog panel is launched from it's icon Image gradient-cutomize.png in the fill menu and is displayed in grab mode.

See creating , using patterns showcases for interactive demonstrations.

Figure 8.5. Patterns tool

Patterns tool

The panel allows to edit/copy/extends/delete a pattern definition,

To add a new one, drawn it's elements, select them and use the action pattern definition from the selection menu.

Select a pattern in the list, then change attributes :

To change the colors of an element inside a pattern, click on the element inside the viewBox or select it from the list and click on the render rectangle of the color to change it with the color chooser or remove it with the check-box.

Defining a pattern by transformation of another. Select the basic pattern and click on the extension icon. Set it's id and apply the desired transformation.

Finally the Sample box show the renderer of the selected pattern with the scale of the drawing.

All changes are applied with the apply button and the current pattern is applied to the style property (stroke or fill) of the selected object.

To directly apply a gradient, use the selection tool Image svg143.svg .

Figure 8.6. Pattern chooser

Pattern chooser

The selected pattern is drawn with the current scale of the drawing.