<divid=Content><divclass="CClass"><divclass=CTopicid=MainTopic><h1class=CTitle><aname="mxPerimeter"></a>mxPerimeter</h1><divclass=CBody><p>Provides various perimeter functions to be used in a style as the value of <ahref="../util/mxConstants-js.html#mxConstants.STYLE_PERIMETER"class=LVariableid=link7onMouseOver="ShowTip(event, 'tt1', 'link7')"onMouseOut="HideTip('tt1')">mxConstants.STYLE_PERIMETER</a>. Perimeters for rectangle, circle, rhombus and triangle are available.</p><h4class=CHeading>Example</h4><blockquote><preclass="prettyprint"><add as="perimeter">mxPerimeter.RectanglePerimeter</add></pre></blockquote><h4class=CHeading>Or programmatically</h4><blockquote><preclass="prettyprint">style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;</pre></blockquote><p>When adding new perimeter functions, it is recommended to use the mxPerimeter-namespace as follows:</p><blockquote><preclass="prettyprint">mxPerimeter.CustomPerimeter = function (bounds, vertex, next, orthogonal)
}</pre></blockquote><h4class=CHeading>The new perimeter should then be registered in the <ahref="mxStyleRegistry-js.html#mxStyleRegistry"class=LClassid=link8onMouseOver="ShowTip(event, 'tt7', 'link8')"onMouseOut="HideTip('tt7')">mxStyleRegistry</a> as follows</h4><blockquote><preclass="prettyprint">mxStyleRegistry.putValue('customPerimeter', mxPerimeter.CustomPerimeter);</pre></blockquote><h4class=CHeading>The custom perimeter above can now be used in a specific vertex as follows</h4><blockquote><preclass="prettyprint">model.setStyle(vertex, 'perimeter=customPerimeter');</pre></blockquote><p>Note that the key of the <ahref="mxStyleRegistry-js.html#mxStyleRegistry"class=LClassid=link9onMouseOver="ShowTip(event, 'tt7', 'link9')"onMouseOut="HideTip('tt7')">mxStyleRegistry</a> entry for the function should be used in string values, unless <ahref="mxGraphView-js.html#mxGraphView.allowEval"class=LVariableid=link10onMouseOver="ShowTip(event, 'tt8', 'link10')"onMouseOut="HideTip('tt8')">mxGraphView.allowEval</a> is true, in which case you can also use mxPerimeter.CustomPerimeter for the value in the cell style above.</p><h4class=CHeading>Or it can be used for all vertices in the graph as follows</h4><blockquote><preclass="prettyprint">var style = graph.getStylesheet().getDefaultVertexStyle();
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.CustomPerimeter;</pre></blockquote><p>Note that the object can be used directly when programmatically setting the value, but the key in the <ahref="mxStyleRegistry-js.html#mxStyleRegistry"class=LClassid=link11onMouseOver="ShowTip(event, 'tt7', 'link11')"onMouseOut="HideTip('tt7')">mxStyleRegistry</a> should be used when setting the value via a key, value pair in a cell style.</p><p>The parameters are explained in <ahref="#mxPerimeter.RectanglePerimeter"class=LFunctionid=link12onMouseOver="ShowTip(event, 'tt2', 'link12')"onMouseOut="HideTip('tt2')">RectanglePerimeter</a>.</p><!--START_ND_SUMMARY--><divclass=Summary><divclass=STitle>Summary</div><divclass=SBorder><tableborder=0cellspacing=0cellpadding=0class=STable><trclass="SMain"><tdclass=SEntry><ahref="#mxPerimeter">mxPerimeter</a></td><tdclass=SDescription>Provides various perimeter functions to be used in a style as the value of <ahref="../util/mxConstants-js.html#mxConstants.STYLE_PERIMETER"class=LVariableid=link1onMouseOver="ShowTip(event, 'tt1', 'link1')"onMouseOut="HideTip('tt1')">mxConstants.STYLE_PERIMETER</a>. </td></tr><trclass="SGroup SIndent1"><tdclass=SEntry><ahref="#mxPerimeter.Functions">Functions</a></td><tdclass=SDescription></td></tr><trclass="SFunction SIndent2 SMarked"><tdclass=SEntry><ahref="#mxPerimeter.RectanglePerimeter"id=link2onMouseOver="ShowTip(event, 'tt2', 'link2')"onMouseOut="HideTip('tt2')">RectanglePerimeter</a></td><tdclass=SDescription>Describes a rectangular perimeter for the given bounds.</td></tr><trclass="SFunction SIndent2"><tdclass=SEntry><ahref="#mxPerimeter.EllipsePerimeter"id=link3onMouseOver="ShowTip(event, 'tt3', 'link3')"onMouseOut="HideTip('tt3')">EllipsePerimeter</a></td><tdclass=SDescription>Describes an elliptic perimeter. </td></tr><trclass="SFunction SIndent2 SMarked"><tdclass=SEntry><ahref="#mxPerimeter.RhombusPerimeter"id=link4onMouseOver="ShowTip(event, 'tt4', 'link4')"onMouseOut="HideTip('tt4')">RhombusPerimeter</a></td><tdclass=SDescription>Describes a rhombus (aka diamond) perimeter. </td></tr><trclass="SFunction SIndent2"><tdclass=SEntry><ahref="#mxPerimeter.TrianglePerimeter"id=link5onMouseOver="ShowTip(event, 'tt5', 'link5')"onMouseOut="HideTip('tt5')">TrianglePerimeter</a></td><tdclass=SDescription>Describes a triangle perimeter. </td></tr><trclass="SFunction SIndent2 SMarked"><tdclass=SEntry><ahref="#mxPerimeter.HexagonPerimeter"id=link6onMouseOver="ShowTip(event, 'tt6', 'link6')"onMouseOut="HideTip('tt6')">HexagonPerimeter</a></td><tdclass=SDescription>Describes a hexagon perimeter. </td></tr></table></div></div><!--END_ND_SUMMARY--></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxPerimeter.RectanglePerimeter"></a>RectanglePerimeter</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>RectanglePerimeter: function (</td><tdclass="PParameter prettyprint "nowrap>bounds,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>vertex,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>next,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>orthogonal</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote><p>Describes a rectangular perimeter for the given bounds.</p><h4class=CHeading>Parameters</h4><tableborder=0cellspacing=0cellpadding=0class=CDescriptionList><tr><tdclass=CDLEntry>bounds</td><tdclass=CDLDescription><ahref="../util/mxRectangle-js.html#mxRectangle"class=LClassid=link13onMouseOver="ShowTip(event, 'tt9', 'link13')"onMouseOut="HideTip('tt9')">mxRectangle</a> that represents the absolute bounds of the vertex.</td></tr><tr><tdclass=CDLEntry>vertex</td><tdclass=CDLDescription><ahref="mxCellState-js.html#mxCellState"class=LClassid=link14onMouseOver="ShowTip(event, 'tt10', 'link14')"onMouseOut="HideTip('tt10')">mxCellState</a> that represents the vertex.</td></tr><tr><tdclass=CDLEntry>next</td><tdclass=CDLDescription><ahref="../util/mxPoint-js.html#mxPoint"class=LClassid=link15onMouseOver="ShowTip(event, 'tt11', 'link15')"onMouseOut="HideTip('tt11')">mxPoint</a> that represents the nearest neighbour point on the given edge.</td></tr><tr><tdclass=CDLEntry>orthogonal</td><tdclass=CDLDescription>Boolean that specifies if the orthogonal projection onto the perimeter should be returned. If this is false then the intersection of the perimeter and the line between the next and the center point is returned.</td></tr></table></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxPerimeter.EllipsePerimeter"></a>EllipsePerimeter</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>EllipsePerimeter: function (</td><tdclass="PParameter prettyprint "nowrap>bounds,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>vertex,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>next,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>orthogonal</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote><p>Describes an elliptic perimeter. See <ahref="#mxPerimeter.RectanglePerimeter"class=LFunctionid=link16onMouseOver="ShowTip(event, 'tt2', 'link16')"onMouseOut="HideTip('tt2')">RectanglePerimeter</a> for a description of the parameters.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxPerimeter.RhombusPerimeter"></a>RhombusPerimeter</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>RhombusPerimeter: function (</td><tdclass="PParameter prettyprint "nowrap>bounds,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>vertex,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>next,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>orthogonal</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote><p>Describes a rhombus (aka diamond) perimeter. See <ahref="#mxPerimeter.RectanglePerimeter"class=LFunctionid=link17onMouseOver="ShowTip(event, 'tt2', 'link17')"onMouseOut="HideTip('tt2')">RectanglePerimeter</a> for a description of the parameters.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxPerimeter.TrianglePerimeter"></a>TrianglePerimeter</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>TrianglePerimeter: function (</td><tdclass="PParameter prettyprint "nowrap>bounds,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>vertex,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>next,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>orthogonal</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote><p>Describes a triangle perimeter. See <ahref="#mxPerimeter.RectanglePerimeter"class=LFunctionid=link18onMouseOver="ShowTip(event, 'tt2', 'link18')"onMouseOut="HideTip('tt2')">RectanglePerimeter</a> for a description of the parameters.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxPerimeter.HexagonPerimeter"></a>HexagonPerimeter</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>HexagonPerimeter: function (</td><tdclass="PParameter prettyprint "nowrap>bounds,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>vertex,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>next,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>orthogonal</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote><p>Describes a hexagon perimeter. See <ahref="#mxPerimeter.RectanglePerimeter"class=LFunctionid=link19onMouseOver="ShowTip(event, 'tt2', 'link19')"onMouseOut="HideTip('tt2')">RectanglePerimeter</a> for a description of the parameters.</p></div></div></div>
<divclass=CToolTipid="tt1"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">STYLE_PERIMETER: 'perimeter'</td></tr></table></blockquote>Defines the key for the perimeter style. </div></div><divclass=CToolTipid="tt2"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>RectanglePerimeter: function (</td><tdclass="PParameter prettyprint "nowrap>bounds,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>vertex,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>next,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>orthogonal</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Describes a rectangular perimeter for the given bounds.</div></div><divclass=CToolTipid="tt3"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>EllipsePerimeter: function (</td><tdclass="PParameter prettyprint "nowrap>bounds,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>vertex,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>next,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>orthogonal</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Describes an elliptic perimeter. </div></div><divclass=CToolTipid="tt4"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>RhombusPerimeter: function (</td><tdclass="PParameter prettyprint "nowrap>bounds,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>vertex,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>next,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>orthogonal</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Describes a rhombus (aka diamond) perimeter. </div></div><divclass=CToolTipid="tt5"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>TrianglePerimeter: function (</td><tdclass="PParameter prettyprint "nowrap>bounds,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>vertex,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>next,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>orthogonal</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Describes a triangle perimeter. </div></div><divclass=CToolTipid="tt6"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>HexagonPerimeter: function (</td><tdclass="PParameter prettyprint "nowrap>bounds,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>vertex,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>next,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>orthogonal</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Describes a hexagon perimeter. </div></div><divclass=CToolTipid="tt7"><divclass=CClass>Singleton class that acts as a global converter from string to object values in a style. </div></div><divclass=CToolTipid="tt8"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxGraphView.prototype.allowEval</td></tr></table></blockquote>Speci