Custom Pens

In addition to standard pens you can define you own. To define a pen use method addCustomPen(name,pen_def),
where name - name of your pen, pen_def - pen definition object.
Two types of pen definitions Shape Pen and Compound Pen are described below.

Before using your a pen on the Pen Panel create an icon and assing it using the method setIcons(),
for example:

    painter.setIcon({ 'rohmb' : 'rhomb.gif' });

Shape Pen

Shape pen puts specified shapes along drawn curve.

  painter.addCustomPen('rhomb', {
     type   : 'shape',
     path   : 'M -4 0 L 0 -4 L 4 0 L 0 4 Z',
     advance: 20,
     width  : 8
  });

name - defines the pen name wich can be used for the pen panel or custom tools.

pen_def is an object defining the pen parameters:

type - type of pen definition (must be 'shape')

path - path describing the shape (see below)

advance - distance between the shapes along the curve

width - pen width (maximum width of the shape in all possible direction - 360 around)

Path definition

Path definition describes the shape using a series commands.
The following commands can be used:

M x y - move pointer to

L x y - line to

Q x1 y1 x2 y2 - quadratic bezier segment

C x1 y1 x2 y2 x3 y3 - cubic bezier segment

Z - close the path

Compound Pen

Compound Pen is summ or difference of two pens, usually a standard pen and a shape pen.

  painter.addCustomPen( 'solid_with_rhomb_holes', {
     type      : 'compound',
     pen1   : { width:8 }, //solid pen
     pen2   : {
          type   : 'shape',
          path   : 'M -4 0 L 0 -4 L 4 0 L 0 4 Z',
          advance: 20
     },
     operation : 'sub', //subtract pen2 from pen1
     width     : 8
  });

Compound pen fields:

type - must be 'compound'

pen1 - the 1st pen in the compound

pen2 - the 2nd pen in the compound

operation - 'add' or 'sub'

width - effective pen width (in any direction - maximum)