maxGraph/docs/js-api/files/index-txt.html

67 lines
50 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters!

This file contains invisible Unicode characters that may be processed differently from what appears below. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to reveal hidden characters.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>API Specification</title><link rel="stylesheet" type="text/css" href="../styles/main.css"><script language=JavaScript src="../javascript/main.js"></script><script language=JavaScript src="../javascript/prettify.js"></script><script language=JavaScript src="../javascript/searchdata.js"></script></head><body class="ContentPage" onLoad="NDOnLoad();prettyPrint();"><script language=JavaScript><!--
if (browserType) {document.write("<div class=" + browserType + ">");if (browserVer) {document.write("<div class=" + browserVer + ">"); }}// --></script>
<!-- Generated by Natural Docs, version 1.51 -->
<!-- http://www.naturaldocs.org -->
<!-- saved from url=(0026)http://www.naturaldocs.org -->
<div id=Content><div class="CFile"><div class=CTopic id=MainTopic><h1 class=CTitle><a name="API_Specification"></a>API Specification</h1><div class=CBody><h4 class=CHeading>Overview</h4><p>This JavaScript library is divided into 8 packages.&nbsp; The top-level <a href="mxClient-js.html#mxClient" class=LClass id=link1 onMouseOver="ShowTip(event, 'tt1', 'link1')" onMouseOut="HideTip('tt1')">mxClient</a> class includes (or dynamically imports) everything else.&nbsp; The current version is stored in <a href="mxClient-js.html#mxClient.VERSION" class=LVariable id=link2 onMouseOver="ShowTip(event, 'tt2', 'link2')" onMouseOut="HideTip('tt2')">mxClient.VERSION</a>.</p><p>The <b>editor</b> package provides the classes required to implement a diagram editor.&nbsp; The main class in this package is <a href="editor/mxEditor-js.html#mxEditor" class=LClass id=link3 onMouseOver="ShowTip(event, 'tt3', 'link3')" onMouseOut="HideTip('tt3')">mxEditor</a>.</p><p>The <b>view</b> and <b>model</b> packages implement the graph component, represented by <a href="view/mxGraph-js.html#mxGraph" class=LClass id=link4 onMouseOver="ShowTip(event, 'tt4', 'link4')" onMouseOut="HideTip('tt4')">mxGraph</a>.&nbsp; It refers to a <a href="model/mxGraphModel-js.html#mxGraphModel" class=LClass id=link5 onMouseOver="ShowTip(event, 'tt5', 'link5')" onMouseOut="HideTip('tt5')">mxGraphModel</a> which contains <a href="model/mxCell-js.html#mxCell" class=LClass id=link6 onMouseOver="ShowTip(event, 'tt6', 'link6')" onMouseOut="HideTip('tt6')">mxCell</a>s and caches the state of the cells in a <a href="view/mxGraphView-js.html#mxGraphView" class=LClass id=link7 onMouseOver="ShowTip(event, 'tt7', 'link7')" onMouseOut="HideTip('tt7')">mxGraphView</a>.&nbsp; The cells are painted using a <a href="view/mxCellRenderer-js.html#mxCellRenderer" class=LClass id=link8 onMouseOver="ShowTip(event, 'tt8', 'link8')" onMouseOut="HideTip('tt8')">mxCellRenderer</a> based on the appearance defined in <a href="view/mxStylesheet-js.html#mxStylesheet" class=LClass id=link9 onMouseOver="ShowTip(event, 'tt9', 'link9')" onMouseOut="HideTip('tt9')">mxStylesheet</a>.&nbsp; Undo history is implemented in <a href="util/mxUndoManager-js.html#mxUndoManager" class=LClass id=link10 onMouseOver="ShowTip(event, 'tt10', 'link10')" onMouseOut="HideTip('tt10')">mxUndoManager</a>.&nbsp; To display an icon on the graph, <a href="view/mxCellOverlay-js.html#mxCellOverlay" class=LClass id=link11 onMouseOver="ShowTip(event, 'tt11', 'link11')" onMouseOut="HideTip('tt11')">mxCellOverlay</a> may be used.&nbsp; Validation rules are defined with <a href="view/mxMultiplicity-js.html#mxMultiplicity" class=LClass id=link12 onMouseOver="ShowTip(event, 'tt12', 'link12')" onMouseOut="HideTip('tt12')">mxMultiplicity</a>.</p><p>The <b>handler</b>, <b>layout</b> and <b>shape</b> packages contain event listeners, layout algorithms and shapes, respectively.&nbsp; The graph event listeners include <a href="handler/mxRubberband-js.html#mxRubberband" class=LClass id=link13 onMouseOver="ShowTip(event, 'tt13', 'link13')" onMouseOut="HideTip('tt13')">mxRubberband</a> for rubberband selection, <a href="handler/mxTooltipHandler-js.html#mxTooltipHandler" class=LClass id=link14 onMouseOver="ShowTip(event, 'tt14', 'link14')" onMouseOut="HideTip('tt14')">mxTooltipHandler</a> for tooltips and <a href="handler/mxGraphHandler-js.html#mxGraphHandler" class=LClass id=link15 onMouseOver="ShowTip(event, 'tt15', 'link15')" onMouseOut="HideTip('tt15')">mxGraphHandler</a> for basic cell modifications.&nbsp; <a href="layout/mxCompactTreeLayout-js.html#mxCompactTreeLayout" class=LClass id=link16 onMouseOver="ShowTip(event, 'tt16', 'link16')" onMouseOut="HideTip('tt16')">mxCompactTreeLayout</a> implements a tree layout algorithm, and the shape package provides various shapes, which are subclasses of <a href="shape/mxShape-js.html#mxShape" class=LClass id=link17 onMouseOver="ShowTip(event, 'tt17', 'link17')" onMouseOut="HideTip('tt17')">mxShape</a>.</p><p>The <b>util</b> package provides utility classes including <a href="util/mxClipboard-js.html#mxClipboard" class=LClass id=link18 onMouseOver="ShowTip(event, 'tt18', 'link18')" onMouseOut="HideTip('tt18')">mxClipboard</a> for copy-paste, &lt;mxDatatransfer&gt; for drag-and-drop, <a href="util/mxConstants-js.html#mxConstants" class=LClass id=link19 onMouseOver="ShowTip(event, 'tt19', 'link19')" onMouseOut="HideTip('tt19')">mxConstants</a> for keys and values of stylesheets, <a href="util/mxEvent-js.html#mxEvent" class=LClass id=link20 onMouseOver="ShowTip(event, 'tt20', 'link20')" onMouseOut="HideTip('tt20')">mxEvent</a> and <a href="util/mxUtils-js.html#mxUtils" class=LClass id=link21 onMouseOver="ShowTip(event, 'tt21', 'link21')" onMouseOut="HideTip('tt21')">mxUtils</a> for cross-browser event-handling and general purpose functions, <a href="util/mxResources-js.html#mxResources" class=LClass id=link22 onMouseOver="ShowTip(event, 'tt22', 'link22')" onMouseOut="HideTip('tt22')">mxResources</a> for internationalization and <a href="util/mxLog-js.html#mxLog" class=LClass id=link23 onMouseOver="ShowTip(event, 'tt23', 'link23')" onMouseOut="HideTip('tt23')">mxLog</a> for console output.</p><p>The <b>io</b> package implements a generic <a href="io/mxObjectCodec-js.html#mxObjectCodec" class=LClass id=link24 onMouseOver="ShowTip(event, 'tt24', 'link24')" onMouseOut="HideTip('tt24')">mxObjectCodec</a> for turning JavaScript objects into XML.&nbsp; The main class is <a href="io/mxCodec-js.html#mxCodec" class=LClass id=link25 onMouseOver="ShowTip(event, 'tt25', 'link25')" onMouseOut="HideTip('tt25')">mxCodec</a>.&nbsp; <a href="io/mxCodecRegistry-js.html#mxCodecRegistry" class=LClass id=link26 onMouseOver="ShowTip(event, 'tt26', 'link26')" onMouseOut="HideTip('tt26')">mxCodecRegistry</a> is the global registry for custom codecs.</p><h4 class=CHeading>Events</h4><p>There are three different types of events, namely native DOM events, <a href="util/mxEventObject-js.html#mxEventObject" class=LClass id=link27 onMouseOver="ShowTip(event, 'tt27', 'link27')" onMouseOut="HideTip('tt27')">mxEventObjects</a> which are fired in an <a href="util/mxEventSource-js.html#mxEventSource" class=LClass id=link28 onMouseOver="ShowTip(event, 'tt28', 'link28')" onMouseOut="HideTip('tt28')">mxEventSource</a>, and <a href="util/mxMouseEvent-js.html#mxMouseEvent" class=LClass id=link29 onMouseOver="ShowTip(event, 'tt29', 'link29')" onMouseOut="HideTip('tt29')">mxMouseEvents</a> which are fired in <a href="view/mxGraph-js.html#mxGraph" class=LClass id=link30 onMouseOver="ShowTip(event, 'tt4', 'link30')" onMouseOut="HideTip('tt4')">mxGraph</a>.</p><p>Some helper methods for handling native events are provided in <a href="util/mxEvent-js.html#mxEvent" class=LClass id=link31 onMouseOver="ShowTip(event, 'tt20', 'link31')" onMouseOut="HideTip('tt20')">mxEvent</a>.&nbsp; It also takes care of resolving cycles between DOM nodes and JavaScript event handlers, which can lead to memory leaks in IE6.</p><p>Most custom events in mxGraph are implemented using <a href="util/mxEventSource-js.html#mxEventSource" class=LClass id=link32 onMouseOver="ShowTip(event, 'tt28', 'link32')" onMouseOut="HideTip('tt28')">mxEventSource</a>.&nbsp; Its listeners are functions that take a sender and <a href="util/mxEventObject-js.html#mxEventObject" class=LClass id=link33 onMouseOver="ShowTip(event, 'tt27', 'link33')" onMouseOut="HideTip('tt27')">mxEventObject</a>.&nbsp; Additionally, the <a href="view/mxGraph-js.html#mxGraph" class=LClass id=link34 onMouseOver="ShowTip(event, 'tt4', 'link34')" onMouseOut="HideTip('tt4')">mxGraph</a> class fires special <a href="util/mxMouseEvent-js.html#mxMouseEvent" class=LClass id=link35 onMouseOver="ShowTip(event, 'tt29', 'link35')" onMouseOut="HideTip('tt29')">mxMouseEvents</a> which are handled using mouse listeners, which are objects that provide a mousedown, mousemove and mouseup method.</p><p>Events in <a href="util/mxEventSource-js.html#mxEventSource" class=LClass id=link36 onMouseOver="ShowTip(event, 'tt28', 'link36')" onMouseOut="HideTip('tt28')">mxEventSource</a> are fired using <a href="util/mxEventSource-js.html#mxEventSource.fireEvent" class=LFunction id=link37 onMouseOver="ShowTip(event, 'tt30', 'link37')" onMouseOut="HideTip('tt30')">mxEventSource.fireEvent</a>.&nbsp; Listeners are added and removed using <a href="util/mxEventSource-js.html#mxEventSource.addListener" class=LFunction id=link38 onMouseOver="ShowTip(event, 'tt31', 'link38')" onMouseOut="HideTip('tt31')">mxEventSource.addListener</a> and <a href="util/mxEventSource-js.html#mxEventSource.removeListener" class=LFunction id=link39 onMouseOver="ShowTip(event, 'tt32', 'link39')" onMouseOut="HideTip('tt32')">mxEventSource.removeListener</a>.&nbsp; <a href="util/mxMouseEvent-js.html#mxMouseEvent" class=LClass id=link40 onMouseOver="ShowTip(event, 'tt29', 'link40')" onMouseOut="HideTip('tt29')">mxMouseEvents</a> in <a href="view/mxGraph-js.html#mxGraph" class=LClass id=link41 onMouseOver="ShowTip(event, 'tt4', 'link41')" onMouseOut="HideTip('tt4')">mxGraph</a> are fired using <a href="view/mxGraph-js.html#mxGraph.fireMouseEvent" class=LFunction id=link42 onMouseOver="ShowTip(event, 'tt33', 'link42')" onMouseOut="HideTip('tt33')">mxGraph.fireMouseEvent</a>.&nbsp; Listeners are added and removed using <a href="view/mxGraph-js.html#mxGraph.addMouseListener" class=LFunction id=link43 onMouseOver="ShowTip(event, 'tt34', 'link43')" onMouseOut="HideTip('tt34')">mxGraph.addMouseListener</a> and <a href="view/mxGraph-js.html#mxGraph.removeMouseListener" class=LFunction id=link44 onMouseOver="ShowTip(event, 'tt35', 'link44')" onMouseOut="HideTip('tt35')">mxGraph.removeMouseListener</a>, respectively.</p><h4 class=CHeading>Key bindings</h4><p>The following key bindings are defined for mouse events in the client across all browsers and platforms:</p><ul><li>Control-Drag: Duplicates (clones) selected cells</li><li>Shift-Rightlick: Shows the context menu</li><li>Alt-Click: Forces rubberband (aka. marquee)</li><li>Control-Select: Toggles the selection state</li><li>Shift-Drag: Constrains the offset to one direction</li><li>Shift-Control-Drag: Panning (also Shift-Rightdrag)</li></ul><h4 class=CHeading>Configuration</h4><p>The following global variables may be defined before the client is loaded to specify its language or base path, respectively.</p><ul><li>mxBasePath: Specifies the path in <a href="mxClient-js.html#mxClient.basePath" class=LVariable id=link45 onMouseOver="ShowTip(event, 'tt36', 'link45')" onMouseOut="HideTip('tt36')">mxClient.basePath</a>.</li><li>mxImageBasePath: Specifies the path in <a href="mxClient-js.html#mxClient.imageBasePath" class=LVariable id=link46 onMouseOver="ShowTip(event, 'tt37', 'link46')" onMouseOut="HideTip('tt37')">mxClient.imageBasePath</a>.</li><li>mxLanguage: Specifies the language for resources in <a href="mxClient-js.html#mxClient.language" class=LVariable id=link47 onMouseOver="ShowTip(event, 'tt38', 'link47')" onMouseOut="HideTip('tt38')">mxClient.language</a>.</li><li>mxDefaultLanguage: Specifies the default language in <a href="mxClient-js.html#mxClient.defaultLanguage" class=LVariable id=link48 onMouseOver="ShowTip(event, 'tt39', 'link48')" onMouseOut="HideTip('tt39')">mxClient.defaultLanguage</a>.</li><li>mxLoadResources: Specifies if any resources should be loaded.&nbsp; Default is true.</li><li>mxLoadStylesheets: Specifies if any stylesheets should be loaded.&nbsp; Default is true.</li></ul><h4 class=CHeading>Reserved Words</h4><p>The mx prefix is used for all classes and objects in mxGraph.&nbsp; The mx prefix can be seen as the global namespace for all JavaScript code in mxGraph.&nbsp; The following fieldnames should not be used in objects.</p><ul><li><b>mxObjectId</b>: If the object is used with mxObjectIdentity</li><li><b>as</b>: If the object is a field of another object</li><li><b>id</b>: If the object is an idref in a codec</li><li><b>mxListenerList</b>: Added to DOM nodes when used with <a href="util/mxEvent-js.html#mxEvent" class=LClass id=link49 onMouseOver="ShowTip(event, 'tt20', 'link49')" onMouseOut="HideTip('tt20')">mxEvent</a></li><li><b>window._mxDynamicCode</b>: Temporarily used to load code in Safari and Chrome (see <a href="mxClient-js.html#mxClient.include" class=LFunction id=link50 onMouseOver="ShowTip(event, 'tt40', 'link50')" onMouseOut="HideTip('tt40')">mxClient.include</a>).</li><li><b>_mxJavaScriptExpression</b>: Global variable that is temporarily used to evaluate code in Safari, Opera, Firefox 3 and IE (see <a href="util/mxUtils-js.html#mxUtils.eval" class=LFunction id=link51 onMouseOver="ShowTip(event, 'tt41', 'link51')" onMouseOut="HideTip('tt41')">mxUtils.eval</a>).</li></ul><h4 class=CHeading>Files</h4><p>The library contains these relative filenames.&nbsp; All filenames are relative to <a href="mxClient-js.html#mxClient.basePath" class=LVariable id=link52 onMouseOver="ShowTip(event, 'tt36', 'link52')" onMouseOut="HideTip('tt36')">mxClient.basePath</a>.</p><h4 class=CHeading>Built-in Images</h4><p>All images are loaded from the <a href="mxClient-js.html#mxClient.imageBasePath" class=LVariable id=link53 onMouseOver="ShowTip(event, 'tt37', 'link53')" onMouseOut="HideTip('tt37')">mxClient.imageBasePath</a>, which you can change to reflect your environment.&nbsp; The image variables can also be changed individually.</p><ul><li>mxGraph.prototype.collapsedImage</li><li>mxGraph.prototype.expandedImage</li><li>mxGraph.prototype.warningImage</li><li>mxWindow.prototype.closeImage</li><li>mxWindow.prototype.minimizeImage</li><li>mxWindow.prototype.normalizeImage</li><li>mxWindow.prototype.maximizeImage</li><li>mxWindow.prototype.resizeImage</li><li>mxPopupMenu.prototype.submenuImage</li><li>mxUtils.errorImage</li><li>mxConstraintHandler.prototype.pointImage</li></ul><p>The basename of the warning image (images/warning without extension) used in <a href="view/mxGraph-js.html#mxGraph.setCellWarning" class=LFunction id=link54 onMouseOver="ShowTip(event, 'tt42', 'link54')" onMouseOut="HideTip('tt42')">mxGraph.setCellWarning</a> is defined in <a href="view/mxGraph-js.html#mxGraph.warningImage" class=LVariable id=link55 onMouseOver="ShowTip(event, 'tt43', 'link55')" onMouseOut="HideTip('tt43')">mxGraph.warningImage</a>.</p><h4 class=CHeading>Resources</h4><p>The <a href="editor/mxEditor-js.html#mxEditor" class=LClass id=link56 onMouseOver="ShowTip(event, 'tt3', 'link56')" onMouseOut="HideTip('tt3')">mxEditor</a> and <a href="view/mxGraph-js.html#mxGraph" class=LClass id=link57 onMouseOver="ShowTip(event, 'tt4', 'link57')" onMouseOut="HideTip('tt4')">mxGraph</a> classes add the following resources to <a href="util/mxResources-js.html#mxResources" class=LClass id=link58 onMouseOver="ShowTip(event, 'tt22', 'link58')" onMouseOut="HideTip('tt22')">mxResources</a> at class loading time:</p><ul><li>resources/editor*.properties</li><li>resources/graph*.properties</li></ul><p>By default, the library ships with English and German resource files.</p><h4 class=CHeading>Images</h4><p>Recommendations for using images.&nbsp; Use GIF images (256 color palette) in HTML elements (such as the toolbar and context menu), and PNG images (24 bit) for all images which appear inside the graph component.</p><ul><li>For PNG images inside HTML elements, Internet Explorer will ignore any transparency information.</li><li>For GIF images inside the graph, Firefox on the Mac will display strange colors.&nbsp; Furthermore, only the first image for animated GIFs is displayed on the Mac.</li></ul><p>For faster image rendering during application runtime, images can be prefetched using the following code:</p><blockquote><pre class="prettyprint">var image = new Image();
image.src = url_to_image;</pre></blockquote><h4 class=CHeading>Deployment</h4><p>The client is added to the page using the following script tag inside the head of a document:</p><blockquote><pre class="prettyprint">&lt;script type=&quot;text/javascript&quot; src=&quot;js/mxClient.js&quot;&gt;&lt;/script&gt;</pre></blockquote><p>The deployment version of the mxClient.js file contains all required code in a single file.&nbsp; For deployment, the complete javascript/src directory is required.</p><h4 class=CHeading>Source Code</h4><p>If you are a source code customer and you wish to develop using the full source code, the commented source code is shipped in the javascript/devel/source.zip file.&nbsp; It contains one file for each class in mxGraph.&nbsp; To use the source code the source.zip file must be uncompressed and the mxClient.js URL in the HTML page must be changed to reference the uncompressed mxClient.js from the source.zip file.</p><h4 class=CHeading>Compression</h4><p>When using Apache2 with mod_deflate, you can use the following directive in src/js/.htaccess to speedup the loading of the JavaScript sources:</p><blockquote><pre class="prettyprint">SetOutputFilter DEFLATE</pre></blockquote><h4 class=CHeading>Classes</h4><p>There are two types of &ldquo;classes&rdquo; in mxGraph: classes and singletons (where only one instance exists).&nbsp; Singletons are mapped to global objects where the variable name equals the classname.&nbsp; For example mxConstants is an object with all the constants defined as object fields.&nbsp; Normal classes are mapped to a constructor function and a prototype which defines the instance fields and methods.&nbsp; For example, <a href="editor/mxEditor-js.html#mxEditor" class=LClass id=link59 onMouseOver="ShowTip(event, 'tt3', 'link59')" onMouseOut="HideTip('tt3')">mxEditor</a> is a function and mxEditor.prototype is the prototype for the object that the mxEditor function creates.&nbsp; The mx prefix is a convention that is used for all classes in the mxGraph package to avoid conflicts with other objects in the global namespace.</p><h4 class=CHeading>Subclassing</h4><p>For subclassing, the superclass must provide a constructor that is either parameterless or handles an invocation with no arguments.&nbsp; Furthermore, the special constructor field must be redefined after extending the prototype.&nbsp; For example, the superclass of mxEditor is <a href="util/mxEventSource-js.html#mxEventSource" class=LClass id=link60 onMouseOver="ShowTip(event, 'tt28', 'link60')" onMouseOut="HideTip('tt28')">mxEventSource</a>.&nbsp; This is represented in JavaScript by first &ldquo;inheriting&rdquo; all fields and methods from the superclass by assigning the prototype to an instance of the superclass, eg. mxEditor.prototype = new mxEventSource() and redefining the constructor field using mxEditor.prototype.constructor = mxEditor.&nbsp; The latter rule is applied so that the type of an object can be retrieved via the name of it’s constructor using mxUtils.getFunctionName(obj.constructor).</p><h4 class=CHeading>Constructor</h4><p>For subclassing in mxGraph, the same scheme should be applied.&nbsp; For example, for subclassing the <a href="view/mxGraph-js.html#mxGraph" class=LClass id=link61 onMouseOver="ShowTip(event, 'tt4', 'link61')" onMouseOut="HideTip('tt4')">mxGraph</a> class, first a constructor must be defined for the new class.&nbsp; The constructor calls the super constructor with any arguments that it may have using the call function on the mxGraph function object, passing along explitely each argument:</p><blockquote><pre class="prettyprint">function MyGraph(container)
{
mxGraph.call(this, container);
}</pre></blockquote><p>The prototype of MyGraph inherits from mxGraph as follows.&nbsp; As usual, the constructor is redefined after extending the superclass:</p><blockquote><pre class="prettyprint">MyGraph.prototype = new mxGraph();
MyGraph.prototype.constructor = MyGraph;</pre></blockquote><p>You may want to define the codec associated for the class after the above code.&nbsp; This code will be executed at class loading time and makes sure the same codec is used to encode instances of mxGraph and MyGraph.</p><blockquote><pre class="prettyprint">var codec = mxCodecRegistry.getCodec(mxGraph);
codec.template = new MyGraph();
mxCodecRegistry.register(codec);</pre></blockquote><h4 class=CHeading>Functions</h4><p>In the prototype for MyGraph, functions of mxGraph can then be extended as follows.</p><blockquote><pre class="prettyprint">MyGraph.prototype.isCellSelectable = function(cell)
{
var selectable = mxGraph.prototype.isSelectable.apply(this, arguments);
var geo = this.model.getGeometry(cell);
return selectable &amp;&amp; (geo == null || !geo.relative);
}</pre></blockquote><p>The supercall in the first line is optional.&nbsp; It is done using the apply function on the isSelectable function object of the mxGraph prototype, using the special this and arguments variables as parameters.&nbsp; Calls to the superclass function are only possible if the function is not replaced in the superclass as follows, which is another way of “subclassing” in JavaScript.</p><blockquote><pre class="prettyprint">mxGraph.prototype.isCellSelectable = function(cell)
{
var geo = this.model.getGeometry(cell);
return selectable &amp;&amp;
(geo == null ||
!geo.relative);
}</pre></blockquote><p>The above scheme is useful if a function definition needs to be replaced completely.</p><p>In order to add new functions and fields to the subclass, the following code is used.&nbsp; The example below adds a new function to return the XML representation of the graph model:</p><blockquote><pre class="prettyprint">MyGraph.prototype.getXml = function()
{
var enc = new mxCodec();
return enc.encode(this.getModel());
}</pre></blockquote><h4 class=CHeading>Variables</h4><p>Likewise, a new field is declared and defined as follows.</p><blockquote><pre class="prettyprint">MyGraph.prototype.myField = 'Hello, World!';</pre></blockquote><p>Note that the value assigned to myField is created only once, that is, all instances of MyGraph share the same value.&nbsp; If you require instance-specific values, then the field must be defined in the constructor instead.</p><blockquote><pre class="prettyprint">function MyGraph(container)
{
mxGraph.call(this, container);
this.myField = new Array();
}</pre></blockquote><p>Finally, a new instance of MyGraph is created using the following code, where container is a DOM node that acts as a container for the graph view:</p><blockquote><pre class="prettyprint">var graph = new MyGraph(container);</pre></blockquote></div></div></div>
</div><!--Content-->
<div id=Footer><a href="http://www.naturaldocs.org">Generated by Natural Docs</a></div><!--Footer-->
<div id=Menu><div class=MEntry><div class=MFile id=MSelected>API Specification</div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent1')">Editor</a><div class=MGroupContent id=MGroupContent1><div class=MEntry><div class=MFile><a href="editor/mxDefaultKeyHandler-js.html">mxDefaultKeyHandler</a></div></div><div class=MEntry><div class=MFile><a href="editor/mxDefaultPopupMenu-js.html">mxDefaultPopupMenu</a></div></div><div class=MEntry><div class=MFile><a href="editor/mxDefaultToolbar-js.html">mxDefaultToolbar</a></div></div><div class=MEntry><div class=MFile><a href="editor/mxEditor-js.html">mxEditor</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent2')">Handler</a><div class=MGroupContent id=MGroupContent2><div class=MEntry><div class=MFile><a href="handler/mxCellHighlight-js.html">mxCellHighlight</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxCellMarker-js.html">mxCellMarker</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxCellTracker-js.html">mxCellTracker</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxConnectionHandler-js.html">mxConnectionHandler</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxConstraintHandler-js.html">mxConstraintHandler</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxEdgeHandler-js.html">mxEdgeHandler</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxEdgeSegmentHandler-js.html">mxEdgeSegmentHandler.js</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxElbowEdgeHandler-js.html">mxElbowEdgeHandler</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxGraphHandler-js.html">mxGraphHandler</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxHandle-js.html">mxHandle</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxKeyHandler-js.html">mxKeyHandler</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxPanningHandler-js.html">mxPanningHandler</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxPopupMenuHandler-js.html">mxPopupMenuHandler</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxRubberband-js.html">mxRubberband</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxSelectionCellsHandler-js.html">mxSelectionCellsHandler</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxTooltipHandler-js.html">mxTooltipHandler</a></div></div><div class=MEntry><div class=MFile><a href="handler/mxVertexHandler-js.html">mxVertexHandler</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent3')">Io</a><div class=MGroupContent id=MGroupContent3><div class=MEntry><div class=MFile><a href="io/mxCellCodec-js.html">mxCellCodec</a></div></div><div class=MEntry><div class=MFile><a href="io/mxChildChangeCodec-js.html">mxChildChangeCodec</a></div></div><div class=MEntry><div class=MFile><a href="io/mxCodec-js.html">mxCodec</a></div></div><div class=MEntry><div class=MFile><a href="io/mxCodecRegistry-js.html">mxCodecRegistry</a></div></div><div class=MEntry><div class=MFile><a href="io/mxDefaultKeyHandlerCodec-js.html">mxDefaultKeyHandlerCodec</a></div></div><div class=MEntry><div class=MFile><a href="io/mxDefaultPopupMenuCodec-js.html">mxDefaultPopupMenuCodec</a></div></div><div class=MEntry><div class=MFile><a href="io/mxDefaultToolbarCodec-js.html">mxDefaultToolbarCodec</a></div></div><div class=MEntry><div class=MFile><a href="io/mxEditorCodec-js.html">mxEditorCodec</a></div></div><div class=MEntry><div class=MFile><a href="io/mxGenericChangeCodec-js.html">mxGenericChangeCodec</a></div></div><div class=MEntry><div class=MFile><a href="io/mxGraphCodec-js.html">mxGraphCodec</a></div></div><div class=MEntry><div class=MFile><a href="io/mxGraphViewCodec-js.html">mxGraphViewCodec</a></div></div><div class=MEntry><div class=MFile><a href="io/mxModelCodec-js.html">mxModelCodec</a></div></div><div class=MEntry><div class=MFile><a href="io/mxObjectCodec-js.html">mxObjectCodec</a></div></div><div class=MEntry><div class=MFile><a href="io/mxRootChangeCodec-js.html">mxRootChangeCodec</a></div></div><div class=MEntry><div class=MFile><a href="io/mxStylesheetCodec-js.html">mxStylesheetCodec</a></div></div><div class=MEntry><div class=MFile><a href="io/mxTerminalChangeCodec-js.html">mxTerminalChangeCodec</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent7')">Layout</a><div class=MGroupContent id=MGroupContent7><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent6')">Hierarchical</a><div class=MGroupContent id=MGroupContent6><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent4')">Model</a><div class=MGroupContent id=MGroupContent4><div class=MEntry><div class=MFile><a href="layout/hierarchical/model/mxGraphAbstractHierarchyCell-js.html">mxGraphAbstractHierarchyCell</a></div></div><div class=MEntry><div class=MFile><a href="layout/hierarchical/model/mxGraphHierarchyEdge-js.html">mxGraphHierarchyEdge</a></div></div><div class=MEntry><div class=MFile><a href="layout/hierarchical/model/mxGraphHierarchyModel-js.html">mxGraphHierarchyModel</a></div></div><div class=MEntry><div class=MFile><a href="layout/hierarchical/model/mxGraphHierarchyNode-js.html">mxGraphHierarchyNode</a></div></div><div class=MEntry><div class=MFile><a href="layout/hierarchical/model/mxSwimlaneModel-js.html">mxSwimlaneModel</a></div></div></div></div></div><div class=MEntry><div class=MFile><a href="layout/hierarchical/mxHierarchicalLayout-js.html">mxHierarchicalLayout</a></div></div><div class=MEntry><div class=MFile><a href="layout/hierarchical/mxSwimlaneLayout-js.html">mxSwimlaneLayout</a></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent5')">Stage</a><div class=MGroupContent id=MGroupContent5><div class=MEntry><div class=MFile><a href="layout/hierarchical/stage/mxCoordinateAssignment-js.html">mxCoordinateAssignment</a></div></div><div class=MEntry><div class=MFile><a href="layout/hierarchical/stage/mxHierarchicalLayoutStage-js.html">mxHierarchicalLayoutStage</a></div></div><div class=MEntry><div class=MFile><a href="layout/hierarchical/stage/mxMedianHybridCrossingReduction-js.html">mxMedianHybridCrossingReduction</a></div></div><div class=MEntry><div class=MFile><a href="layout/hierarchical/stage/mxMinimumCycleRemover-js.html">mxMinimumCycleRemover</a></div></div><div class=MEntry><div class=MFile><a href="layout/hierarchical/stage/mxSwimlaneOrdering-js.html">mxSwimlaneOrdering</a></div></div></div></div></div></div></div></div><div class=MEntry><div class=MFile><a href="layout/mxCircleLayout-js.html">mxCircleLayout</a></div></div><div class=MEntry><div class=MFile><a href="layout/mxCompactTreeLayout-js.html">mxCompactTreeLayout</a></div></div><div class=MEntry><div class=MFile><a href="layout/mxCompositeLayout-js.html">mxCompositeLayout</a></div></div><div class=MEntry><div class=MFile><a href="layout/mxEdgeLabelLayout-js.html">mxEdgeLabelLayout</a></div></div><div class=MEntry><div class=MFile><a href="layout/mxFastOrganicLayout-js.html">mxFastOrganicLayout</a></div></div><div class=MEntry><div class=MFile><a href="layout/mxGraphLayout-js.html">mxGraphLayout</a></div></div><div class=MEntry><div class=MFile><a href="layout/mxParallelEdgeLayout-js.html">mxParallelEdgeLayout</a></div></div><div class=MEntry><div class=MFile><a href="layout/mxPartitionLayout-js.html">mxPartitionLayout</a></div></div><div class=MEntry><div class=MFile><a href="layout/mxRadialTreeLayout-js.html">mxRadialTreeLayout</a></div></div><div class=MEntry><div class=MFile><a href="layout/mxStackLayout-js.html">mxStackLayout</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent8')">Model</a><div class=MGroupContent id=MGroupContent8><div class=MEntry><div class=MFile><a href="model/mxCell-js.html">mxCell</a></div></div><div class=MEntry><div class=MFile><a href="model/mxCellPath-js.html">mxCellPath</a></div></div><div class=MEntry><div class=MFile><a href="model/mxGeometry-js.html">mxGeometry</a></div></div><div class=MEntry><div class=MFile><a href="model/mxGraphModel-js.html">mxGraphModel</a></div></div></div></div></div><div class=MEntry><div class=MFile><a href="mxClient-js.html">mxClient</a></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent9')">Shape</a><div class=MGroupContent id=MGroupContent9><div class=MEntry><div class=MFile><a href="shape/mxActor-js.html">mxActor</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxArrow-js.html">mxArrow</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxArrowConnector-js.html">mxArrowConnector</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxCloud-js.html">mxCloud</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxConnector-js.html">mxConnector</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxCylinder-js.html">mxCylinder</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxDoubleEllipse-js.html">mxDoubleEllipse</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxEllipse-js.html">mxEllipse</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxHexagon-js.html">mxHexagon</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxImageShape-js.html">mxImageShape</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxLabel-js.html">mxLabel</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxLine-js.html">mxLine</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxMarker-js.html">mxMarker</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxPolyline-js.html">mxPolyline</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxRectangleShape-js.html">mxRectangleShape</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxRhombus-js.html">mxRhombus</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxShape-js.html">mxShape</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxStencil-js.html">mxStencil</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxStencilRegistry-js.html">mxStencilRegistry</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxSwimlane-js.html">mxSwimlane</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxText-js.html">mxText</a></div></div><div class=MEntry><div class=MFile><a href="shape/mxTriangle-js.html">mxTriangle</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent10')">Util</a><div class=MGroupContent id=MGroupContent10><div class=MEntry><div class=MFile><a href="util/mxAbstractCanvas2D-js.html">mxAbstractCanvas2D</a></div></div><div class=MEntry><div class=MFile><a href="util/mxAnimation-js.html">mxAnimation</a></div></div><div class=MEntry><div class=MFile><a href="util/mxAutoSaveManager-js.html">mxAutoSaveManager</a></div></div><div class=MEntry><div class=MFile><a href="util/mxClipboard-js.html">mxClipboard</a></div></div><div class=MEntry><div class=MFile><a href="util/mxConstants-js.html">mxConstants</a></div></div><div class=MEntry><div class=MFile><a href="util/mxDictionary-js.html">mxDictionary</a></div></div><div class=MEntry><div class=MFile><a href="util/mxDivResizer-js.html">mxDivResizer</a></div></div><div class=MEntry><div class=MFile><a href="util/mxDragSource-js.html">mxDragSource</a></div></div><div class=MEntry><div class=MFile><a href="util/mxEffects-js.html">mxEffects</a></div></div><div class=MEntry><div class=MFile><a href="util/mxEvent-js.html">mxEvent</a></div></div><div class=MEntry><div class=MFile><a href="util/mxEventObject-js.html">mxEventObject</a></div></div><div class=MEntry><div class=MFile><a href="util/mxEventSource-js.html">mxEventSource</a></div></div><div class=MEntry><div class=MFile><a href="util/mxForm-js.html">mxForm</a></div></div><div class=MEntry><div class=MFile><a href="util/mxGuide-js.html">mxGuide</a></div></div><div class=MEntry><div class=MFile><a href="util/mxImage-js.html">mxImage</a></div></div><div class=MEntry><div class=MFile><a href="util/mxImageBundle-js.html">mxImageBundle</a></div></div><div class=MEntry><div class=MFile><a href="util/mxImageExport-js.html">mxImageExport</a></div></div><div class=MEntry><div class=MFile><a href="util/mxLog-js.html">mxLog</a></div></div><div class=MEntry><div class=MFile><a href="util/mxMorphing-js.html">mxMorphing</a></div></div><div class=MEntry><div class=MFile><a href="util/mxMouseEvent-js.html">mxMouseEvent</a></div></div><div class=MEntry><div class=MFile><a href="util/mxObjectIdentity-js.html">mxObjectIdentity</a></div></div><div class=MEntry><div class=MFile><a href="util/mxPanningManager-js.html">mxPanningManager</a></div></div><div class=MEntry><div class=MFile><a href="util/mxPoint-js.html">mxPoint</a></div></div><div class=MEntry><div class=MFile><a href="util/mxPopupMenu-js.html">mxPopupMenu</a></div></div><div class=MEntry><div class=MFile><a href="util/mxRectangle-js.html">mxRectangle</a></div></div><div class=MEntry><div class=MFile><a href="util/mxResources-js.html">mxResources</a></div></div><div class=MEntry><div class=MFile><a href="util/mxSvgCanvas2D-js.html">mxSvgCanvas2D</a></div></div><div class=MEntry><div class=MFile><a href="util/mxToolbar-js.html">mxToolbar</a></div></div><div class=MEntry><div class=MFile><a href="util/mxUndoableEdit-js.html">mxUndoableEdit</a></div></div><div class=MEntry><div class=MFile><a href="util/mxUndoManager-js.html">mxUndoManager</a></div></div><div class=MEntry><div class=MFile><a href="util/mxUrlConverter-js.html">mxUrlConverter</a></div></div><div class=MEntry><div class=MFile><a href="util/mxUtils-js.html">mxUtils</a></div></div><div class=MEntry><div class=MFile><a href="util/mxVmlCanvas2D-js.html">mxVmlCanvas2D</a></div></div><div class=MEntry><div class=MFile><a href="util/mxWindow-js.html">mxWindow</a></div></div><div class=MEntry><div class=MFile><a href="util/mxXmlCanvas2D-js.html">mxXmlCanvas2D</a></div></div><div class=MEntry><div class=MFile><a href="util/mxXmlRequest-js.html">mxXmlRequest</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent11')">View</a><div class=MGroupContent id=MGroupContent11><div class=MEntry><div class=MFile><a href="view/mxCellEditor-js.html">mxCellEditor</a></div></div><div class=MEntry><div class=MFile><a href="view/mxCellOverlay-js.html">mxCellOverlay</a></div></div><div class=MEntry><div class=MFile><a href="view/mxCellRenderer-js.html">mxCellRenderer</a></div></div><div class=MEntry><div class=MFile><a href="view/mxCellState-js.html">mxCellState</a></div></div><div class=MEntry><div class=MFile><a href="view/mxCellStatePreview-js.html">mxCellStatePreview</a></div></div><div class=MEntry><div class=MFile><a href="view/mxConnectionConstraint-js.html">mxConnectionConstraint</a></div></div><div class=MEntry><div class=MFile><a href="view/mxEdgeStyle-js.html">mxEdgeStyle</a></div></div><div class=MEntry><div class=MFile><a href="view/mxGraph-js.html">mxGraph</a></div></div><div class=MEntry><div class=MFile><a href="view/mxGraphSelectionModel-js.html">mxGraphSelectionModel</a></div></div><div class=MEntry><div class=MFile><a href="view/mxGraphView-js.html">mxGraphView</a></div></div><div class=MEntry><div class=MFile><a href="view/mxLayoutManager-js.html">mxLayoutManager</a></div></div><div class=MEntry><div class=MFile><a href="view/mxMultiplicity-js.html">mxMultiplicity</a></div></div><div class=MEntry><div class=MFile><a href="view/mxOutline-js.html">mxOutline</a></div></div><div class=MEntry><div class=MFile><a href="view/mxPerimeter-js.html">mxPerimeter</a></div></div><div class=MEntry><div class=MFile><a href="view/mxPrintPreview-js.html">mxPrintPreview</a></div></div><div class=MEntry><div class=MFile><a href="view/mxStyleRegistry-js.html">mxStyleRegistry</a></div></div><div class=MEntry><div class=MFile><a href="view/mxStylesheet-js.html">mxStylesheet</a></div></div><div class=MEntry><div class=MFile><a href="view/mxSwimlaneManager-js.html">mxSwimlaneManager</a></div></div><div class=MEntry><div class=MFile><a href="view/mxTemporaryCellStates-js.html">mxTemporaryCellStates</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent12')">Index</a><div class=MGroupContent id=MGroupContent12><div class=MEntry><div class=MIndex><a href="../index/Classes.html">Classes</a></div></div><div class=MEntry><div class=MIndex><a href="../index/Cookies.html">Cookies</a></div></div><div class=MEntry><div class=MIndex><a href="../index/Events.html">Events</a></div></div><div class=MEntry><div class=MIndex><a href="../index/General.html">Everything</a></div></div><div class=MEntry><div class=MIndex><a href="../index/Files.html">Files</a></div></div><div class=MEntry><div class=MIndex><a href="../index/Functions.html">Functions</a></div></div><div class=MEntry><div class=MIndex><a href="../index/Variables.html">Variables</a></div></div></div></div></div><script type="text/javascript"><!--
var searchPanel = new SearchPanel("searchPanel", "HTML", "../search");
--></script><div id=MSearchPanel class=MSearchPanelInactive><input type=text id=MSearchField value=Search onFocus="searchPanel.OnSearchFieldFocus(true)" onBlur="searchPanel.OnSearchFieldFocus(false)" onKeyUp="searchPanel.OnSearchFieldChange()"><select id=MSearchType onFocus="searchPanel.OnSearchTypeFocus(true)" onBlur="searchPanel.OnSearchTypeFocus(false)" onChange="searchPanel.OnSearchTypeChange()"><option id=MSearchEverything selected value="General">Everything</option><option value="Classes">Classes</option><option value="Cookies">Cookies</option><option value="Events">Events</option><option value="Files">Files</option><option value="Functions">Functions</option><option value="Variables">Variables</option></select></div><script language=JavaScript><!--
HideAllBut([1], 13);// --></script></div><!--Menu-->
<!--START_ND_TOOLTIPS-->
<div class=CToolTip id="tt1"><div class=CClass>Bootstrapping mechanism for the mxGraph thin client. </div></div><div class=CToolTip id="tt2"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td class="prettyprint">VERSION: '4.2.2'</td></tr></table></blockquote>Contains the current version of the mxGraph library. </div></div><div class=CToolTip id="tt3"><div class=CClass>Extends mxEventSource to implement an application wrapper for a graph that adds actions, I/O using mxCodec, auto-layout using mxLayoutManager, command history using undoManager, and standard dialogs and widgets, eg. </div></div><div class=CToolTip id="tt4"><div class=CClass>Extends mxEventSource to implement a graph component for the browser. </div></div><div class=CToolTip id="tt5"><div class=CClass>Extends mxEventSource to implement a graph model. </div></div><div class=CToolTip id="tt6"><div class=CClass>Cells are the elements of the graph model. </div></div><div class=CToolTip id="tt7"><div class=CClass>Extends mxEventSource to implement a view for a graph. </div></div><div class=CToolTip id="tt8"><div class=CClass>Renders cells into a document object model. </div></div><div class=CToolTip id="tt9"><div class=CClass>Defines the appearance of the cells in a graph. </div></div><div class=CToolTip id="tt10"><div class=CClass>Implements a command history. </div></div><div class=CToolTip id="tt11"><div class=CClass>Extends mxEventSource to implement a graph overlay, represented by an icon and a tooltip. </div></div><div class=CToolTip id="tt12"><div class=CClass>Defines invalid connections along with the error messages that they produce. </div></div><div class=CToolTip id="tt13"><div class=CClass>Event handler that selects rectangular regions. </div></div><div class=CToolTip id="tt14"><div class=CClass>Graph event handler that displays tooltips. </div></div><div class=CToolTip id="tt15"><div class=CClass>Graph event handler that handles selection. </div></div><div class=CToolTip id="tt16"><div class=CClass>Extends mxGraphLayout to implement a compact tree (Moen) algorithm. </div></div><div class=CToolTip id="tt17"><div class=CClass>Base class for all shapes. </div></div><div class=CToolTip id="tt18"><div class=CClass>Singleton that implements a clipboard for graph cells.</div></div><div class=CToolTip id="tt19"><div class=CClass>Defines various global constants.</div></div><div class=CToolTip id="tt20"><div class=CClass>Cross-browser DOM event support. </div></div><div class=CToolTip id="tt21"><div class=CClass>A singleton class that provides cross-browser helper methods. </div></div><div class=CToolTip id="tt22"><div class=CClass>Implements internationalization. </div></div><div class=CToolTip id="tt23"><div class=CClass>A singleton class that implements a simple console.</div></div><div class=CToolTip id="tt24"><div class=CClass>Generic codec for JavaScript objects that implements a mapping between JavaScript objects and XML nodes that maps each field or element to an attribute or child node, and vice versa.</div></div><div class=CToolTip id="tt25"><div class=CClass>XML codec for JavaScript object graphs. </div></div><div class=CToolTip id="tt26"><div class=CClass>Singleton class that acts as a global registry for codecs.</div></div><div class=CToolTip id="tt27"><div class=CClass>The mxEventObject is a wrapper for all properties of a single event. </div></div><div class=CToolTip id="tt28"><div class=CClass>Base class for objects that dispatch named events. </div></div><div class=CToolTip id="tt29"><div class=CClass>Base class for all mouse events in mxGraph. </div></div><div class=CToolTip id="tt30"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class="PBeforeParameters prettyprint "nowrap>mxEventSource.prototype.fireEvent = function(</td><td class="PParameter prettyprint " nowrap>evt,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>sender</td><td class="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Dispatches the given event to the listeners which are registered for the event. </div></div><div class=CToolTip id="tt31"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class="PBeforeParameters prettyprint "nowrap>mxEventSource.prototype.addListener = function(</td><td class="PParameter prettyprint " nowrap>name,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>funct</td><td class="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Binds the specified function to the given event name. </div></div><div class=CToolTip id="tt32"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class="PBeforeParameters prettyprint "nowrap>mxEventSource.prototype.removeListener = function(</td><td class="PParameter prettyprint " nowrap>funct</td><td class="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Removes all occurrences of the given listener from eventListeners.</div></div><div class=CToolTip id="tt33"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class="PBeforeParameters prettyprint "nowrap>mxGraph.prototype.fireMouseEvent = function(</td><td class="PParameter prettyprint " nowrap>evtName,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>me,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>sender</td><td class="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Dispatches the given event in the graph event dispatch loop. </div></div><div class=CToolTip id="tt34"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class="PBeforeParameters prettyprint "nowrap>mxGraph.prototype.addMouseListener = function(</td><td class="PParameter prettyprint " nowrap>listener</td><td class="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Adds a listener to the graph event dispatch loop. </div></div><div class=CToolTip id="tt35"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class="PBeforeParameters prettyprint "nowrap>mxGraph.prototype.removeMouseListener = function(</td><td class="PParameter prettyprint " nowrap>listener</td><td class="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Removes the specified graph listener.</div></div><div class=CToolTip id="tt36"><div class=CVariable>Basepath for all URLs in the core without trailing slash. </div></div><div class=CToolTip id="tt37"><div class=CVariable>Basepath for all images URLs in the core without trailing slash. </div></div><div class=CToolTip id="tt38"><div class=CVariable>Defines the language of the client, eg. </div></div><div class=CToolTip id="tt39"><div class=CVariable>Defines the default language which is used in the common resource files. </div></div><div class=CToolTip id="tt40"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class="PBeforeParameters prettyprint "nowrap>include: function(</td><td class="PParameter prettyprint " nowrap>src</td><td class="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Dynamically adds a script node to the document header.</div></div><div class=CToolTip id="tt41"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class="PBeforeParameters prettyprint "nowrap>eval: function(</td><td class="PParameter prettyprint " nowrap>expr</td><td class="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Evaluates the given expression using eval and returns the JavaScript object that represents the expression result. </div></div><div class=CToolTip id="tt42"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class="PBeforeParameters prettyprint "nowrap>mxGraph.prototype.setCellWarning = function(</td><td class="PParameter prettyprint " nowrap>cell,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>warning,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>img,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>isSelect</td><td class="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Creates an overlay for the given cell using the warning and image or warningImage and returns the new mxCellOverlay. </div></div><div class=CToolTip id="tt43"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td class="prettyprint">mxGraph.prototype.warningImage</td></tr></table></blockquote>Specifies the mxImage for the image to be used to display a warning overlay. </div></div><!--END_ND_TOOLTIPS-->
<div id=MSearchResultsWindow><iframe src="" frameborder=0 name=MSearchResults id=MSearchResults></iframe><a href="javascript:searchPanel.CloseResultsWindow()" id=MSearchResultsWindowClose>Close</a></div>
<script language=JavaScript><!--
if (browserType) {if (browserVer) {document.write("</div>"); }document.write("</div>");}// --></script></body></html>