<divid=Content><divclass="CClass"><divclass=CTopicid=MainTopic><h1class=CTitle><aname="mxStencil"></a>mxStencil</h1><divclass=CBody><p>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.</p><p>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.</p><p>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).</p><p>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.</p><p>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.</p><p>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.</p><p>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.</p><p>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.</p><p>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.</p><p>To support i18n in the text element, use the localized attribute of 1 to use the str as a key in <ahref="../util/mxResources-js.html#mxResources.get"class=LFunctionid=link32onMouseOver="ShowTip(event, 'tt21', 'link32')"onMouseOut="HideTip('tt21')">mxResources.get</a>. To handle all str attributes of all text nodes like this, set the <ahref="#mxStencil.defaultLocalized"class=LVariableid=link33onMouseOver="ShowTip(event, 'tt5', 'link33')"onMouseOut="HideTip('tt5')">mxStencil.defaultLocalized</a> value to true.</p><!--START_ND_SUMMARY--><divclass=Summary><divclass=STitle>Summary</div><divclass=SBorder><tableborder=0cellspacing=0cellpadd
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxStencil.mxStencil"></a>mxStencil</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass=PBeforeParametersnowrap>function mxStencil(</td><tdclass=PParameternowrap>desc</td><tdclass=PAfterParametersnowrap>)</td></tr></table></td></tr></table></blockquote><p>Constructs a new generic shape by setting <ahref="#mxStencil.desc"class=LVariableid=link34onMouseOver="ShowTip(event, 'tt2', 'link34')"onMouseOut="HideTip('tt2')">desc</a> to the given XML node and invoking <ahref="#mxStencil.parseDescription"class=LFunctionid=link35onMouseOver="ShowTip(event, 'tt3', 'link35')"onMouseOut="HideTip('tt3')">parseDescription</a> and <ahref="#mxStencil.parseConstraints"class=LFunctionid=link36onMouseOver="ShowTip(event, 'tt4', 'link36')"onMouseOut="HideTip('tt4')">parseConstraints</a>.</p><h4class=CHeading>Parameters</h4><tableborder=0cellspacing=0cellpadding=0class=CDescriptionList><tr><tdclass=CDLEntry>desc</td><tdclass=CDLDescription>XML node that contains the stencil description.</td></tr></table></div></div></div>
<divclass="CVariable"><divclass=CTopic><h3class=CTitle><aname="mxStencil.defaultLocalized"></a>defaultLocalized</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.defaultLocalized</td></tr></table></blockquote><p>Static global variable that specifies the default value for the localized attribute of the text element. Default is false.</p></div></div></div>
<divclass="CVariable"><divclass=CTopic><h3class=CTitle><aname="mxStencil.desc"></a>desc</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.desc</td></tr></table></blockquote><p>Holds the XML node with the stencil description.</p></div></div></div>
<divclass="CVariable"><divclass=CTopic><h3class=CTitle><aname="mxStencil.constraints"></a>constraints</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.constraints</td></tr></table></blockquote><p>Holds an array of <ahref="../view/mxConnectionConstraint-js.html#mxConnectionConstraint"class=LClassid=link37onMouseOver="ShowTip(event, 'tt7', 'link37')"onMouseOut="HideTip('tt7')">mxConnectionConstraints</a> as defined in the shape.</p></div></div></div>
<divclass="CVariable"><divclass=CTopic><h3class=CTitle><aname="mxStencil.aspect"></a>aspect</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.aspect</td></tr></table></blockquote><p>Holds the aspect of the shape. Default is ‘auto’.</p></div></div></div>
<divclass="CVariable"><divclass=CTopic><h3class=CTitle><aname="mxStencil.w0"></a>w0</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.w0</td></tr></table></blockquote><p>Holds the width of the shape. Default is 100.</p></div></div></div>
<divclass="CVariable"><divclass=CTopic><h3class=CTitle><aname="mxStencil.h0"></a>h0</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.h0</td></tr></table></blockquote><p>Holds the height of the shape. Default is 100.</p></div></div></div>
<divclass="CVariable"><divclass=CTopic><h3class=CTitle><aname="mxStencil.bgNodes"></a>bgNodes</h3><divclass=CBody><p>Holds the XML node with the stencil description.</p></div></div></div>
<divclass="CVariable"><divclass=CTopic><h3class=CTitle><aname="mxStencil.fgNodes"></a>fgNodes</h3><divclass=CBody><p>Holds the XML node with the stencil description.</p></div></div></div>
<divclass="CVariable"><divclass=CTopic><h3class=CTitle><aname="mxStencil.strokewidth"></a>strokewidth</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.strokewidth</td></tr></table></blockquote><p>Holds the strokewidth direction from the description.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxStencil.parseConstraints"></a>parseConstraints</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.parseConstraints = function()</td></tr></table></blockquote><p>Reads the constraints from <ahref="#mxStencil.desc"class=LVariableid=link44onMouseOver="ShowTip(event, 'tt2', 'link44')"onMouseOut="HideTip('tt2')">desc</a> into <ahref="#mxStencil.constraints"class=LVariableid=link45onMouseOver="ShowTip(event, 'tt6', 'link45')"onMouseOut="HideTip('tt6')">constraints</a> using <ahref="#mxStencil.parseConstraint"class=LFunctionid=link46onMouseOver="ShowTip(event, 'tt14', 'link46')"onMouseOut="HideTip('tt14')">parseConstraint</a>.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxStencil.parseConstraint"></a>parseConstraint</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass=PBeforeParametersnowrap>mxStencil.prototype.parseConstraint = function(</td><tdclass=PParameternowrap>node</td><tdclass=PAfterParametersnowrap>)</td></tr></table></td></tr></table></blockquote><p>Parses the given XML node and returns its <ahref="../view/mxConnectionConstraint-js.html#mxConnectionConstraint"class=LClassid=link47onMouseOver="ShowTip(event, 'tt7', 'link47')"onMouseOut="HideTip('tt7')">mxConnectionConstraint</a>.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxStencil.evaluateTextAttribute"></a>evaluateTextAttribute</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass=PBeforeParametersnowrap>mxStencil.prototype.evaluateTextAttribute = function(</td><tdclass=PParameternowrap>node,</td></tr><tr><td></td><tdclass=PParameternowrap>attribute,</td></tr><tr><td></td><tdclass=PParameternowrap>state</td><tdclass=PAfterParametersnowrap>)</td></tr></table></td></tr></table></blockquote><p>Gets the given attribute as a text. The return value from <ahref="#mxStencil.evaluateAttribute"class=LFunctionid=link48onMouseOver="ShowTip(event, 'tt16', 'link48')"onMouseOut="HideTip('tt16')">evaluateAttribute</a> is used as a key to <ahref="../util/mxResources-js.html#mxResources.get"class=LFunctionid=link49onMouseOver="ShowTip(event, 'tt21', 'link49')"onMouseOut="HideTip('tt21')">mxResources.get</a> if the localized attribute in the text node is 1 or if <ahref="#mxStencil.defaultLocalized"class=LVariableid=link50onMouseOver="ShowTip(event, 'tt5', 'link50')"onMouseOut="HideTip('tt5')">defaultLocalized</a> is true.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxStencil.evaluateAttribute"></a>evaluateAttribute</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass=PBeforeParametersnowrap>mxStencil.prototype.evaluateAttribute = function(</td><tdclass=PParameternowrap>node,</td></tr><tr><td></td><tdclass=PParameternowrap>attribute,</td></tr><tr><td></td><tdclass=PParameternowrap>shape</td><tdclass=PAfterParametersnowrap>)</td></tr></table></td></tr></table></blockquote><p>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.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxStencil.drawShape"></a>drawShape</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass=PBeforeParametersnowrap>mxStencil.prototype.drawShape = function(</td><tdclass=PParameternowrap>canvas,</td></tr><tr><td></td><tdclass=PParameternowrap>shape,</td></tr><tr><td></td><tdclass=PParameternowrap>x,</td></tr><tr><td></td><tdclass=PParameternowrap>y,</td></tr><tr><td></td><tdclass=PParameternowrap>w,</td></tr><tr><td></td><tdclass=PParameternowrap>h</td><tdclass=PAfterParametersnowrap>)</td></tr></table></td></tr></table></blockquote><p>Draws this stencil inside the given bounds.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxStencil.drawShape"></a>drawShape</h3><divclass=CBody><p>Draws this stencil inside the given bounds.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxStencil.computeAspect"></a>computeAspect</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass=PBeforeParametersnowrap>mxStencil.prototype.computeAspect = function(</td><tdclass=PParameternowrap>shape,</td></tr><tr><td></td><tdclass=PParameternowrap>x,</td></tr><tr><td></td><tdclass=PParameternowrap>y,</td></tr><tr><td></td><tdclass=PParameternowrap>w,</td></tr><tr><td></td><tdclass=PParameternowrap>h,</td></tr><tr><td></td><tdclass=PParameternowrap>direction</td><tdclass=PAfterParametersnowrap>)</td></tr></table></td></tr></table></blockquote><p>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 <ahref="../util/mxRectangle-js.html#mxRectangle"class=LClassid=link51onMouseOver="ShowTip(event, 'tt19', 'link51')"onMouseOut="HideTip('tt19')">mxRectangle</a>.</p><h4class=CHeading>Parameters</h4><tableborder=0cellspacing=0cellpadding=0class=CDescriptionList><tr><tdclass=CDLEntry>shape</td><tdclass=CDLDescription><ahref="mxShape-js.html#mxShape"class=LClassid=link52onMouseOver="ShowTip(event, 'tt22', 'link52')"onMouseOut="HideTip('tt22')">mxShape</a> to be drawn.</td></tr><tr><tdclass=CDLEntry>bounds</td><tdclass=CDLDescription><ahref="../util/mxRectangle-js.html#mxRectangle"class=LClassid=link53onMouseOver="ShowTip(event, 'tt19', 'link53')"onMouseOut="HideTip('tt19')">mxRectangle</a> that should contain the stencil.</td></tr><tr><tdclass=CDLEntry>direction</td><tdclass=CDLDescription>Optional direction of the shape to be darwn.</td></tr></table></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxStencil.drawNode"></a>drawNode</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass=PBeforeParametersnowrap>mxStencil.prototype.drawNode = function(</td><tdclass=PParameternowrap>canvas,</td></tr><tr><td></td><tdclass=PParameternowrap>shape,</td></tr><tr><td></td><tdclass=PParameternowrap>node,</td></tr><tr><td></td><tdclass=PParameternowrap>aspect,</td></tr><tr><td></td><tdclass=PParameternowrap>disableShadow</td><tdclass=PAfterParametersnowrap>)</td></tr></table></td></tr></table></blockquote><p>Draws this stencil inside the given bounds.</p></div></div></div>
<divclass=CToolTipid="tt1"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass=PBeforeParametersnowrap>function mxStencil(</td><tdclass=PParameternowrap>desc</td><tdclass=PAfterParametersnowrap>)</td></tr></table></td></tr></table></blockquote>Constructs a new generic shape by setting desc to the given XML node and invoking parseDescription and parseConstraints.</div></div><divclass=CToolTipid="tt2"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.desc</td></tr></table></blockquote>Holds the XML node with the stencil description.</div></div><divclass=CToolTipid="tt3"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.parseDescription = function()</td></tr></table></blockquote>Reads w0, h0, aspect, bgNodes and fgNodes from desc.</div></div><divclass=CToolTipid="tt4"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.parseConstraints = function()</td></tr></table></blockquote>Reads the constraints from desc into constraints using parseConstraint.</div></div><divclass=CToolTipid="tt5"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.defaultLocalized</td></tr></table></blockquote>Static global variable that specifies the default value for the localized attribute of the text element. </div></div><divclass=CToolTipid="tt6"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.constraints</td></tr></table></blockquote>Holds an array of mxConnectionConstraints as defined in the shape.</div></div><divclass=CToolTipid="tt7"><divclass=CClass>Defines an object that contains the constraints about how to connect one side of an edge to its terminal.</div></div><divclass=CToolTipid="tt8"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.aspect</td></tr></table></blockquote>Holds the aspect of the shape. </div></div><divclass=CToolTipid="tt9"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.w0</td></tr></table></blockquote>Holds the width of the shape. </div></div><divclass=CToolTipid="tt10"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.h0</td></tr></table></blockquote>Holds the height of the shape. </div></div><divclass=CToolTipid="tt11"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td>mxStencil.prototype.strokewidth</td></tr></table></blockquote>Holds the strokewidth direction from the description.</div></div><divclass=CToolTipid="tt12"><divclass=CVariable>Holds the XML node with the stencil description.</div></div><divclass=CToolTipid="tt13"><divclass=CVariable>Holds the XML node with the stencil description.</div></div><divclass=CToolTipid="tt14"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass=PBeforeParametersnowrap>mxStencil.prototype.parseConstraint = function(</td><tdclass=PParameternowrap>node</td><tdclass=PAfterParametersnowrap>)</td></tr></table></td></tr></table></blockquote>Parses the given XML node and returns its mxConnectionConstraint.</div></div><divclass=CToolTipid="tt15"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass=PBeforeParametersnowrap>mxStencil.prototype.evaluateTextAttribute = fun
