<divid=Content><divclass="CClass"><divclass=CTopicid=MainTopic><h1class=CTitle><aname="mxImageShape"></a>mxImageShape</h1><divclass=CBody><p>Extends <ahref="mxShape-js.html#mxShape"class=LClassid=link14onMouseOver="ShowTip(event, 'tt1', 'link14')"onMouseOut="HideTip('tt1')">mxShape</a> to implement an image shape. This shape is registered under <ahref="../util/mxConstants-js.html#mxConstants.SHAPE_IMAGE"class=LVariableid=link15onMouseOver="ShowTip(event, 'tt14', 'link15')"onMouseOut="HideTip('tt14')">mxConstants.SHAPE_IMAGE</a> in <ahref="../view/mxCellRenderer-js.html#mxCellRenderer"class=LClassid=link16onMouseOver="ShowTip(event, 'tt15', 'link16')"onMouseOut="HideTip('tt15')">mxCellRenderer</a>.</p><!--START_ND_SUMMARY--><divclass=Summary><divclass=STitle>Summary</div><divclass=SBorder><tableborder=0cellspacing=0cellpadding=0class=STable><trclass="SMain"><tdclass=SEntry><ahref="#mxImageShape">mxImageShape</a></td><tdclass=SDescription>Extends <ahref="mxShape-js.html#mxShape"class=LClassid=link1onMouseOver="ShowTip(event, 'tt1', 'link1')"onMouseOut="HideTip('tt1')">mxShape</a> to implement an image shape. </td></tr><trclass="SGroup SIndent1"><tdclass=SEntry><ahref="#mxImageShape.Functions">Functions</a></td><tdclass=SDescription></td></tr><trclass="SFunction SIndent2 SMarked"><tdclass=SEntry><ahref="#mxImageShape.mxImageShape"id=link2onMouseOver="ShowTip(event, 'tt2', 'link2')"onMouseOut="HideTip('tt2')">mxImageShape</a></td><tdclass=SDescription>Constructs a new image shape.</td></tr><trclass="SGroup SIndent1"><tdclass=SEntry><ahref="#mxImageShape.Variables">Variables</a></td><tdclass=SDescription></td></tr><trclass="SVariable SIndent2 SMarked"><tdclass=SEntry><ahref="#mxImageShape.preserveImageAspect"id=link3onMouseOver="ShowTip(event, 'tt3', 'link3')"onMouseOut="HideTip('tt3')">preserveImageAspect</a></td><tdclass=SDescription>Switch to preserve image aspect. </td></tr><trclass="SGroup SIndent1"><tdclass=SEntry><ahref="#mxImageShape.Functions">Functions</a></td><tdclass=SDescription></td></tr><trclass="SFunction SIndent2 SMarked"><tdclass=SEntry><ahref="#mxImageShape.getSvgScreenOffset"id=link4onMouseOver="ShowTip(event, 'tt4', 'link4')"onMouseOut="HideTip('tt4')">getSvgScreenOffset</a></td><tdclass=SDescription>Disables offset in IE9 for crisper image output.</td></tr><trclass="SFunction SIndent2"><tdclass=SEntry><ahref="#mxImageShape.apply"id=link5onMouseOver="ShowTip(event, 'tt5', 'link5')"onMouseOut="HideTip('tt5')">apply</a></td><tdclass=SDescription>Overrides <ahref="mxShape-js.html#mxShape.apply"class=LFunctionid=link6onMouseOver="ShowTip(event, 'tt6', 'link6')"onMouseOut="HideTip('tt6')">mxShape.apply</a> to replace the fill and stroke colors with the respective values from <ahref="../util/mxConstants-js.html#mxConstants.STYLE_IMAGE_BACKGROUND"class=LVariableid=link7onMouseOver="ShowTip(event, 'tt7', 'link7')"onMouseOut="HideTip('tt7')">mxConstants.STYLE_IMAGE_BACKGROUND</a> and <ahref="../util/mxConstants-js.html#mxConstants.STYLE_IMAGE_BORDER"class=LVariableid=link8onMouseOver="ShowTip(event, 'tt8', 'link8')"onMouseOut="HideTip('tt8')">mxConstants.STYLE_IMAGE_BORDER</a>.</td></tr><trclass="SFunction SIndent2 SMarked"><tdclass=SEntry><ahref="#mxImageShape.isHtmlAllowed"id=link9onMouseOver="ShowTip(event, 'tt9', 'link9')"onMouseOut="HideTip('tt9')">isHtmlAllowed</a></td><tdclass=SDescription>Returns true if HTML is allowed for this shape. </td></tr><trclass="SFunction SIndent2"><tdclass=SEntry><ahref="#mxImageShape.createHtml"id=link10onMouseOver="ShowTip(event, 'tt10', 'link10')"onMouseOut="HideTip('tt10')">createHtml</a></td><tdclass=SDescription>Creates and returns the HTML DOM node(s) to represent this shape. </td></tr><trclass="SFunction SIndent2 SMarked"><tdclass=SEntry><ahref="#mxImageShape.paintVertexShape"id=link11onMouseOver="ShowTip(event, 'tt11', 'link11')"onMouseOut="HideTip('tt11')">paintVertexShape</a></td><tdclass=SDescription>Generic background painting implementation.<
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxImageShape.mxImageShape"></a>mxImageShape</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>function mxImageShape(</td><tdclass="PParameter prettyprint "nowrap>bounds,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>image,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>fill,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>stroke,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>strokewidth</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote><p>Constructs a new image shape.</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=link17onMouseOver="ShowTip(event, 'tt16', 'link17')"onMouseOut="HideTip('tt16')">mxRectangle</a> that defines the bounds. This is stored in <ahref="mxShape-js.html#mxShape.bounds"class=LVariableid=link18onMouseOver="ShowTip(event, 'tt17', 'link18')"onMouseOut="HideTip('tt17')">mxShape.bounds</a>.</td></tr><tr><tdclass=CDLEntry>image</td><tdclass=CDLDescription>String that specifies the URL of the image. This is stored in <image>.</td></tr><tr><tdclass=CDLEntry>fill</td><tdclass=CDLDescription>String that defines the fill color. This is stored in <fill>.</td></tr><tr><tdclass=CDLEntry>stroke</td><tdclass=CDLDescription>String that defines the stroke color. This is stored in <stroke>.</td></tr><tr><tdclass=CDLEntry>strokewidth</td><tdclass=CDLDescription>Optional integer that defines the stroke width. Default is 0. This is stored in <strokewidth>.</td></tr></table></div></div></div>
<divclass="CVariable"><divclass=CTopic><h3class=CTitle><aname="mxImageShape.preserveImageAspect"></a>preserveImageAspect</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxImageShape.prototype.preserveImageAspect</td></tr></table></blockquote><p>Switch to preserve image aspect. Default is true.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxImageShape.getSvgScreenOffset"></a>getSvgScreenOffset</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxImageShape.prototype.getSvgScreenOffset = function()</td></tr></table></blockquote><p>Disables offset in IE9 for crisper image output.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxImageShape.apply"></a>apply</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>mxImageShape.prototype.apply = function(</td><tdclass="PParameter prettyprint "nowrap>state</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote><p>Overrides <ahref="mxShape-js.html#mxShape.apply"class=LFunctionid=link19onMouseOver="ShowTip(event, 'tt6', 'link19')"onMouseOut="HideTip('tt6')">mxShape.apply</a> to replace the fill and stroke colors with the respective values from <ahref="../util/mxConstants-js.html#mxConstants.STYLE_IMAGE_BACKGROUND"class=LVariableid=link20onMouseOver="ShowTip(event, 'tt7', 'link20')"onMouseOut="HideTip('tt7')">mxConstants.STYLE_IMAGE_BACKGROUND</a> and <ahref="../util/mxConstants-js.html#mxConstants.STYLE_IMAGE_BORDER"class=LVariableid=link21onMouseOver="ShowTip(event, 'tt8', 'link21')"onMouseOut="HideTip('tt8')">mxConstants.STYLE_IMAGE_BORDER</a>.</p><p>Applies the style of the given <ahref="../view/mxCellState-js.html#mxCellState"class=LClassid=link22onMouseOver="ShowTip(event, 'tt18', 'link22')"onMouseOut="HideTip('tt18')">mxCellState</a> to the shape. This implementation assigns the following styles to local fields:</p><ul><li><ahref="../util/mxConstants-js.html#mxConstants.STYLE_IMAGE_BACKGROUND"class=LVariableid=link23onMouseOver="ShowTip(event, 'tt7', 'link23')"onMouseOut="HideTip('tt7')">mxConstants.STYLE_IMAGE_BACKGROUND</a> => fill</li><li><ahref="../util/mxConstants-js.html#mxConstants.STYLE_IMAGE_BORDER"class=LVariableid=link24onMouseOver="ShowTip(event, 'tt8', 'link24')"onMouseOut="HideTip('tt8')">mxConstants.STYLE_IMAGE_BORDER</a> => stroke</li></ul><h4class=CHeading>Parameters</h4><tableborder=0cellspacing=0cellpadding=0class=CDescriptionList><tr><tdclass=CDLEntry>state</td><tdclass=CDLDescription><ahref="../view/mxCellState-js.html#mxCellState"class=LClassid=link25onMouseOver="ShowTip(event, 'tt18', 'link25')"onMouseOut="HideTip('tt18')">mxCellState</a> of the corresponding cell.</td></tr></table></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxImageShape.isHtmlAllowed"></a>isHtmlAllowed</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxImageShape.prototype.isHtmlAllowed = function()</td></tr></table></blockquote><p>Returns true if HTML is allowed for this shape. This implementation always returns false.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxImageShape.createHtml"></a>createHtml</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxImageShape.prototype.createHtml = function()</td></tr></table></blockquote><p>Creates and returns the HTML DOM node(s) to represent this shape. This implementation falls back to <createVml> so that the HTML creation is optional.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxImageShape.redraw"></a>redraw</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxImageShape.prototype.redrawHtmlShape = function()</td></tr></table></blockquote><p>Overrides <ahref="mxShape-js.html#mxShape.redraw"class=LFunctionid=link26onMouseOver="ShowTip(event, 'tt13', 'link26')"onMouseOut="HideTip('tt13')">mxShape.redraw</a> to preserve the aspect ratio of images.</p></div></div></div>
<divclass=CToolTipid="tt1"><divclass=CClass>Base class for all shapes. </div></div><divclass=CToolTipid="tt2"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>function mxImageShape(</td><tdclass="PParameter prettyprint "nowrap>bounds,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>image,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>fill,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>stroke,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>strokewidth</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Constructs a new image shape.</div></div><divclass=CToolTipid="tt3"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxImageShape.prototype.preserveImageAspect</td></tr></table></blockquote>Switch to preserve image aspect. </div></div><divclass=CToolTipid="tt4"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxImageShape.prototype.getSvgScreenOffset = function()</td></tr></table></blockquote>Disables offset in IE9 for crisper image output.</div></div><divclass=CToolTipid="tt5"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>mxImageShape.prototype.apply = function(</td><tdclass="PParameter prettyprint "nowrap>state</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Overrides mxShape.apply to replace the fill and stroke colors with the respective values from mxConstants.STYLE_IMAGE_BACKGROUND and mxConstants.STYLE_IMAGE_BORDER.</div></div><divclass=CToolTipid="tt6"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>mxShape.prototype.apply = function(</td><tdclass="PParameter prettyprint "nowrap>state</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Applies the style of the given mxCellState to the shape. </div></div><divclass=CToolTipid="tt7"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">STYLE_IMAGE_BACKGROUND: 'imageBackground'</td></tr></table></blockquote>Defines the key for the image background color. </div></div><divclass=CToolTipid="tt8"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">STYLE_IMAGE_BORDER: 'imageBorder'</td></tr></table></blockquote>Defines the key for the image border color. </div></div><divclass=CToolTipid="tt9"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxImageShape.prototype.isHtmlAllowed = function()</td></tr></table></blockquote>Returns true if HTML is allowed for this shape. </div></div><divclass=CToolTipid="tt10"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxImageShape.prototype.createHtml = function()</td></tr></table></blockquote>Creates and returns the HTML DOM node(s) to represent this shape. </div></div><divclass=CToolTipid="tt11"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>mxImageShape.prototype.paintVertexShape = function(</td><tdclass="PParameter prettyprint "nowrap>c,</td></tr><tr><td></td><tdclass="PParameter prettyprint "nowrap>x,</td></tr><tr><td></td><tdclass="PPar