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 fixed strokewidth for the shape. It can contain a numeric value or the keyword “inherit”, which means that the strokeWidth from the cell’s style will be used and muliplied with the shape’s scale. If numeric values are used, those are multiplied with the minimum scale used to render the stencil inside the shape’s bounds.
| mxStencil | Implements a generic shape which is based on a XML node as a description. |
| Functions | |
| mxStencilShape | Constructs a new generic shape by setting desc to the given XML node and invoking parseDescription and parseConstraints. |
| Variables | |
| desc | Holds the XML node with the stencil description. |
| constraints | Holds an array of mxConnectionConstraints as defined in the shape. |
| aspect | Holds the aspect of the shape. |
| w0 | Holds the width of the shape. |
| h0 | Holds the height of the shape. |
| bgNodes | Holds the XML node with the stencil description. |
| fgNodes | Holds the XML node with the stencil description. |
| strokewidth | Holds the strokewidth direction from the description. |
| Functions | |
| parseDescription | Reads w0, h0, aspect, bgNodes and fgNodes from desc. |
| parseConstraints | Reads the constraints from desc into constraints using parseConstraint. |
| parseConstraint | Parses the given XML node and returns its mxConnectionConstraint. |
| evaluateAttribute | Gets the attribute for the given name from the given node. |
| renderDom | Updates the SVG or VML shape. |
| drawShape | Draws this stencil inside the given bounds. |
| computeAspect | Returns a rectangle that contains the offset in x and y and the horizontal and vertical scale in width and height used to draw this shape inside the given mxRectangle. |
| drawNode | Draws this stencil inside the given bounds. |
Constructs a new generic shape by setting desc to the given XML node and invoking parseDescription and parseConstraints.
| desc | XML node that contains the stencil description. |
mxStencil.prototype.constraints
Holds an array of mxConnectionConstraints as defined in the shape.
mxStencil.prototype.parseConstraints = function()
Reads the constraints from desc into constraints using parseConstraint.
mxStencil.prototype.parseConstraint = function( node )
Parses the given XML node and returns its mxConnectionConstraint.
mxStencil.prototype.evaluateAttribute = function( node, attribute, state )
Gets the attribute for the given name from the given node. If the attribute does not exist then the text content of the node is evaluated and if it is a function it is invoked with <state> as the only argument and the return value is used as the attribute value to be returned.
mxStencil.prototype.computeAspect = function( state, bounds, direction )
Returns a rectangle that contains the offset in x and y and the horizontal and vertical scale in width and height used to draw this shape inside the given mxRectangle.
| state | mxCellState for which the shape should be drawn. |
| bounds | mxRectangle that should contain the stencil. |
| direction | Optional direction of the shape to be darwn. |
Holds the XML node with the stencil description.
mxStencil.prototype.desc
Reads w0, h0, aspect, bgNodes and fgNodes from desc.
mxStencil.prototype.parseDescription = function()
Reads the constraints from desc into constraints using parseConstraint.
mxStencil.prototype.parseConstraints = function()
Holds an array of mxConnectionConstraints as defined in the shape.
mxStencil.prototype.constraints
Holds the aspect of the shape.
mxStencil.prototype.aspect
Holds the width of the shape.
mxStencil.prototype.w0
Holds the height of the shape.
mxStencil.prototype.h0
Holds the strokewidth direction from the description.
mxStencil.prototype.strokewidth
Parses the given XML node and returns its mxConnectionConstraint.
mxStencil.prototype.parseConstraint = function( node )
Gets the attribute for the given name from the given node.
mxStencil.prototype.evaluateAttribute = function( node, attribute, state )
Updates the SVG or VML shape.
mxStencil.prototype.renderDom = function( shape, bounds, parentNode, state )
Draws this stencil inside the given bounds.
mxStencil.prototype.drawShape = function( canvas, state, bounds, background )
Returns a rectangle that contains the offset in x and y and the horizontal and vertical scale in width and height used to draw this shape inside the given mxRectangle.
mxStencil.prototype.computeAspect = function( state, bounds, direction )
Draws this stencil inside the given bounds.
mxStencil.prototype.drawNode = function( canvas, state, node, aspect )