mxStencil

Implements a generic shape which is based on a XML node as a description.  The node contains a background and a foreground node, which contain the definition to render the respective part of the shape.  Note that the fill, stroke or fillstroke of the background is be the first statement of the foreground.  This is because the content of the background node maybe used to not only render the shape itself, but also its shadow and other elements which do not require a fill, stroke or fillstroke.

The shape uses a coordinate system with a width of 100 and a height of 100 by default.  This can be changed by setting the w and h attribute of the shape element.  The aspect attribute can be set to “variable” (default) or “fixed”.  If fixed is used, then the aspect which is defined via the w and h attribute is kept constant while the shape is scaled.

The possible contents of the background and foreground elements are rect, ellipse, roundrect, text, image, include-shape or paths.  A path element contains move, line, curve, quad, arc and close elements.  The rect, ellipse and roundrect elements may be thought of as special path elements.  All these path elements must be followed by either fill, stroke or fillstroke (note that text, image and include-shape or not path elements).

The background element can be empty or contain at most one path element.  It should not contain a text, image or include-shape element.  If the background element is empty, then no shadow or glass effect will be rendered.  If the background element is non-empty, then the corresponding fill, stroke or fillstroke should be the first element in the subsequent foreground element.

The format of the XML is “a simplified HTML 5 Canvas”.  Each command changes the “current” state, so eg. a linecap, linejoin will be used for all subsequent line drawing, unless a save/restore appears, which saves/restores a state in a stack.

The connections section contains the fixed connection points for a stencil.  The perimeter attribute of the constraint element should have a value of 0 or 1 (default), where 1 (true) specifies that the given point should be projected into the perimeter of the given shape.

The x- and y-coordinates are typically between 0 and 1 and define the location of the connection point relative to the width and height of the shape.

The dashpattern directive sets the current dashpattern.  The format for the pattern attribute is a space-separated sequence of numbers, eg.  5 5 5 5, that specifies the lengths of alternating dashes and spaces in dashed lines.  The dashpattern should be used together with the dashed directive to enabled/disable the dashpattern.  The default dashpattern is 3 3.

The strokewidth attribute defines a strokewidth behaviour for the shape.  It can contain a numeric value or the keyword “inherit”, which means that the strokeWidth of the cell is only changed on scaling, not on resizing.  If numeric values are used, the strokeWidth of the cell is changed on both scaling and resizing and the value defines the multiple that is applied to the width.

To support i18n in the text element, use the localized attribute of 1 to use the str as a key in mxResources.get.  To handle all str attributes of all text nodes like this, set the mxStencil.defaultLocalized value to true.