You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
3566 lines
275 KiB
3566 lines
275 KiB
<!doctype html>
|
|
<html class="default no-js">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<title>GraphObject | GoJS API</title>
|
|
<meta name="description" content="">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="stylesheet" href="../../assets/css/bootstrap.min.css">
|
|
<link rel="stylesheet" href="../assets/css/main.css">
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<!-- non-fixed navbar -->
|
|
<nav id="non-fixed-nav" class="navbar navbar-inverse navbar-top">
|
|
<div class="container-fluid">
|
|
<div class="navbar-header">
|
|
<div class="navheader-container">
|
|
<div class="navheader-collapse" data-toggle="collapse" data-target="#navbar">
|
|
<a id="toplogo" class="navbar-brand" href="../../index.html">GoJS</a>
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="navbar" class="navbar-collapse collapse">
|
|
<ul class="nav navbar-nav navbar-right">
|
|
<li><a href="../../index.html">Home</a></li>
|
|
<li><a href="../../learn/index.html">Learn</a></li>
|
|
<li><a href="../../samples/index.html">Samples</a></li>
|
|
<li><a href="../../intro/index.html">Intro</a></li>
|
|
<li><a href="../../api/index.html" target="api">API</a></li>
|
|
<li><a href="https://www.nwoods.com/components/evalform.htm">Register</a></li>
|
|
<li><a href="../../download.html">Download</a></li>
|
|
<li><a href="https://forum.nwoods.com/c/gojs">Forum</a></li>
|
|
<li><a href="https://www.nwoods.com/contact.html" onclick="ga('send','event','Outbound Link','click','contact');">Contact</a></li>
|
|
<li class="buy"><a href="https://www.nwoods.com/sales/index.html" onclick="ga('send','event','Outbound Link','click','buy');">Buy</a></li>
|
|
<li class="activate"><a href="https://www.nwoods.com/app/activate.aspx?sku=gojs">Activate</a></li>
|
|
</ul>
|
|
</div><!--/.nav-collapse -->
|
|
</div>
|
|
</nav>
|
|
<div class="tsd-page-header">
|
|
<div class="tsd-page-toolbar">
|
|
<div class="container-fluid plr15">
|
|
<div class="table-wrap">
|
|
<div class="table-cell" id="tsd-search" data-index="../assets/js/search.js" data-base="..">
|
|
<div class="field">
|
|
<label for="tsd-search-field" class="tsd-widget search no-caption">Search</label>
|
|
<input id="tsd-search-field" type="text" />
|
|
</div>
|
|
<ul class="results">
|
|
<li class="state loading">Preparing search index...</li>
|
|
<li class="state failure">The search index is not available</li>
|
|
</ul>
|
|
<a href="../index.html" class="title">GoJS API</a>
|
|
</div>
|
|
<div class="table-cell" id="tsd-widgets">
|
|
<div id="tsd-filter">
|
|
<a href="#" class="tsd-widget options no-caption" data-toggle="options">Options</a>
|
|
<div class="tsd-filter-group">
|
|
<div class="tsd-select" id="tsd-filter-visibility">
|
|
<span class="tsd-select-label">All</span>
|
|
<ul class="tsd-select-list">
|
|
<li data-value="public">Public</li>
|
|
<li data-value="protected">Public/Protected</li>
|
|
<li data-value="private" class="selected">All</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<a href="#" class="tsd-widget menu no-caption" data-toggle="menu">Menu</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tsd-page-title">
|
|
<div class="container-fluid plr15">
|
|
<div class="top-copyright">
|
|
<!--<b>GoJS</b>® Diagramming Components<br/>version <br/>version 2.0.17 for TypeScript/HTML<br/>by <a href="https://www.nwoods.com/">Northwoods Software®</a>-->
|
|
<b>GoJS</b>® Diagramming Components<br/>version 2.0.17<br/>by <a href="https://www.nwoods.com/">Northwoods Software®</a>
|
|
</div>
|
|
<div>
|
|
<h1>Class GraphObject</h1>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
<div class="container-fluid container-main plr15">
|
|
<div class="row">
|
|
<div class="col-8 col-content">
|
|
<section class="tsd-panel tsd-hierarchy">
|
|
<h3>Hierarchy</h3>
|
|
<ul class="tsd-hierarchy">
|
|
<li>
|
|
<span class="target">GraphObject</span>
|
|
<ul class="tsd-hierarchy">
|
|
<li>
|
|
<a href="Panel.html" class="tsd-signature-type">Panel</a>
|
|
</li>
|
|
<li>
|
|
<a href="Shape.html" class="tsd-signature-type">Shape</a>
|
|
</li>
|
|
<li>
|
|
<a href="TextBlock.html" class="tsd-signature-type">TextBlock</a>
|
|
</li>
|
|
<li>
|
|
<a href="Picture.html" class="tsd-signature-type">Picture</a>
|
|
</li>
|
|
<li>
|
|
<a href="Placeholder.html" class="tsd-signature-type">Placeholder</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-comment">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This is the abstract base class for all graphical objects.
|
|
Classes inheriting from GraphObject include:
|
|
<a href="Shape.html">Shape</a>, <a href="TextBlock.html">TextBlock</a>, <a href="Picture.html">Picture</a>, and <a href="Panel.html">Panel</a>.
|
|
From the Panel class the <a href="Part.html">Part</a> class is derived, from which the
|
|
<a href="Node.html">Node</a> and <a href="Link.html">Link</a> classes derive.</p>
|
|
<p>It is very common to make use of the static function <a href="GraphObject.html#static-make">GraphObject.make</a> in order to build up
|
|
a visual tree of GraphObjects. You can see many examples of this throughout the
|
|
Introduction, starting at <a href="../../intro/buildingObjects.html">Building Objects</a>,
|
|
and the Samples, starting with <a href="../../samples/minimal.html">Minimal Sample</a>.</p>
|
|
<p>Since GraphObject is an abstract class, programmers do not create GraphObjects themselves,
|
|
but this class defines many properties used by all kinds of GraphObjects.</p>
|
|
<p>The only visual properties on GraphObject are <a href="GraphObject.html#background">background</a> and <a href="GraphObject.html#areaBackground">areaBackground</a>.
|
|
However one can control whether the GraphObject is drawn at all by setting <a href="GraphObject.html#visible">visible</a>,
|
|
or by setting <a href="GraphObject.html#opacity">opacity</a> to zero if you still want the GraphObject to occupy space.
|
|
Also, if you want to control whether any mouse or touch events "see" the GraphObject,
|
|
you can set <a href="GraphObject.html#pickable">pickable</a> to false.</p>
|
|
<p>For more information about specifying how things get drawn, see the properties on the
|
|
<a href="Shape.html">Shape</a>, <a href="TextBlock.html">TextBlock</a>, and <a href="Picture.html">Picture</a> classes.</p>
|
|
<h3>GraphObject Sizing</h3>
|
|
<p>GraphObject defines most of the properties that cause objects to size themselves differently.
|
|
The most prominent ones include:</p>
|
|
<ul>
|
|
<li>The <a href="GraphObject.html#desiredSize">desiredSize</a>, <a href="GraphObject.html#minSize">minSize</a>, and <a href="GraphObject.html#maxSize">maxSize</a> properties are used to
|
|
explicitly set or limit the size of visual elements. <a href="GraphObject.html#width">width</a> and <a href="GraphObject.html#height">height</a> are
|
|
convenience properties that set the <a href="GraphObject.html#desiredSize">desiredSize</a> width and height, respectively.</li>
|
|
<li>The <a href="GraphObject.html#angle">angle</a> and <a href="GraphObject.html#scale">scale</a> properties are used to transform visual elements.</li>
|
|
<li>The <a href="GraphObject.html#stretch">stretch</a> property determines how a GraphObject will fill its visual space,
|
|
contextually granted to it by its containing <a href="Panel.html">Panel</a>. Top-level (<a href="Part.html">Part</a>)
|
|
GraphObjects are not affected by this property because they are always granted infinite space.</li>
|
|
</ul>
|
|
<p>All GraphObjects in a Diagram are measured and then arranged by their containing <a href="Panel.html">Panel</a>s in a tree-like fashion.
|
|
After measuring and arranging, a GraphObject will have valid values for the read-only
|
|
properties <a href="GraphObject.html#naturalBounds">naturalBounds</a>, <a href="GraphObject.html#measuredBounds">measuredBounds</a>, and <a href="GraphObject.html#actualBounds">actualBounds</a>.</p>
|
|
<ul>
|
|
<li>The <a href="GraphObject.html#naturalBounds">naturalBounds</a> of a GraphObject describe its local size,
|
|
without any transformations (<a href="GraphObject.html#scale">scale</a>, <a href="GraphObject.html#angle">angle</a>) affecting it.</li>
|
|
<li>The <a href="GraphObject.html#measuredBounds">measuredBounds</a> of a GraphObject describe its size within its containing Panel.</li>
|
|
<li>The <a href="GraphObject.html#actualBounds">actualBounds</a> of a GraphObject describe its position and given size inside of its panel.
|
|
This size may be smaller than <a href="GraphObject.html#measuredBounds">measuredBounds</a>, for instance if a GraphObject with a large <a href="GraphObject.html#desiredSize">desiredSize</a>
|
|
is placed in a <a href="Panel.html">Panel</a> of a smaller <a href="GraphObject.html#desiredSize">desiredSize</a>. Smaller <a href="GraphObject.html#actualBounds">actualBounds</a> than <a href="GraphObject.html#measuredBounds">measuredBounds</a>
|
|
typically means an object will be cropped.</li>
|
|
</ul>
|
|
<p class="boxread">
|
|
See <a href="../../intro/sizing.html">the Introduction page on sizing</a>
|
|
for usage information and examples.
|
|
<h3>GraphObject Size and Position within Panel</h3>
|
|
Several GraphObject properties guide the containing <a href="Panel.html">Panel</a> for how to size and position the object within the panel.
|
|
- The <a href="GraphObject.html#alignment">alignment</a> specifies where the object should be relative to some area of the panel.
|
|
For example, an alignment value of <a href="Spot.html#static-BottomRight">Spot.BottomRight</a> means that the GraphObject should be at the bottom-right corner of the panel.
|
|
- The <a href="GraphObject.html#alignmentFocus">alignmentFocus</a> specifies precisely which point of the GraphObject should be aligned at the <a href="GraphObject.html#alignment">alignment</a> spot.
|
|
- The <a href="GraphObject.html#column">column</a> and <a href="GraphObject.html#row">row</a> properties are only used by <a href="Panel.html#static-Table">Panel.Table</a> panels, to indicate where the GraphObject should be.
|
|
- The <a href="GraphObject.html#columnSpan">columnSpan</a> and <a href="GraphObject.html#rowSpan">rowSpan</a> properties tell the <a href="Panel.html#static-Table">Panel.Table</a> panel how large the GraphObject should be.
|
|
- The <a href="GraphObject.html#isPanelMain">isPanelMain</a> property indicates to some kinds of <a href="Panel.html">Panel</a>s that the GraphObject is the "primary" object
|
|
that other panel children should be measured with or positioned in.
|
|
- The <a href="GraphObject.html#margin">margin</a> property tells the containing <a href="Panel.html">Panel</a> how much extra space to put around this GraphObject.
|
|
- The <a href="GraphObject.html#position">position</a> property is used to determine the relative position of GraphObjects when they are elements of a <a href="Panel.html#static-Position">Panel.Position</a> panel.
|
|
<p class="boxread">
|
|
See <a href="../../intro/panels.html">the Introduction page on Panels</a>
|
|
and <a href="../../intro/tablePanels.html">Table Panels</a> for an overview of the capabilities.
|
|
<h3>Top-level GraphObjects are Parts</h3>
|
|
<p>A <a href="Part.html">Part</a> is a derived class of GraphObject representing a top-level object.
|
|
All top-level GraphObjects must be Parts, and Node, Link, Group, and Adornment derive from Part.
|
|
The position of a Part determines the point of the Part's top-left corner in document coordinates.
|
|
See also <a href="Part.html#location">Part.location</a>, which supports an way to specify the position based on a different
|
|
spot of a different element within the Part.</p>
|
|
<p>There are several read-only properties that help navigate up the visual tree.</p>
|
|
<ul>
|
|
<li><a href="GraphObject.html#panel">panel</a> returns the <a href="Panel.html">Panel</a> that directly contains this GraphObject</li>
|
|
<li><a href="GraphObject.html#part">part</a> returns the <a href="Part.html">Part</a> that this GraphObject is in, perhaps via intervening Panels;
|
|
this is frequently used in order to get to the model data, <a href="Panel.html#data">Panel.data</a></li>
|
|
<li><a href="GraphObject.html#layer">layer</a> returns the <a href="Layer.html">Layer</a> that this GraphObject's Part is in</li>
|
|
<li><a href="GraphObject.html#diagram">diagram</a> returns the <a href="Diagram.html">Diagram</a> that this GraphObject's Part's Layer is in</li>
|
|
</ul>
|
|
<p class="boxrun">
|
|
See <a href="../../samples/visualTree.html">the Visual Tree sample</a>
|
|
for a diagram displaying the visual tree of a simple diagram.
|
|
<h3>User Interaction</h3>
|
|
<p>GraphObjects have several properties enabling dynamic customizable interaction.
|
|
There are several definable functions that execute on input events: <a href="GraphObject.html#mouseDragEnter">mouseDragEnter</a>,
|
|
<a href="GraphObject.html#mouseDragLeave">mouseDragLeave</a>, <a href="GraphObject.html#mouseDrop">mouseDrop</a>, <a href="GraphObject.html#mouseEnter">mouseEnter</a>, <a href="GraphObject.html#mouseHold">mouseHold</a>,
|
|
<a href="GraphObject.html#mouseHover">mouseHover</a>, <a href="GraphObject.html#mouseLeave">mouseLeave</a>, and <a href="GraphObject.html#mouseOver">mouseOver</a>.
|
|
For example, you could define mouse enter-and-leave event handlers to modify the appearance of a link
|
|
as the mouse passes over it:</p>
|
|
<pre><code class="hljs js">myDiagram.linkTemplate =
|
|
$(go.Link,
|
|
$(go.Shape,
|
|
{ <span class="hljs-attr">strokeWidth</span>: <span class="hljs-number">2</span>, <span class="hljs-attr">stroke</span>: <span class="hljs-string">"gray"</span> }, <span class="hljs-comment">// default color is "gray"</span>
|
|
{ <span class="hljs-comment">// here E is the InputEvent and OBJ is this Shape</span>
|
|
mouseEnter: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">e, obj</span>) </span>{ obj.strokeWidth = <span class="hljs-number">4</span>; obj.stroke = <span class="hljs-string">"dodgerblue"</span>; },
|
|
<span class="hljs-attr">mouseLeave</span>: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">e, obj</span>) </span>{ obj.strokeWidth = <span class="hljs-number">2</span>; obj.stroke = <span class="hljs-string">"gray"</span>; }
|
|
}));</code></pre>
|
|
<p>There are <a href="GraphObject.html#click">click</a>, <a href="GraphObject.html#doubleClick">doubleClick</a>, and <a href="GraphObject.html#contextClick">contextClick</a> functions
|
|
that execute when a user appropriately clicks the GraphObject.
|
|
These click functions are called with the <a href="InputEvent.html">InputEvent</a> as the first argument
|
|
and this GraphObject as the second argument.
|
|
For example, you could define a click event handler on a Node that goes to another page:</p>
|
|
<pre><code class="hljs js">myDiagram.nodeTemplate =
|
|
$(go.Node, <span class="hljs-string">"Auto"</span>,
|
|
$(go.Shape, <span class="hljs-string">"RoundedRectangle"</span>,
|
|
<span class="hljs-keyword">new</span> go.Binding(<span class="hljs-string">"fill"</span>, <span class="hljs-string">"color"</span>)),
|
|
$(go.TextBlock,
|
|
{ <span class="hljs-attr">name</span>: <span class="hljs-string">"TB"</span>, <span class="hljs-attr">margin</span>: <span class="hljs-number">3</span> },
|
|
<span class="hljs-keyword">new</span> go.Binding(<span class="hljs-string">"text"</span>, <span class="hljs-string">"key"</span>)),
|
|
{ <span class="hljs-comment">// second arg will be this GraphObject, which in this case is the Node itself:</span>
|
|
click: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">e, node</span>) </span>{
|
|
<span class="hljs-built_in">window</span>.open(<span class="hljs-string">"https://en.wikipedia.org/Wiki/"</span> + node.data.key);
|
|
}
|
|
});</code></pre>
|
|
<p>Note: you may prefer defining <a href="DiagramEvent.html">DiagramEvent</a> listeners on the <a href="Diagram.html">Diagram</a>
|
|
rather than on individual GraphObjects. DiagramEvents also include more general events that
|
|
do not necessarily correspond to input events.</p>
|
|
<p>The properties <a href="GraphObject.html#actionCancel">actionCancel</a>, <a href="GraphObject.html#actionDown">actionDown</a>, <a href="GraphObject.html#actionMove">actionMove</a>,
|
|
and <a href="GraphObject.html#actionUp">actionUp</a> define functions to execute when the GraphObject's <a href="GraphObject.html#isActionable">isActionable</a> property
|
|
is set to true (default false). See the <a href="ActionTool.html">ActionTool</a> for more detail.</p>
|
|
<p class="boxread">
|
|
See <a href="../../intro/events.html">the Introduction page on Events</a> for a more general discussion.
|
|
<h3>GraphObjects as Ports</h3>
|
|
<p>In GoJS, <a href="Link.html">Link</a>s can only connect to elements within a <a href="Node.html">Node</a>
|
|
that are specified as "ports", and by default the only port is the Node itself.
|
|
Setting the <a href="GraphObject.html#portId">portId</a> of a GraphObject inside a Node allows that object to act as a port.
|
|
Note: the only kind of model that can save which port a link is connected with, i.e. portIds that are not an empty string,
|
|
is a <a href="GraphLinksModel.html">GraphLinksModel</a> whose <a href="GraphLinksModel.html#linkFromPortIdProperty">GraphLinksModel.linkFromPortIdProperty</a> and
|
|
<a href="GraphLinksModel.html#linkToPortIdProperty">GraphLinksModel.linkToPortIdProperty</a> have been set to name properties on the link data objects.</p>
|
|
<p>GraphObjects have several properties that are only relevant when they are acting as ports.
|
|
These port-related properties are:</p>
|
|
<ul>
|
|
<li><a href="GraphObject.html#portId">portId</a>, which must be set to a string that is unique within the <a href="Node.html">Node</a>,
|
|
in order for this GraphObject to be treated as a "port", rather than the whole node</li>
|
|
<li><a href="GraphObject.html#fromSpot">fromSpot</a> and <a href="GraphObject.html#toSpot">toSpot</a>, where a link should connect with this port</li>
|
|
<li><a href="GraphObject.html#fromEndSegmentLength">fromEndSegmentLength</a> and <a href="GraphObject.html#toEndSegmentLength">toEndSegmentLength</a>, the length of the link segment adjacent to this port</li>
|
|
<li><a href="GraphObject.html#fromShortLength">fromShortLength</a> and <a href="GraphObject.html#toShortLength">toShortLength</a>, the distance the link should terminate before touching this port</li>
|
|
<li><a href="GraphObject.html#fromLinkable">fromLinkable</a> and <a href="GraphObject.html#toLinkable">toLinkable</a>, whether the user may draw links connecting with this port</li>
|
|
<li><a href="GraphObject.html#fromLinkableDuplicates">fromLinkableDuplicates</a> and <a href="GraphObject.html#toLinkableDuplicates">toLinkableDuplicates</a>, whether the user may draw multiple links between the same pair of ports</li>
|
|
<li><a href="GraphObject.html#fromLinkableSelfNode">fromLinkableSelfNode</a> and <a href="GraphObject.html#toLinkableSelfNode">toLinkableSelfNode</a>, whether the user may draw a link between ports on the same node</li>
|
|
<li><a href="GraphObject.html#fromMaxLinks">fromMaxLinks</a> and <a href="GraphObject.html#toMaxLinks">toMaxLinks</a>, to limit the number of links connecting with this port in a particular direction</li>
|
|
</ul>
|
|
<p class="boxread">
|
|
See <a href="../../intro/ports.html">the Introduction page on ports</a>
|
|
and <a href="../../intro/links.html">link routing</a>
|
|
and <a href="../../intro/connectionPoints.html">link connection points</a>
|
|
for port usage information and examples.
|
|
<h3>GraphObjects as labels on a Link</h3>
|
|
<p>GraphObjects can also be used as "labels" on a <a href="Link.html">Link</a>.
|
|
In addition to the <a href="GraphObject.html#alignmentFocus">alignmentFocus</a> property, these properties direct a Link Panel
|
|
to position a "label" at a particular point along the route of the link, in a particular manner:</p>
|
|
<ul>
|
|
<li><a href="GraphObject.html#segmentIndex">segmentIndex</a>, which segment the label should be on</li>
|
|
<li><a href="GraphObject.html#segmentFraction">segmentFraction</a>, how far along the segment the label should be</li>
|
|
<li><a href="GraphObject.html#segmentOffset">segmentOffset</a>, where the label should be positioned relative to the segment</li>
|
|
<li><a href="GraphObject.html#segmentOrientation">segmentOrientation</a>, how the label should be rotated relative to the angle of the segment</li>
|
|
</ul>
|
|
<p class="boxread">
|
|
See <a href="../../intro/linkLabels.html">the Introduction page on link labels</a>
|
|
for examples of how to make use of labels on Links.
|
|
<h3>Interactive Behavior</h3>
|
|
<p>There are several properties that specify fairly high-level interactive behavior:</p>
|
|
<ul>
|
|
<li><a href="GraphObject.html#cursor">cursor</a>, a CSS string specifying a cursor</li>
|
|
<li><a href="GraphObject.html#contextMenu">contextMenu</a>, an <a href="Adornment.html">Adornment</a></li>
|
|
<li><a href="GraphObject.html#toolTip">toolTip</a>, an <a href="Adornment.html">Adornment</a></li>
|
|
</ul>
|
|
<p class="boxread">
|
|
For more information, please read <a href="../../intro/contextMenus.html">the Introduction page about Context Menus</a>
|
|
and <a href="../../intro/toolTips.html">the page about ToolTips</a>.
|
|
<p class="boxrun">
|
|
Also see <a href="../../samples/basic.html">the Basic sample</a>
|
|
for examples of how to show context menus and tooltips.
|
|
</div>
|
|
</section>
|
|
<section class="tsd-panel-group tsd-index-group">
|
|
<h2>Index</h2>
|
|
<section class="tsd-panel tsd-index-panel">
|
|
<div class="tsd-index-content">
|
|
<section class="tsd-index-section ">
|
|
<h3>Constructors</h3>
|
|
<ul class="tsd-index-list">
|
|
<li class="tsd-kind-constructor tsd-parent-kind-class"><a href="GraphObject.html#constructor" class="tsd-kind-icon">constructor</a></li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-index-section ">
|
|
<h3>Properties</h3>
|
|
<ul class="tsd-index-list">
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#actionCancel" class="tsd-kind-icon">action<wbr>Cancel</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#actionDown" class="tsd-kind-icon">action<wbr>Down</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#actionMove" class="tsd-kind-icon">action<wbr>Move</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#actionUp" class="tsd-kind-icon">action<wbr>Up</a></li>
|
|
<li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="GraphObject.html#actualBounds" class="tsd-kind-icon">actual<wbr>Bounds</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#alignment" class="tsd-kind-icon">alignment</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#alignmentFocus" class="tsd-kind-icon">alignment<wbr>Focus</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#angle" class="tsd-kind-icon">angle</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#areaBackground" class="tsd-kind-icon">area<wbr>Background</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#background" class="tsd-kind-icon">background</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#click" class="tsd-kind-icon">click</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#column" class="tsd-kind-icon">column</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#columnSpan" class="tsd-kind-icon">column<wbr>Span</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#contextClick" class="tsd-kind-icon">context<wbr>Click</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#contextMenu" class="tsd-kind-icon">context<wbr>Menu</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#cursor" class="tsd-kind-icon">cursor</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#desiredSize" class="tsd-kind-icon">desired<wbr>Size</a></li>
|
|
<li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="GraphObject.html#diagram" class="tsd-kind-icon">diagram</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#doubleClick" class="tsd-kind-icon">double<wbr>Click</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#enabledChanged" class="tsd-kind-icon">enabled<wbr>Changed</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#fromEndSegmentLength" class="tsd-kind-icon">from<wbr>End<wbr>Segment<wbr>Length</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#fromLinkable" class="tsd-kind-icon">from<wbr>Linkable</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#fromLinkableDuplicates" class="tsd-kind-icon">from<wbr>Linkable<wbr>Duplicates</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#fromLinkableSelfNode" class="tsd-kind-icon">from<wbr>Linkable<wbr>Self<wbr>Node</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#fromMaxLinks" class="tsd-kind-icon">from<wbr>Max<wbr>Links</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#fromShortLength" class="tsd-kind-icon">from<wbr>Short<wbr>Length</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#fromSpot" class="tsd-kind-icon">from<wbr>Spot</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#height" class="tsd-kind-icon">height</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#isActionable" class="tsd-kind-icon">is<wbr>Actionable</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#isPanelMain" class="tsd-kind-icon">is<wbr>Panel<wbr>Main</a></li>
|
|
<li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="GraphObject.html#layer" class="tsd-kind-icon">layer</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#margin" class="tsd-kind-icon">margin</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#maxSize" class="tsd-kind-icon">max<wbr>Size</a></li>
|
|
<li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="GraphObject.html#measuredBounds" class="tsd-kind-icon">measured<wbr>Bounds</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#minSize" class="tsd-kind-icon">min<wbr>Size</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseDragEnter" class="tsd-kind-icon">mouse<wbr>Drag<wbr>Enter</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseDragLeave" class="tsd-kind-icon">mouse<wbr>Drag<wbr>Leave</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseDrop" class="tsd-kind-icon">mouse<wbr>Drop</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseEnter" class="tsd-kind-icon">mouse<wbr>Enter</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseHold" class="tsd-kind-icon">mouse<wbr>Hold</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseHover" class="tsd-kind-icon">mouse<wbr>Hover</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseLeave" class="tsd-kind-icon">mouse<wbr>Leave</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseOver" class="tsd-kind-icon">mouse<wbr>Over</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#name" class="tsd-kind-icon">name</a></li>
|
|
<li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="GraphObject.html#naturalBounds" class="tsd-kind-icon">natural<wbr>Bounds</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#opacity" class="tsd-kind-icon">opacity</a></li>
|
|
<li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="GraphObject.html#panel" class="tsd-kind-icon">panel</a></li>
|
|
<li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="GraphObject.html#part" class="tsd-kind-icon">part</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#pickable" class="tsd-kind-icon">pickable</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#portId" class="tsd-kind-icon">port<wbr>Id</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#position" class="tsd-kind-icon">position</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#row" class="tsd-kind-icon">row</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#rowSpan" class="tsd-kind-icon">row<wbr>Span</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#scale" class="tsd-kind-icon">scale</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#segmentFraction" class="tsd-kind-icon">segment<wbr>Fraction</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#segmentIndex" class="tsd-kind-icon">segment<wbr>Index</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#segmentOffset" class="tsd-kind-icon">segment<wbr>Offset</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#segmentOrientation" class="tsd-kind-icon">segment<wbr>Orientation</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#shadowVisible" class="tsd-kind-icon">shadow<wbr>Visible</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#stretch" class="tsd-kind-icon">stretch</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toEndSegmentLength" class="tsd-kind-icon">to<wbr>End<wbr>Segment<wbr>Length</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toLinkable" class="tsd-kind-icon">to<wbr>Linkable</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toLinkableDuplicates" class="tsd-kind-icon">to<wbr>Linkable<wbr>Duplicates</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toLinkableSelfNode" class="tsd-kind-icon">to<wbr>Linkable<wbr>Self<wbr>Node</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toMaxLinks" class="tsd-kind-icon">to<wbr>Max<wbr>Links</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toShortLength" class="tsd-kind-icon">to<wbr>Short<wbr>Length</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toSpot" class="tsd-kind-icon">to<wbr>Spot</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toolTip" class="tsd-kind-icon">tool<wbr>Tip</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#visible" class="tsd-kind-icon">visible</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#width" class="tsd-kind-icon">width</a></li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-index-section ">
|
|
<h3>Methods</h3>
|
|
<ul class="tsd-index-list">
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#bind" class="tsd-kind-icon">bind</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class tsd-is-protected"><a href="GraphObject.html#cloneProtected" class="tsd-kind-icon">clone<wbr>Protected</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#copy" class="tsd-kind-icon">copy</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="GraphObject.html#static-defineBuilder" class="tsd-kind-icon">define<wbr>Builder</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#getDocumentAngle" class="tsd-kind-icon">get<wbr>Document<wbr>Angle</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#getDocumentBounds" class="tsd-kind-icon">get<wbr>Document<wbr>Bounds</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#getDocumentPoint" class="tsd-kind-icon">get<wbr>Document<wbr>Point</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#getDocumentScale" class="tsd-kind-icon">get<wbr>Document<wbr>Scale</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#getLocalPoint" class="tsd-kind-icon">get<wbr>Local<wbr>Point</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#isContainedBy" class="tsd-kind-icon">is<wbr>Contained<wbr>By</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#isEnabledObject" class="tsd-kind-icon">is<wbr>Enabled<wbr>Object</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#isVisibleObject" class="tsd-kind-icon">is<wbr>Visible<wbr>Object</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static"><a href="GraphObject.html#static-make" class="tsd-kind-icon">make</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#setProperties" class="tsd-kind-icon">set<wbr>Properties</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="GraphObject.html#static-takeBuilderArgument" class="tsd-kind-icon">take<wbr>Builder<wbr>Argument</a></li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-index-section ">
|
|
<h3>Constants</h3>
|
|
<ul class="tsd-index-list">
|
|
<li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="GraphObject.html#static-Default" class="tsd-kind-icon">Default</a></li>
|
|
<li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="GraphObject.html#static-Fill" class="tsd-kind-icon">Fill</a></li>
|
|
<li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="GraphObject.html#static-FlipBoth" class="tsd-kind-icon">Flip<wbr>Both</a></li>
|
|
<li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="GraphObject.html#static-FlipHorizontal" class="tsd-kind-icon">Flip<wbr>Horizontal</a></li>
|
|
<li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="GraphObject.html#static-FlipVertical" class="tsd-kind-icon">Flip<wbr>Vertical</a></li>
|
|
<li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="GraphObject.html#static-Horizontal" class="tsd-kind-icon">Horizontal</a></li>
|
|
<li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="GraphObject.html#static-None" class="tsd-kind-icon">None</a></li>
|
|
<li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="GraphObject.html#static-Uniform" class="tsd-kind-icon">Uniform</a></li>
|
|
<li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="GraphObject.html#static-UniformToFill" class="tsd-kind-icon">Uniform<wbr>ToFill</a></li>
|
|
<li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="GraphObject.html#static-Vertical" class="tsd-kind-icon">Vertical</a></li>
|
|
</ul>
|
|
</section>
|
|
</div>
|
|
</section>
|
|
</section>
|
|
<section class="tsd-panel-group tsd-member-group ">
|
|
<h2>Constructors</h2>
|
|
<section class="tsd-panel tsd-member tsd-kind-constructor tsd-parent-kind-class">
|
|
<a name="constructor" class="tsd-anchor"></a>
|
|
<h3>
|
|
constructor
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-constructor tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">new <wbr>Graph<wbr>Object<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This is an abstract class, so you should not use this constructor.</p>
|
|
</div>
|
|
<h4 class="tsd-returns-title">Returns <a href="GraphObject.html" class="tsd-signature-type">GraphObject</a></h4>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
</section>
|
|
<section class="tsd-panel-group tsd-member-group ">
|
|
<h2>Properties</h2>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="actionCancel" class="tsd-anchor"></a>
|
|
<h3>
|
|
action<wbr>Cancel
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute when the <a href="ActionTool.html">ActionTool</a> is cancelled and this GraphObject's <a href="GraphObject.html#isActionable">isActionable</a>
|
|
is set to true.
|
|
This property is infrequently set.
|
|
By default this property is null.</p>
|
|
<p>This functional property is only set on objects such as buttons, knobs, or sliders that want to handle all events,
|
|
in conjunction with <a href="ActionTool.html">ActionTool</a>, pre-empting the normal tool mechanisms.</p>
|
|
<p>The <a href="ActionTool.html">ActionTool</a> does not conduct any transaction, so if this property has a value,
|
|
the function will not be called within a transaction.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#actionDown">actionDown</a>, <a href="GraphObject.html#actionMove">actionMove</a>, <a href="GraphObject.html#actionUp">actionUp</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="actionDown" class="tsd-anchor"></a>
|
|
<h3>
|
|
action<wbr>Down
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute on a mouse-down event when this GraphObject's <a href="GraphObject.html#isActionable">isActionable</a>
|
|
is set to true.
|
|
This property is infrequently set.
|
|
By default this property is null.</p>
|
|
<p>This functional property is only set on objects such as buttons, knobs, or sliders that want to handle all events,
|
|
in conjunction with <a href="ActionTool.html">ActionTool</a>, pre-empting the normal tool mechanisms.</p>
|
|
<p>The <a href="ActionTool.html">ActionTool</a> does not conduct any transaction, so if this property has a value,
|
|
the function will not be called within a transaction.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#actionMove">actionMove</a>, <a href="GraphObject.html#actionUp">actionUp</a>, <a href="GraphObject.html#actionCancel">actionCancel</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="actionMove" class="tsd-anchor"></a>
|
|
<h3>
|
|
action<wbr>Move
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute on a mouse-move event when this GraphObject's <a href="GraphObject.html#isActionable">isActionable</a>
|
|
is set to true.
|
|
This property is infrequently set.
|
|
By default this property is null.</p>
|
|
<p>This functional property is only set on objects such as buttons, knobs, or sliders that want to handle all events,
|
|
in conjunction with <a href="ActionTool.html">ActionTool</a>, pre-empting the normal tool mechanisms.</p>
|
|
<p>The <a href="ActionTool.html">ActionTool</a> does not conduct any transaction, so if this property has a value,
|
|
the function will not be called within a transaction.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#actionDown">actionDown</a>, <a href="GraphObject.html#actionUp">actionUp</a>, <a href="GraphObject.html#actionCancel">actionCancel</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="actionUp" class="tsd-anchor"></a>
|
|
<h3>
|
|
action<wbr>Up
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute on a mouse-up event when this GraphObject's <a href="GraphObject.html#isActionable">isActionable</a>
|
|
is set to true.
|
|
This property is infrequently set.
|
|
By default this property is null.</p>
|
|
<p>This functional property is only set on objects such as buttons, knobs, or sliders that want to handle all events,
|
|
in conjunction with <a href="ActionTool.html">ActionTool</a>, pre-empting the normal tool mechanisms.</p>
|
|
<p>The <a href="ActionTool.html">ActionTool</a> does not conduct any transaction, so if this property has a value,
|
|
the function will not be called within a transaction.
|
|
If you do provide a function that makes changes to the diagram or to its model,
|
|
you should do so within a transaction -- call <a href="Diagram.html#startTransaction">Diagram.startTransaction</a> and
|
|
<a href="Diagram.html#commitTransaction">Diagram.commitTransaction</a>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#actionDown">actionDown</a>, <a href="GraphObject.html#actionMove">actionMove</a>, <a href="GraphObject.html#actionCancel">actionCancel</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-get-signature tsd-parent-kind-class">
|
|
<a name="actualBounds" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagReadOnly">Read-only</span>
|
|
actual<wbr>Bounds
|
|
<span class="tsd-signature-symbol">: </span><a href="Rect.html" class="tsd-signature-type">Rect</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This read-only property returns the bounds of this GraphObject in container coordinates. This means that
|
|
the actualBounds are in the coordinate space of the GraphObject's <a href="Panel.html">Panel</a>,
|
|
unless this is a <a href="Part.html">Part</a>, in which case they are in
|
|
the <a href="Diagram.html">Diagram</a>'s coordinate system.</p>
|
|
<p>You must not modify any of the properties of the <a href="Rect.html">Rect</a> that is the value of this property.</p>
|
|
<p>If this GraphObject is a Part,
|
|
then the x and y values of the actualBounds are identical to that Part's <a href="GraphObject.html#position">position</a>,
|
|
and the width and height values of the actualBounds represent the rectangular space occupied
|
|
by the Part in <a href="Diagram.html#documentBounds">Diagram.documentBounds</a> coordinates.</p>
|
|
<p>If this GraphObject is not a top-level object (not a <a href="Part.html">Part</a>), then the actualBounds
|
|
x and y values represent that GraphObject's position within its Panel. In a Panel of type <a href="Panel.html#static-Position">Panel.Position</a>
|
|
this is identical to the GraphObject's <a href="GraphObject.html#position">position</a>, but in other cases it is dependent on
|
|
the unique workings of each Panel type. The actualBounds width and height
|
|
of a GraphObject are the final size after the <a href="GraphObject.html#scale">scale</a> and <a href="GraphObject.html#angle">angle</a> are applied.</p>
|
|
<p>It is possible for a GraphObject (be it an GraphObject or a Panel containing several more GraphObjects)
|
|
to have no containing Part, in which case these GraphObjects cannot possibly be in a Diagram.
|
|
These GraphObjects are unlikely to have real-number values for their actualBounds, as they may
|
|
never have had the chance to be measured and arranged.</p>
|
|
<p>As with all read-only properties, using this property as a binding source is unlikely to be useful.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#measuredBounds">measuredBounds</a>, <a href="GraphObject.html#desiredSize">desiredSize</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="alignment" class="tsd-anchor"></a>
|
|
<h3>
|
|
alignment
|
|
<span class="tsd-signature-symbol">: </span><a href="Spot.html" class="tsd-signature-type">Spot</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the alignment <a href="Spot.html">Spot</a> of this GraphObject used in <a href="Panel.html">Panel</a> layouts,
|
|
to determine where in the area allocated by the panel this object should be placed.</p>
|
|
<p>The default value is <a href="Spot.html#static-Default">Spot.Default</a>, which lets the Panel determine the Spot using
|
|
<a href="Panel.html#defaultAlignment">Panel.defaultAlignment</a>. If that property is also <a href="Spot.html#static-Default">Spot.Default</a>,
|
|
then the alignment spot will be different depending on the Panel type.</p>
|
|
<p>The <a href="GraphObject.html#alignmentFocus">alignmentFocus</a> is often used along with this property to specify
|
|
where this object should be positioned in a Panel.</p>
|
|
<p>A <a href="Spot.html#static-Default">Spot.Default</a> is equivalent to Spot.Center in Spot, Auto, Horizontal, and Vertical panels.
|
|
For examples of alignments in different panels, see the <a href="../../intro/panels.html">Introduction page on Panels</a>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#alignmentFocus">alignmentFocus</a>, <a href="Panel.html#defaultAlignment">Panel.defaultAlignment</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="alignmentFocus" class="tsd-anchor"></a>
|
|
<h3>
|
|
alignment<wbr>Focus
|
|
<span class="tsd-signature-symbol">: </span><a href="Spot.html" class="tsd-signature-type">Spot</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the spot on this GraphObject to be used as the alignment point
|
|
in Spot and Fixed <a href="Panel.html">Panel</a>s.
|
|
Value must be of the Spot.</p>
|
|
<p>The default value is <a href="Spot.html#static-Default">Spot.Default</a>, which means that the Panel type can decide the effective alignment spot.</p>
|
|
<p>The <a href="GraphObject.html#alignment">alignment</a> is often used along with this property to specify
|
|
where this object should be positioned in a Panel.</p>
|
|
<p>For <a href="Panel.html#static-Graduated">Panel.Graduated</a>, the alignmentFocus spot determines the spot on a child element to be aligned with some
|
|
point along the main element.</p>
|
|
<p>When you want a link label Node to be positioned by its location spot rather than by this alignmentFocus spot,
|
|
you can set this property to <a href="Spot.html#static-None">Spot.None</a>, only on <a href="Node.html">Node</a>s.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="Panel.html#alignmentFocusName">Panel.alignmentFocusName</a></p>
|
|
<p>For examples of alignments in different panels, see the <a href="../../intro/panels.html">Introduction page on Panels</a>.</p>
|
|
<p>WARNING: Since 2.0, for Spot Panels, the offsetX/offsetY of <a href="GraphObject.html#alignmentFocus">alignmentFocus</a> has been reversed.
|
|
The offsetX/Y now describes offset distance from the alignmentFocus point to the alignment point, rather than the opposite.
|
|
This is what it has always described when using <a href="GraphObject.html#alignmentFocus">alignmentFocus</a> with Link Labels.</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="angle" class="tsd-anchor"></a>
|
|
<h3>
|
|
angle
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the angle transform, in degrees, of this GraphObject.
|
|
Value must be a number. If the value is not between (0 <= value < 360),
|
|
it will be normalized to be in that range.
|
|
Zero is along the positive X-axis (rightwards); 90 is along the positive Y-axis (downwards).
|
|
Default is 0.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#scale">scale</a>, <a href="GraphObject.html#stretch">stretch</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="areaBackground" class="tsd-anchor"></a>
|
|
<h3>
|
|
area<wbr>Background
|
|
<span class="tsd-signature-symbol">: </span><a href="../index.html#BrushLike" class="tsd-signature-type">BrushLike</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the areaBackground Brush of this GraphObject.
|
|
The areaBackground fills the rectangle described by this GraphObject's containing panel's coordinates.
|
|
If the object is rotated, the area background will expand to fill the entire measured bounds of the object,
|
|
without rotating the brush.</p>
|
|
<p>The value may be either a <a href="Brush.html">Brush</a> object or a string that is a CSS color.
|
|
The default value is null -- no area background is drawn.
|
|
More information about the syntax of CSS color strings is available at:
|
|
<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/color">CSS colors (mozilla.org)</a>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#background">background</a>, <a href="Shape.html#fill">Shape.fill</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="background" class="tsd-anchor"></a>
|
|
<h3>
|
|
background
|
|
<span class="tsd-signature-symbol">: </span><a href="../index.html#BrushLike" class="tsd-signature-type">BrushLike</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the background Brush of this GraphObject,
|
|
filling the rectangle of this object's local coordinate space.
|
|
If the object is rotated, the background will rotate with it.</p>
|
|
<p>The value may be either a <a href="Brush.html">Brush</a> object or a string that is a CSS color.
|
|
The default value is null -- no background is drawn.
|
|
More information about the syntax of CSS color strings is available at:
|
|
<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/color">CSS colors (mozilla.org)</a>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#areaBackground">areaBackground</a>, <a href="Shape.html#fill">Shape.fill</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="click" class="tsd-anchor"></a>
|
|
<h3>
|
|
click
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute when the user single-primary-clicks on this object.
|
|
This typically involves a mouse-down followed by a prompt mouse-up
|
|
at approximately the same position using the left (primary) mouse button.
|
|
This property is used by the <a href="ClickSelectingTool.html">ClickSelectingTool</a>
|
|
when the user clicks on a <a href="GraphObject.html">GraphObject</a>.
|
|
The function is called in addition to the <a href="DiagramEvent.html">DiagramEvent</a>
|
|
that is raised with the name <code>"ObjectSingleClicked"</code>.</p>
|
|
<p>If this property value is a function, it is called with an <a href="InputEvent.html">InputEvent</a>
|
|
and this <a href="GraphObject.html">GraphObject</a>.
|
|
The <a href="InputEvent.html#targetObject">InputEvent.targetObject</a> provides the GraphObject that was found
|
|
at the mouse point before looking up the visual tree of <a href="GraphObject.html#panel">GraphObject.panel</a>s
|
|
to get to this object.</p>
|
|
<p>From the second argument, <em>obj</em>, you can get to the Node or Link via the <a href="GraphObject.html#part">part</a> property.
|
|
From there you can access the bound data via the <a href="Panel.html#data">Panel.data</a> property.
|
|
So from an event handler you can get the bound data by <code>obj.part.data</code>.</p>
|
|
<p>By default this property is null.</p>
|
|
<p>Objects in Layers that are <a href="Layer.html#isTemporary">Layer.isTemporary</a> do not receive click events.
|
|
If you do want such objects to respond to clicks, set <a href="GraphObject.html#isActionable">isActionable</a> to true.</p>
|
|
<p>If you do provide a function that makes changes to the diagram or to its model,
|
|
you should do so within a transaction -- call <a href="Diagram.html#startTransaction">Diagram.startTransaction</a> and
|
|
<a href="Diagram.html#commitTransaction">Diagram.commitTransaction</a>.</p>
|
|
<p class="boxrun">
|
|
An example of a click event handler is shown in the
|
|
<a href="../../samples/arrowheads.html">Arrowheads sample</a>.
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#doubleClick">doubleClick</a>, <a href="GraphObject.html#contextClick">contextClick</a>, <a href="Diagram.html#click">Diagram.click</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="column" class="tsd-anchor"></a>
|
|
<h3>
|
|
column
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the column of this GraphObject if it is in a Table <a href="Panel.html">Panel</a>.
|
|
The value must be a small non-negative integer. The default is 0.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="columnSpan" class="tsd-anchor"></a>
|
|
<h3>
|
|
column<wbr>Span
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the number of columns spanned by this GraphObject if it is in a Table <a href="Panel.html">Panel</a>.
|
|
The value must be a small positive integer. The default is 1.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="contextClick" class="tsd-anchor"></a>
|
|
<h3>
|
|
context<wbr>Click
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute when the user single-secondary-clicks on this object.
|
|
This typically involves a mouse-down followed by a prompt mouse-up
|
|
at approximately the same position using the right (secondary) mouse button.
|
|
This property is used by the <a href="ClickSelectingTool.html">ClickSelectingTool</a>
|
|
when the user clicks on a <a href="GraphObject.html">GraphObject</a>.
|
|
The function is called in addition to the <a href="DiagramEvent.html">DiagramEvent</a>
|
|
that is raised with the name <code>"ObjectContextClicked"</code>.</p>
|
|
<p>If this property value is a function, it is called with an <a href="InputEvent.html">InputEvent</a>
|
|
and this <a href="GraphObject.html">GraphObject</a>.
|
|
The <a href="InputEvent.html#targetObject">InputEvent.targetObject</a> provides the GraphObject that was found
|
|
at the mouse point before looking up the visual tree of <a href="GraphObject.html#panel">GraphObject.panel</a>s
|
|
to get to this object.</p>
|
|
<p>From the second argument, <em>obj</em>, you can get to the Node or Link via the <a href="GraphObject.html#part">part</a> property.
|
|
From there you can access the bound data via the <a href="Panel.html#data">Panel.data</a> property.
|
|
So from an event handler you can get the bound data by <code>obj.part.data</code>.</p>
|
|
<p>By default this property is null.</p>
|
|
<p>Objects in Layers that are <a href="Layer.html#isTemporary">Layer.isTemporary</a> do not receive click events.
|
|
If you do want such objects to respond to clicks, set <a href="GraphObject.html#isActionable">isActionable</a> to true.</p>
|
|
<p>If you do provide a function that makes changes to the diagram or to its model,
|
|
you should do so within a transaction -- call <a href="Diagram.html#startTransaction">Diagram.startTransaction</a> and
|
|
<a href="Diagram.html#commitTransaction">Diagram.commitTransaction</a>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#click">click</a>, <a href="GraphObject.html#doubleClick">doubleClick</a>, <a href="Diagram.html#contextClick">Diagram.contextClick</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="contextMenu" class="tsd-anchor"></a>
|
|
<h3>
|
|
context<wbr>Menu
|
|
<span class="tsd-signature-symbol">: </span><a href="Adornment.html" class="tsd-signature-type">Adornment</a><span class="tsd-signature-symbol"> | </span><a href="HTMLInfo.html" class="tsd-signature-type">HTMLInfo</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This <a href="Adornment.html">Adornment</a> or <a href="HTMLInfo.html">HTMLInfo</a> is shown upon a context click on this object.
|
|
The default value is null, which means no context menu is shown.</p>
|
|
<p>Changing this value will not modify or remove any existing menu that is being shown for this object.</p>
|
|
<p>Context menus may also depend on having the same data binding as the adorned Part
|
|
(i.e. the same value for <a href="Panel.html#data">Panel.data</a>).</p>
|
|
<p>Context menus are not copied by <a href="GraphObject.html#copy">copy</a>, so that context menus may be shared by all instances of a template.</p>
|
|
<p>A typical context menu is implemented as an Adornment with several buttons in it.
|
|
For example, this context menu is defined in the
|
|
<a href="../../samples/dynamicPorts.html">Dynamic Port sample</a>:</p>
|
|
<pre><code class="hljs js"><span class="hljs-keyword">var</span> nodeMenu = <span class="hljs-comment">// context menu for each Node</span>
|
|
$(<span class="hljs-string">"ContextMenu"</span>,
|
|
$(<span class="hljs-string">"ContextMenuButton"</span>,
|
|
$(go.TextBlock, <span class="hljs-string">"Add top port"</span>),
|
|
{ <span class="hljs-attr">click</span>: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">e, obj</span>) </span>{ addPort(<span class="hljs-string">"top"</span>); } }),
|
|
$(<span class="hljs-string">"ContextMenuButton"</span>,
|
|
$(go.TextBlock, <span class="hljs-string">"Add left port"</span>),
|
|
{ <span class="hljs-attr">click</span>: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">e, obj</span>) </span>{ addPort(<span class="hljs-string">"left"</span>); } }),
|
|
$(<span class="hljs-string">"ContextMenuButton"</span>,
|
|
$(go.TextBlock, <span class="hljs-string">"Add right port"</span>),
|
|
{ <span class="hljs-attr">click</span>: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">e, obj</span>) </span>{ addPort(<span class="hljs-string">"right"</span>); } }),
|
|
$(<span class="hljs-string">"ContextMenuButton"</span>,
|
|
$(go.TextBlock, <span class="hljs-string">"Add bottom port"</span>),
|
|
{ <span class="hljs-attr">click</span>: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">e, obj</span>) </span>{ addPort(<span class="hljs-string">"bottom"</span>); } }));</code></pre>
|
|
<p>and is used in the node template:</p>
|
|
<pre><code class="hljs js">myDiagram.nodeTemplate =
|
|
$(go.Node, <span class="hljs-string">"Table"</span>,
|
|
{ . . .
|
|
contextMenu: nodeMenu
|
|
},
|
|
. . .);</code></pre>
|
|
<p>Context menus are normally positioned by <a href="ContextMenuTool.html#positionContextMenu">ContextMenuTool.positionContextMenu</a>.
|
|
However, if there is a <a href="Placeholder.html">Placeholder</a> in the context menu, the context menu (i.e. an Adornment)
|
|
will be positioned so that the Placeholder is at the same position as this adorned GraphObject.</p>
|
|
<p>The <a href="../../samples/basic.html">Basic sample</a> also shows how
|
|
to make context menu items invisible when the command is disabled.</p>
|
|
<p>Replacing this value will not modify or remove any existing context menu that is being shown for this object.</p>
|
|
<p>Read more about context menus at <a href="../../intro/contextMenus.html">Context Menus</a>.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="cursor" class="tsd-anchor"></a>
|
|
<h3>
|
|
cursor
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the mouse cursor to use when the mouse is over this object with no mouse buttons pressed.
|
|
The value is null when no particular cursor is specified for this object;
|
|
the actual cursor is determined by any containing <a href="Panel.html">Panel</a>.</p>
|
|
<p>The default value is the empty string, which means the
|
|
current mouse cursor is determined by the Diagram.
|
|
Other strings should be valid CSS strings that specify a cursor.
|
|
This provides some more information about cursor syntax:
|
|
<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/cursor">CSS cursors (mozilla.org)</a>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="Diagram.html#defaultCursor">Diagram.defaultCursor</a>, <a href="Diagram.html#currentCursor">Diagram.currentCursor</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="desiredSize" class="tsd-anchor"></a>
|
|
<h3>
|
|
desired<wbr>Size
|
|
<span class="tsd-signature-symbol">: </span><a href="Size.html" class="tsd-signature-type">Size</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the desired size of this GraphObject in local coordinates.
|
|
Value must be of type <a href="Size.html">Size</a>.
|
|
Default is Size(NaN, NaN).
|
|
You cannot modify the width or height of the value of this property --
|
|
if you want to change the desiredSize you must set this property to a different Size.</p>
|
|
<p>Getting or setting <a href="GraphObject.html#width">width</a> or <a href="GraphObject.html#height">height</a> is equivalent to getting or setting the
|
|
width or height of this property.</p>
|
|
<p>The size does not include any transformation due to <a href="GraphObject.html#scale">scale</a> or <a href="GraphObject.html#angle">angle</a>,
|
|
nor any pen thickness due to <a href="Shape.html#strokeWidth">Shape.strokeWidth</a> if this is a <a href="Shape.html">Shape</a>.
|
|
If there is a containing <a href="Panel.html">Panel</a> the Panel will determine the actual size.
|
|
If the desiredSize is greater than the allowed size that the GraphObject's Panel determines,
|
|
then the GraphObject may be visually clipped. If the desiredSize does not meet the constraints
|
|
of <a href="GraphObject.html#minSize">minSize</a> and <a href="GraphObject.html#maxSize">maxSize</a>, the GraphObject will be resized to meet them.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#minSize">minSize</a>, <a href="GraphObject.html#maxSize">maxSize</a>, <a href="GraphObject.html#naturalBounds">naturalBounds</a>, <a href="GraphObject.html#measuredBounds">measuredBounds</a>, <a href="GraphObject.html#actualBounds">actualBounds</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-get-signature tsd-parent-kind-class">
|
|
<a name="diagram" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagReadOnly">Read-only</span>
|
|
diagram
|
|
<span class="tsd-signature-symbol">: </span><a href="Diagram.html" class="tsd-signature-type">Diagram</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This read-only property returns the <a href="Diagram.html">Diagram</a> that this GraphObject is in, if it is.</p>
|
|
<p>This property is not settable.
|
|
Although you cannot add any plain GraphObject to a Diagram, you can call <a href="Diagram.html#add">Diagram.add</a>
|
|
to add a <a href="Part.html">Part</a> to a Diagram.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="doubleClick" class="tsd-anchor"></a>
|
|
<h3>
|
|
double<wbr>Click
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute when the user double-primary-clicks on this object.
|
|
This typically involves a mouse-down/up/down/up in rapid succession
|
|
at approximately the same position using the left (primary) mouse button.
|
|
This property is used by the <a href="ClickSelectingTool.html">ClickSelectingTool</a>
|
|
when the user clicks on a <a href="GraphObject.html">GraphObject</a>.
|
|
The function is called in addition to the <a href="DiagramEvent.html">DiagramEvent</a>
|
|
that is raised with the name <code>"ObjectDoubleClicked"</code>.</p>
|
|
<p>If this property value is a function, it is called with an <a href="InputEvent.html">InputEvent</a>
|
|
and this <a href="GraphObject.html">GraphObject</a>.
|
|
The <a href="InputEvent.html#targetObject">InputEvent.targetObject</a> provides the GraphObject that was found
|
|
at the mouse point before looking up the visual tree of <a href="GraphObject.html#panel">GraphObject.panel</a>s
|
|
to get to this object.</p>
|
|
<p>From the second argument, <em>obj</em>, you can get to the Node or Link via the <a href="GraphObject.html#part">part</a> property.
|
|
From there you can access the bound data via the <a href="Panel.html#data">Panel.data</a> property.
|
|
So from an event handler you can get the bound data by <code>obj.part.data</code>.</p>
|
|
<p>By default this property is null.</p>
|
|
<p>Objects in Layers that are <a href="Layer.html#isTemporary">Layer.isTemporary</a> do not receive click events.
|
|
If you do want such objects to respond to clicks, set <a href="GraphObject.html#isActionable">isActionable</a> to true.</p>
|
|
<p>If you do provide a function that makes changes to the diagram or to its model,
|
|
you should do so within a transaction -- call <a href="Diagram.html#startTransaction">Diagram.startTransaction</a> and
|
|
<a href="Diagram.html#commitTransaction">Diagram.commitTransaction</a>.</p>
|
|
<p>The <a href="../../samples/classHierarchy.html">Class Hierarchy sample</a>
|
|
demonstrates the definition of a double-click event handler that opens up
|
|
a web page with the documentation for that class:</p>
|
|
<pre><code class="hljs js">diagram.nodeTemplate =
|
|
$(go.Node, . . .,
|
|
{
|
|
<span class="hljs-attr">doubleClick</span>: <span class="hljs-comment">// here the second argument is this object, which is this Node</span>
|
|
<span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">e, node</span>) </span>{ <span class="hljs-built_in">window</span>.open(<span class="hljs-string">"../api/symbols/"</span> + node.data.key + <span class="hljs-string">".html"</span>); }
|
|
},
|
|
. . .
|
|
);</code></pre>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#click">click</a>, <a href="GraphObject.html#contextClick">contextClick</a>, <a href="Diagram.html#doubleClick">Diagram.doubleClick</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="enabledChanged" class="tsd-anchor"></a>
|
|
<h3>
|
|
enabled<wbr>Changed
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">enabled</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute when some containing Panel changes the value of <a href="Panel.html#isEnabled">Panel.isEnabled</a>.
|
|
It is typically used to modify the appearance of the object.
|
|
This function must not change the value of any panel <a href="Panel.html#isEnabled">Panel.isEnabled</a>.</p>
|
|
<p>If this property value is a function, it is called with two arguments,
|
|
this <a href="GraphObject.html">GraphObject</a> and the new value.
|
|
By default this property is null -- no function is called.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#isEnabledObject">isEnabledObject</a>, <a href="Panel.html#isEnabled">Panel.isEnabled</a></p>
|
|
</dd>
|
|
<dt>since</dt>
|
|
<dd><p>1.7</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="fromEndSegmentLength" class="tsd-anchor"></a>
|
|
<h3>
|
|
from<wbr>End<wbr>Segment<wbr>Length
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the length of the first segment of a link coming from this port.
|
|
This value is used when the computed "from spot" is not <a href="Spot.html#static-None">Spot.None</a>.
|
|
The default value is 10.
|
|
This value also limits how short the <a href="Link.html#fromShortLength">Link.fromShortLength</a> may be drawn.</p>
|
|
<p>The value of <a href="Link.html#fromEndSegmentLength">Link.fromEndSegmentLength</a>, if not NaN, takes precedence over the value at this port
|
|
when determining the route of the link.</p>
|
|
<p>For examples of how to use this property, see <a href="../../intro/links.html#EndSegmentLengths">Link End Segment Lengths</a>.</p>
|
|
<p>You must set this property on a GraphObject whose <a href="GraphObject.html#portId">portId</a> is non-null,
|
|
unless the whole <a href="Node.html">Node</a> is acting as a single port,
|
|
in which case this property should be set on the Node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="Link.html#fromEndSegmentLength">Link.fromEndSegmentLength</a>, <a href="Link.html#computeEndSegmentLength">Link.computeEndSegmentLength</a>, <a href="GraphObject.html#toEndSegmentLength">toEndSegmentLength</a>, <a href="GraphObject.html#portId">portId</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="fromLinkable" class="tsd-anchor"></a>
|
|
<h3>
|
|
from<wbr>Linkable
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets whether the user may draw Links from this port.
|
|
This property is used by <a href="LinkingBaseTool.html#isValidFrom">LinkingBaseTool.isValidFrom</a>.</p>
|
|
<p>The default value is null, which indicates that the real value is inherited from
|
|
the parent <a href="Panel.html">Panel</a>, or false if there is no containing panel.</p>
|
|
<p>You must set this property on a GraphObject whose <a href="GraphObject.html#portId">portId</a> is non-null,
|
|
unless the whole <a href="Node.html">Node</a> is acting as a single port,
|
|
in which case this property should be set on the Node,
|
|
or unless you are disabling the "linkability" of a particular GraphObject
|
|
inside a Panel whose fromLinkable has been set or bound to true.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#toLinkable">toLinkable</a>, <a href="GraphObject.html#fromMaxLinks">fromMaxLinks</a>, <a href="GraphObject.html#portId">portId</a>, <a href="GraphObject.html#cursor">cursor</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="fromLinkableDuplicates" class="tsd-anchor"></a>
|
|
<h3>
|
|
from<wbr>Linkable<wbr>Duplicates
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets whether the user may draw duplicate Links from this port.
|
|
This property is used by <a href="LinkingBaseTool.html#isValidLink">LinkingBaseTool.isValidLink</a>.
|
|
The default value is false.</p>
|
|
<p>You must set this property on a GraphObject whose <a href="GraphObject.html#portId">portId</a> is non-null,
|
|
unless the whole <a href="Node.html">Node</a> is acting as a single port,
|
|
in which case this property should be set on the Node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#fromLinkable">fromLinkable</a>, <a href="GraphObject.html#fromLinkableSelfNode">fromLinkableSelfNode</a>, <a href="GraphObject.html#toLinkableDuplicates">toLinkableDuplicates</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="fromLinkableSelfNode" class="tsd-anchor"></a>
|
|
<h3>
|
|
from<wbr>Linkable<wbr>Self<wbr>Node
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets whether the user may draw Links that connect from this port's Node.
|
|
This property is used by <a href="LinkingBaseTool.html#isValidLink">LinkingBaseTool.isValidLink</a>.
|
|
The default value is false.</p>
|
|
<p>You must set this property on a GraphObject whose <a href="GraphObject.html#portId">portId</a> is non-null,
|
|
unless the whole <a href="Node.html">Node</a> is acting as a single port,
|
|
in which case this property should be set on the Node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#fromLinkable">fromLinkable</a>, <a href="GraphObject.html#fromLinkableDuplicates">fromLinkableDuplicates</a>, <a href="GraphObject.html#toLinkableSelfNode">toLinkableSelfNode</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="fromMaxLinks" class="tsd-anchor"></a>
|
|
<h3>
|
|
from<wbr>Max<wbr>Links
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the maximum number of links that may come out of this port.
|
|
This property is used by <a href="LinkingBaseTool.html#isValidFrom">LinkingBaseTool.isValidFrom</a>.</p>
|
|
<p>The value must be non-negative.
|
|
The default value is Infinity.</p>
|
|
<p>You must set this property on a GraphObject whose <a href="GraphObject.html#portId">portId</a> is non-null,
|
|
unless the whole <a href="Node.html">Node</a> is acting as a single port,
|
|
in which case this property should be set on the Node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#fromLinkable">fromLinkable</a>, <a href="GraphObject.html#toMaxLinks">toMaxLinks</a>, <a href="GraphObject.html#portId">portId</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="fromShortLength" class="tsd-anchor"></a>
|
|
<h3>
|
|
from<wbr>Short<wbr>Length
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets how far the end segment of a link coming from this port stops short of the actual port.
|
|
Positive values are limited by the <a href="GraphObject.html#fromEndSegmentLength">fromEndSegmentLength</a> or <a href="Link.html#fromEndSegmentLength">Link.fromEndSegmentLength</a>.
|
|
Negative values cause the link to extend into the port.
|
|
The default value is zero.</p>
|
|
<p>This property is useful when you have a thick link and a pointy arrowhead.
|
|
Normally the link Shape extends all the way to the end of the arrowhead.
|
|
If the link Shape is wide, its edges will be seen behind the arrowhead.
|
|
By setting this property to a small positive value, the link Shape can end within the
|
|
body of the arrowhead, leaving only the point of the arrowhead visible at the end of the link.</p>
|
|
<p>A negative value for this property can also be useful when you want the link Shape to continue
|
|
into the port, perhaps because a portion of the port is transparent and you want the link to
|
|
appear to connect visually with a different point on the node.</p>
|
|
<p>The value of <a href="Link.html#fromShortLength">Link.fromShortLength</a>, if not NaN, takes precedence over the value at this port
|
|
when determining the route of the link.</p>
|
|
<p>For examples of how to use this property, see <a href="../../intro/connectionPoints.html">Link Connection Points</a>.</p>
|
|
<p>You must set this property on a GraphObject whose <a href="GraphObject.html#portId">portId</a> is non-null,
|
|
unless the whole <a href="Node.html">Node</a> is acting as a single port,
|
|
in which case this property should be set on the Node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#toShortLength">toShortLength</a>, <a href="Link.html#fromShortLength">Link.fromShortLength</a>, <a href="GraphObject.html#portId">portId</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="fromSpot" class="tsd-anchor"></a>
|
|
<h3>
|
|
from<wbr>Spot
|
|
<span class="tsd-signature-symbol">: </span><a href="Spot.html" class="tsd-signature-type">Spot</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets where a link should connect from this port.
|
|
The default value is <a href="Spot.html#static-None">Spot.None</a>, meaning that the link routing
|
|
must consider the shape of the port and connect at the closest point.</p>
|
|
<p>The value of <a href="Link.html#fromSpot">Link.fromSpot</a>, if not <a href="Spot.html#static-Default">Spot.Default</a>, takes precedence over the value at this port
|
|
when determining the route of the link.
|
|
A number of the predefined <a href="Layout.html">Layout</a>s automatically set <a href="Link.html#fromSpot">Link.fromSpot</a> and <a href="Link.html#toSpot">Link.toSpot</a>,
|
|
thereby causing this property and <a href="GraphObject.html#toSpot">toSpot</a> on the port element to be ignored.
|
|
Depending on the layout, you may be able to disable that behavior, such as by setting <a href="ForceDirectedLayout.html#setsPortSpots">ForceDirectedLayout.setsPortSpots</a>,
|
|
<a href="TreeLayout.html#setsPortSpot">TreeLayout.setsPortSpot</a>, <a href="TreeLayout.html#setsChildPortSpot">TreeLayout.setsChildPortSpot</a>, or <a href="LayeredDigraphLayout.html#setsPortSpots">LayeredDigraphLayout.setsPortSpots</a> to false.</p>
|
|
<p>For examples of how to use this property, see <a href="../../intro/connectionPoints.html">Link Connection Points</a>.</p>
|
|
<p>You must set this property on a GraphObject whose <a href="GraphObject.html#portId">portId</a> is non-null,
|
|
unless the whole <a href="Node.html">Node</a> is acting as a single port,
|
|
in which case this property should be set on the Node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="Link.html#fromSpot">Link.fromSpot</a>, <a href="Link.html#computeSpot">Link.computeSpot</a>, <a href="GraphObject.html#toSpot">toSpot</a>, <a href="GraphObject.html#portId">portId</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="height" class="tsd-anchor"></a>
|
|
<h3>
|
|
height
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the desired height of this GraphObject in local coordinates.
|
|
This just gets or sets the height component of the <a href="GraphObject.html#desiredSize">desiredSize</a>.
|
|
Default is NaN.</p>
|
|
<p>Size can also be constrained by setting <a href="GraphObject.html#minSize">minSize</a> and <a href="GraphObject.html#maxSize">maxSize</a>.</p>
|
|
<p>The height does not include any transformation due to <a href="GraphObject.html#scale">scale</a> or <a href="GraphObject.html#angle">angle</a>,
|
|
nor any pen thickness due to <a href="Shape.html#strokeWidth">Shape.strokeWidth</a> if this is a <a href="Shape.html">Shape</a>.
|
|
If there is a containing <a href="Panel.html">Panel</a> the Panel will determine the actual size.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="isActionable" class="tsd-anchor"></a>
|
|
<h3>
|
|
is<wbr>Actionable
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This property determines whether or not this GraphObject's events occur
|
|
before all other events, including selection. This enables the <a href="GraphObject.html#actionDown">actionDown</a>,
|
|
<a href="GraphObject.html#actionMove">actionMove</a>, <a href="GraphObject.html#actionUp">actionUp</a>, and <a href="GraphObject.html#actionCancel">actionCancel</a> events,
|
|
which are all handled by the <a href="ActionTool.html">ActionTool</a>.</p>
|
|
<p>This object does not get any mouse/touch events if it is not <a href="GraphObject.html#visible">visible</a>
|
|
or if it is not <a href="GraphObject.html#pickable">pickable</a>.</p>
|
|
<p>This property is infrequently used -- typically only when implementing objects
|
|
that act as buttons or knobs or sliders.
|
|
The default value is false.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#actionDown">actionDown</a>, <a href="GraphObject.html#actionMove">actionMove</a>, <a href="GraphObject.html#actionUp">actionUp</a>, <a href="GraphObject.html#actionCancel">actionCancel</a>, <a href="GraphObject.html#pickable">pickable</a>, <a href="Panel.html#isEnabled">Panel.isEnabled</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="isPanelMain" class="tsd-anchor"></a>
|
|
<h3>
|
|
is<wbr>Panel<wbr>Main
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets whether a GraphObject is the "main" object for some types of <a href="Panel.html">Panel</a>.
|
|
Panels that use a "main" object include <a href="Panel.html#static-Auto">Panel.Auto</a>, <a href="Panel.html#static-Spot">Panel.Spot</a>, and <a href="Panel.html#static-Link">Panel.Link</a>.</p>
|
|
<p>Panels that use a "main" object will use the first object that has this property set to true,
|
|
or else just the first object, if none have the property set.</p>
|
|
<p>Do not modify this property once this object is an element of a panel.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-get-signature tsd-parent-kind-class">
|
|
<a name="layer" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagReadOnly">Read-only</span>
|
|
layer
|
|
<span class="tsd-signature-symbol">: </span><a href="Layer.html" class="tsd-signature-type">Layer</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This read-only property returns the GraphObject's containing <a href="Layer.html">Layer</a>, if there is any.
|
|
A plain GraphObject cannot belong directly to a Layer -- only a <a href="Part.html">Part</a> can belong directly to a Layer.</p>
|
|
<p>This property is not settable.
|
|
Normally one changes which Layer that a GraphObject is in by setting <a href="Part.html#layerName">Part.layerName</a>.
|
|
Adding a Part to a Diagram will automatically add that Part to a Layer in that Diagram based on the layerName.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="margin" class="tsd-anchor"></a>
|
|
<h3>
|
|
margin
|
|
<span class="tsd-signature-symbol">: </span><a href="../index.html#MarginLike" class="tsd-signature-type">MarginLike</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the size of empty area around this GraphObject, as a <a href="Margin.html">Margin</a>,
|
|
in the containing <a href="Panel.html">Panel</a> coordinates.</p>
|
|
<p>Negative values are permitted but may cause overlaps with adjacent
|
|
objects in a <a href="Panel.html">Panel</a>.
|
|
You cannot modify the top or left or right or bottom of the value of this property --
|
|
if you want to change the margin you must set this property to a different Margin.
|
|
Default margin is Margin(0,0,0,0).</p>
|
|
<p>The property setter accepts a number instead of a Margin object: providing a
|
|
number N will result in using a Margin(N, N, N, N).
|
|
The property getter will always return a Margin.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#desiredSize">desiredSize</a>, <a href="GraphObject.html#measuredBounds">measuredBounds</a>, <a href="GraphObject.html#actualBounds">actualBounds</a>, <a href="Panel.html#padding">Panel.padding</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="maxSize" class="tsd-anchor"></a>
|
|
<h3>
|
|
max<wbr>Size
|
|
<span class="tsd-signature-symbol">: </span><a href="Size.html" class="tsd-signature-type">Size</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the maximum size of this GraphObject in container coordinates
|
|
(either a <a href="Panel.html">Panel</a> or the document).
|
|
Any new value must be of type Size; NaN values are treated as Infinity. If you want no maximum width or height, use NaN or Infinity.</p>
|
|
<p>You cannot modify the width or height of the value of this property --
|
|
if you want to change the maxSize you must set this property to a different Size.
|
|
The default value is Infinity by Infinity.
|
|
A containing Panel will determine the actual size of this object.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#minSize">minSize</a>, <a href="GraphObject.html#desiredSize">desiredSize</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-get-signature tsd-parent-kind-class">
|
|
<a name="measuredBounds" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagReadOnly">Read-only</span>
|
|
measured<wbr>Bounds
|
|
<span class="tsd-signature-symbol">: </span><a href="Rect.html" class="tsd-signature-type">Rect</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This read-only property returns the measuredBounds of the GraphObject in container coordinates
|
|
(either a <a href="Panel.html">Panel</a> or the document).
|
|
This describes the transformed bounds with margins excluded.</p>
|
|
<p>You must not modify any of the properties of the <a href="Rect.html">Rect</a> that is the value of this property.</p>
|
|
<p>As with all read-only properties, using this property as a binding source is unlikely to be useful.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#naturalBounds">naturalBounds</a>, <a href="GraphObject.html#desiredSize">desiredSize</a>, <a href="GraphObject.html#actualBounds">actualBounds</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="minSize" class="tsd-anchor"></a>
|
|
<h3>
|
|
min<wbr>Size
|
|
<span class="tsd-signature-symbol">: </span><a href="Size.html" class="tsd-signature-type">Size</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the minimum size of this GraphObject in container coordinates
|
|
(either a <a href="Panel.html">Panel</a> or the document).
|
|
Any new value must be of type Size; NaN values are treated as 0.</p>
|
|
<p>You cannot modify the width or height of the value of this property --
|
|
if you want to change the minSize you must set this property to a different Size.
|
|
The default value is zero by zero.
|
|
A containing Panel will determine the actual size of this object.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#maxSize">maxSize</a>, <a href="GraphObject.html#desiredSize">desiredSize</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="mouseDragEnter" class="tsd-anchor"></a>
|
|
<h3>
|
|
mouse<wbr>Drag<wbr>Enter
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">prevObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute when the user moves the mouse
|
|
into this stationary object during a <a href="DraggingTool.html">DraggingTool</a> drag;
|
|
this allows you to provide feedback during a drag based on where it might drop.</p>
|
|
<p>If this property value is a function, it is called with an <a href="InputEvent.html">InputEvent</a>,
|
|
this <a href="GraphObject.html">GraphObject</a>, and any previous <a href="GraphObject.html">GraphObject</a>.
|
|
The <a href="InputEvent.html#targetObject">InputEvent.targetObject</a> provides the GraphObject that was found
|
|
at the mouse point before looking up the visual tree of <a href="GraphObject.html#panel">GraphObject.panel</a>s
|
|
to get to this object.
|
|
By default this property is null.</p>
|
|
<p>Note that for a drag-and-drop that originates in a different diagram, the target diagram's
|
|
selection collection will not be the parts that are being dragged.
|
|
Instead the temporary parts being dragged can be found as the source diagram's <a href="DraggingTool.html#copiedParts">DraggingTool.copiedParts</a>.</p>
|
|
<p>This function is called with <a href="Diagram.html#skipsUndoManager">Diagram.skipsUndoManager</a> temporarily set to true,
|
|
so that any changes to <a href="GraphObject.html">GraphObject</a>s are not recorded in the <a href="UndoManager.html">UndoManager</a>.
|
|
You do not need to start and commit any transaction in this function,
|
|
because the <a href="DraggingTool.html">DraggingTool</a> will be conducting one already.
|
|
After calling this function the diagram will be updated immediately.</p>
|
|
<p>For an example of a mouseDragEnter event handler, see the node template in the
|
|
<a href="../../samples/orgChartEditor.html">Org Chart Editor sample</a>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#mouseDragLeave">mouseDragLeave</a>, <a href="GraphObject.html#mouseHold">mouseHold</a>, <a href="GraphObject.html#mouseDrop">mouseDrop</a>, <a href="GraphObject.html#mouseEnter">mouseEnter</a>, <a href="Group.html#handlesDragDropForMembers">Group.handlesDragDropForMembers</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="mouseDragLeave" class="tsd-anchor"></a>
|
|
<h3>
|
|
mouse<wbr>Drag<wbr>Leave
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">nextObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute when the user moves the mouse
|
|
out of this stationary object during a <a href="DraggingTool.html">DraggingTool</a> drag;
|
|
this allows you to provide feedback during a drag based on where it might drop.</p>
|
|
<p>If this property value is a function, it is called with an <a href="InputEvent.html">InputEvent</a>,
|
|
this <a href="GraphObject.html">GraphObject</a>, and any new <a href="GraphObject.html">GraphObject</a> that the mouse is in.
|
|
The <a href="InputEvent.html#targetObject">InputEvent.targetObject</a> provides the GraphObject that was found
|
|
at the mouse point before looking up the visual tree of <a href="GraphObject.html#panel">GraphObject.panel</a>s
|
|
to get to this object.
|
|
By default this property is null.</p>
|
|
<p>Note that for a drag-and-drop that originates in a different diagram, the target diagram's
|
|
selection collection will not be the parts that are being dragged.
|
|
Instead the temporary parts being dragged can be found as the source diagram's <a href="DraggingTool.html#copiedParts">DraggingTool.copiedParts</a>.</p>
|
|
<p>This function is called with <a href="Diagram.html#skipsUndoManager">Diagram.skipsUndoManager</a> temporarily set to true,
|
|
so that any changes to <a href="GraphObject.html">GraphObject</a>s are not recorded in the <a href="UndoManager.html">UndoManager</a>.
|
|
You do not need to start and commit any transaction in this function,
|
|
because the <a href="DraggingTool.html">DraggingTool</a> will be conducting one already.
|
|
After calling this function the diagram will be updated immediately.</p>
|
|
<p>For an example of a mouseDragLeave event handler, see the node template in the
|
|
<a href="../../samples/orgChartEditor.html">Org Chart Editor sample</a>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#mouseDragEnter">mouseDragEnter</a>, <a href="GraphObject.html#mouseHold">mouseHold</a>, <a href="GraphObject.html#mouseDrop">mouseDrop</a>, <a href="GraphObject.html#mouseLeave">mouseLeave</a>, <a href="Group.html#handlesDragDropForMembers">Group.handlesDragDropForMembers</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="mouseDrop" class="tsd-anchor"></a>
|
|
<h3>
|
|
mouse<wbr>Drop
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute when a user drops the selection on this object
|
|
at the end of a <a href="DraggingTool.html">DraggingTool</a> drag;
|
|
this allows you to customize the behavior when a drop occurs on an object.</p>
|
|
<p>If this property value is a function, it is called with an <a href="InputEvent.html">InputEvent</a>,
|
|
this <a href="GraphObject.html">GraphObject</a>.
|
|
The <a href="InputEvent.html#targetObject">InputEvent.targetObject</a> provides the GraphObject that was found
|
|
at the mouse point before looking up the visual tree of <a href="GraphObject.html#panel">GraphObject.panel</a>s
|
|
to get to this object.
|
|
The function is called within the transaction performed by the <a href="DraggingTool.html">DraggingTool</a>,
|
|
so you do not need to conduct one.
|
|
By default this property is null.</p>
|
|
<p>For an example of a mouseDrop event handler, see the node template in the
|
|
<a href="../../samples/orgChartEditor.html">Org Chart Editor sample</a>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#mouseDragEnter">mouseDragEnter</a>, <a href="GraphObject.html#mouseDragLeave">mouseDragLeave</a>, <a href="GraphObject.html#mouseHold">mouseHold</a>, <a href="Group.html#handlesDragDropForMembers">Group.handlesDragDropForMembers</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="mouseEnter" class="tsd-anchor"></a>
|
|
<h3>
|
|
mouse<wbr>Enter
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">prevObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute when the user moves the mouse
|
|
into this object without holding down any buttons.
|
|
This property is used by the <a href="ToolManager.html">ToolManager</a>.</p>
|
|
<p>If this property value is a function, it is called with an <a href="InputEvent.html">InputEvent</a>,
|
|
this <a href="GraphObject.html">GraphObject</a> that the mouse is now in,
|
|
and any previous <a href="GraphObject.html">GraphObject</a> that the mouse was in.
|
|
The <a href="InputEvent.html#targetObject">InputEvent.targetObject</a> provides the GraphObject that was found
|
|
at the mouse point before looking up the visual tree of <a href="GraphObject.html#panel">GraphObject.panel</a>s
|
|
to get to this object.
|
|
By default this property is null.</p>
|
|
<p>This function is called with <a href="Diagram.html#skipsUndoManager">Diagram.skipsUndoManager</a> temporarily set to true,
|
|
so that any changes to <a href="GraphObject.html">GraphObject</a>s are not recorded in the <a href="UndoManager.html">UndoManager</a>.
|
|
You do not need to start and commit any transaction in this function.
|
|
After calling this function the diagram will be updated immediately.</p>
|
|
<p>For example, consider the situation where one wants to display buttons that the user can click
|
|
whenever the user passes the mouse over a node, and the buttons automatically disappear when the
|
|
mouse leaves the node. This can be implemented by showing an Adornment holding the buttons.</p>
|
|
<pre><code class="hljs js"><span class="hljs-keyword">var</span> nodeContextMenu =
|
|
$(go.Adornment, <span class="hljs-string">"Spot"</span>,
|
|
{ <span class="hljs-attr">background</span>: <span class="hljs-string">"transparent"</span> }, <span class="hljs-comment">// to help detect when the mouse leaves the area</span>
|
|
$(go.Placeholder),
|
|
$(go.Panel, <span class="hljs-string">"Vertical"</span>,
|
|
{ <span class="hljs-attr">alignment</span>: go.Spot.Right, <span class="hljs-attr">alignmentFocus</span>: go.Spot.Left },
|
|
$(<span class="hljs-string">"Button"</span>,
|
|
$(go.TextBlock, <span class="hljs-string">"Command 1"</span>),
|
|
{
|
|
<span class="hljs-attr">click</span>: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">e, obj</span>) </span>{
|
|
<span class="hljs-keyword">var</span> node = obj.part.adornedPart;
|
|
alert(<span class="hljs-string">"Command 1 on "</span> + node.data.text);
|
|
node.removeAdornment(<span class="hljs-string">"ContextMenuOver"</span>);
|
|
}
|
|
}),
|
|
$(<span class="hljs-string">"Button"</span>,
|
|
$(go.TextBlock, <span class="hljs-string">"Command 2"</span>),
|
|
{
|
|
<span class="hljs-attr">click</span>: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">e, obj</span>) </span>{
|
|
<span class="hljs-keyword">var</span> node = obj.part.adornedPart;
|
|
alert(<span class="hljs-string">"Command 2 on "</span> + node.data.text);
|
|
node.removeAdornment(<span class="hljs-string">"ContextMenuOver"</span>);
|
|
}
|
|
})
|
|
));</code></pre>
|
|
<p>Then in the definition of the Node we can implement a mouseEnter event handler:</p>
|
|
<pre><code class="hljs js">myDiagram.nodeTemplate =
|
|
$(go.Node,
|
|
. . .
|
|
{
|
|
<span class="hljs-attr">mouseEnter</span>: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">e, node</span>) </span>{
|
|
nodeContextMenu.adornedObject = node;
|
|
nodeContextMenu.mouseLeave = <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">ev, cm</span>) </span>{
|
|
node.removeAdornment(<span class="hljs-string">"ContextMenuOver"</span>);
|
|
}
|
|
node.addAdornment(<span class="hljs-string">"ContextMenuOver"</span>, nodeContextMenu);
|
|
}
|
|
});</code></pre>
|
|
<p>Note how it automatically defines a <a href="GraphObject.html#mouseLeave">mouseLeave</a> event handler too.
|
|
The context menu Adornment is removed either when the mouse leaves the area of the Adornment
|
|
or when the user executes a button click event handler.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#mouseLeave">mouseLeave</a>, <a href="GraphObject.html#mouseOver">mouseOver</a>, <a href="GraphObject.html#mouseHover">mouseHover</a>, <a href="GraphObject.html#mouseDragEnter">mouseDragEnter</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="mouseHold" class="tsd-anchor"></a>
|
|
<h3>
|
|
mouse<wbr>Hold
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute when the user holds the mouse still for a while
|
|
over this object while holding down a button.
|
|
This property is used by the <a href="ToolManager.html">ToolManager</a>.</p>
|
|
<p>If this property value is a function, it is called with an <a href="InputEvent.html">InputEvent</a>.
|
|
By default this property is null.</p>
|
|
<p>If you do provide a function that makes changes to the diagram or to its model,
|
|
you should do so within a transaction -- call <a href="Diagram.html#startTransaction">Diagram.startTransaction</a> and
|
|
<a href="Diagram.html#commitTransaction">Diagram.commitTransaction</a>.</p>
|
|
<p>You can control how long the user must wait during a drag with a motionless mouse before
|
|
a "mouse hold" event occurs, by setting <a href="ToolManager.html#holdDelay">ToolManager.holdDelay</a>.
|
|
For example:</p>
|
|
<pre><code class="hljs js">myDiagram =
|
|
$(go.Diagram, <span class="hljs-string">"myDiagramDiv"</span>,
|
|
{ <span class="hljs-string">"toolManager.holdDelay"</span>: <span class="hljs-number">500</span> }); <span class="hljs-comment">// 500 milliseconds</span></code></pre>
|
|
<p>or:</p>
|
|
<pre><code class="hljs js">myDiagram.toolManager.holdDelay = <span class="hljs-number">500</span>; <span class="hljs-comment">// 500 milliseconds</span></code></pre>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#mouseDragEnter">mouseDragEnter</a>, <a href="GraphObject.html#mouseDragLeave">mouseDragLeave</a>, <a href="GraphObject.html#mouseHover">mouseHover</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="mouseHover" class="tsd-anchor"></a>
|
|
<h3>
|
|
mouse<wbr>Hover
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute when the user holds the mouse still for a while
|
|
over this object without holding down any buttons.
|
|
This property is used by the <a href="ToolManager.html">ToolManager</a>.</p>
|
|
<p>If this property value is a function, it is called with an <a href="InputEvent.html">InputEvent</a>.
|
|
By default this property is null.</p>
|
|
<p>If you do provide a function that makes changes to the diagram or to its model,
|
|
you should do so within a transaction -- call <a href="Diagram.html#startTransaction">Diagram.startTransaction</a> and
|
|
<a href="Diagram.html#commitTransaction">Diagram.commitTransaction</a>.</p>
|
|
<p>You can control how long the user must wait with a motionless mouse before
|
|
a "mouse hover" event occurs, by setting <a href="ToolManager.html#hoverDelay">ToolManager.hoverDelay</a>.
|
|
For example:</p>
|
|
<pre><code class="hljs js">myDiagram =
|
|
$(go.Diagram, <span class="hljs-string">"myDiagramDiv"</span>,
|
|
{ <span class="hljs-string">"toolManager.hoverDelay"</span>: <span class="hljs-number">500</span> }); <span class="hljs-comment">// 500 milliseconds</span></code></pre>
|
|
<p>or:</p>
|
|
<pre><code class="hljs js">myDiagram.toolManager.hoverDelay = <span class="hljs-number">500</span>; <span class="hljs-comment">// 500 milliseconds</span></code></pre>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#mouseOver">mouseOver</a>, <a href="GraphObject.html#mouseEnter">mouseEnter</a>, <a href="GraphObject.html#mouseLeave">mouseLeave</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="mouseLeave" class="tsd-anchor"></a>
|
|
<h3>
|
|
mouse<wbr>Leave
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">nextObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute when the user moves the mouse
|
|
out of this object without holding down any buttons.
|
|
This property is used by the <a href="ToolManager.html">ToolManager</a>.</p>
|
|
<p>If this property value is a function, it is called with an <a href="InputEvent.html">InputEvent</a>,
|
|
this <a href="GraphObject.html">GraphObject</a> that the mouse has left,
|
|
and any next <a href="GraphObject.html">GraphObject</a> that the mouse is now in.
|
|
The <a href="InputEvent.html#targetObject">InputEvent.targetObject</a> provides the GraphObject that was found
|
|
at the mouse point before looking up the visual tree of <a href="GraphObject.html#panel">GraphObject.panel</a>s
|
|
to get to this object.
|
|
By default this property is null.</p>
|
|
<p>This function is called with <a href="Diagram.html#skipsUndoManager">Diagram.skipsUndoManager</a> temporarily set to true,
|
|
so that any changes to <a href="GraphObject.html">GraphObject</a>s are not recorded in the <a href="UndoManager.html">UndoManager</a>.
|
|
You do not need to start and commit any transaction in this function.
|
|
After calling this function the diagram will be updated immediately.</p>
|
|
<p>For example, the <a href="../../samples/flowchart.html">Flow Chart sample</a>
|
|
automatically shows and hides the ports as the mouse passes over a node.
|
|
The node template includes the following settings:</p>
|
|
<pre><code class="hljs js">myDiagram.nodeTemplate =
|
|
$(go.Node,
|
|
. . .
|
|
{
|
|
. . .
|
|
<span class="hljs-comment">// handle mouse enter/leave events to show/hide the ports</span>
|
|
mouseEnter: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">e, obj</span>) </span>{ showPorts(obj.part, <span class="hljs-literal">true</span>); },
|
|
<span class="hljs-attr">mouseLeave</span>: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">e, obj</span>) </span>{ showPorts(obj.part, <span class="hljs-literal">false</span>); }
|
|
. . .
|
|
});</code></pre>
|
|
<p>where the <code>showPorts</code> function is defined to set the <a href="GraphObject.html#visible">visible</a>
|
|
property of each of the port elements of the node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#mouseEnter">mouseEnter</a>, <a href="GraphObject.html#mouseOver">mouseOver</a>, <a href="GraphObject.html#mouseHover">mouseHover</a>, <a href="GraphObject.html#mouseDragLeave">mouseDragLeave</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="mouseOver" class="tsd-anchor"></a>
|
|
<h3>
|
|
mouse<wbr>Over
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">e</span><span class="tsd-signature-symbol">: </span><a href="InputEvent.html" class="tsd-signature-type">InputEvent</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">thisObj</span><span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the function to execute when the user moves the mouse
|
|
over this object without holding down any buttons.
|
|
This property is used by the <a href="ToolManager.html">ToolManager</a>.
|
|
This property is infrequently used -- it is more common to implement <a href="GraphObject.html#mouseEnter">mouseEnter</a>
|
|
and <a href="GraphObject.html#mouseLeave">mouseLeave</a> functions.</p>
|
|
<p>If this property value is a function, it is called with an <a href="InputEvent.html">InputEvent</a>
|
|
and this <a href="GraphObject.html">GraphObject</a>.
|
|
The <a href="InputEvent.html#targetObject">InputEvent.targetObject</a> provides the GraphObject that was found
|
|
at the mouse point before looking up the visual tree of <a href="GraphObject.html#panel">GraphObject.panel</a>s
|
|
to get to this object.
|
|
By default this property is null.</p>
|
|
<p>This function is called with <a href="Diagram.html#skipsUndoManager">Diagram.skipsUndoManager</a> temporarily set to true,
|
|
so that any changes to <a href="GraphObject.html">GraphObject</a>s are not recorded in the <a href="UndoManager.html">UndoManager</a>.
|
|
You do not need to start and commit any transaction in this function.
|
|
After calling this function the diagram will be updated immediately.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#mouseHover">mouseHover</a>, <a href="GraphObject.html#mouseEnter">mouseEnter</a>, <a href="GraphObject.html#mouseLeave">mouseLeave</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="name" class="tsd-anchor"></a>
|
|
<h3>
|
|
name
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the name for this object.
|
|
The default value is the empty string.
|
|
The name should be unique within a <a href="Panel.html">Panel</a>, although if it isn't,
|
|
it reduces the usefulness of methods such as <a href="Panel.html#findObject">Panel.findObject</a>.</p>
|
|
<p>You must not modify the name of a GraphObject once it is in the visual tree of a Part.</p>
|
|
<p>This is frequently needed to identify a particular GraphObject in the visual tree of a Part,
|
|
for example as the value of the <a href="Part.html#locationObjectName">Part.locationObjectName</a> or
|
|
<a href="Part.html#selectionObjectName">Part.selectionObjectName</a> properties.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-get-signature tsd-parent-kind-class">
|
|
<a name="naturalBounds" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagReadOnly">Read-only</span>
|
|
natural<wbr>Bounds
|
|
<span class="tsd-signature-symbol">: </span><a href="Rect.html" class="tsd-signature-type">Rect</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This read-only property returns the natural bounding rectangle of this GraphObject in local coordinates,
|
|
before any transformation by <a href="GraphObject.html#scale">scale</a> or <a href="GraphObject.html#angle">angle</a>,
|
|
and before any resizing due to <a href="GraphObject.html#minSize">minSize</a> or <a href="GraphObject.html#maxSize">maxSize</a> or <a href="GraphObject.html#stretch">stretch</a>.
|
|
Defaults to unknown (NaN,NaN).</p>
|
|
<p>You must not modify any of the properties of the <a href="Rect.html">Rect</a> that is the value of this property.</p>
|
|
<p>The value can only be changed by changing properties of the particular GraphObject,
|
|
such as <a href="GraphObject.html#desiredSize">GraphObject.desiredSize</a>, <a href="Shape.html#geometry">Shape.geometry</a>, or <a href="TextBlock.html#font">TextBlock.font</a>.</p>
|
|
<p>As with all read-only properties, using this property as a binding source is unlikely to be useful.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#desiredSize">desiredSize</a>, <a href="GraphObject.html#measuredBounds">measuredBounds</a>, <a href="GraphObject.html#actualBounds">actualBounds</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="opacity" class="tsd-anchor"></a>
|
|
<h3>
|
|
opacity
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the multiplicative opacity for this GraphObject and (if a Panel) all elements.
|
|
The value must be between 0.0 (fully transparent) and 1.0 (no additional transparency).</p>
|
|
<p>Unlike <a href="GraphObject.html#visible">visible</a>, Opacity only affects drawing, it does not cause objects to be resized or remeasured.
|
|
Opacity settings do not change the shape of the object or exclude it from object-picking
|
|
(does not change whether any objects are found by the "find..." methods).</p>
|
|
<p>This value is multiplicative with any existing transparency,
|
|
for instance from <a href="Layer.html#opacity">Layer.opacity</a> or a GraphObject's opacity higher in the visual tree,
|
|
or from a <a href="Brush.html">Brush</a> or image transparency.
|
|
The default value is 1.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#visible">visible</a>, <a href="GraphObject.html#pickable">pickable</a>, <a href="Layer.html#opacity">Layer.opacity</a></p>
|
|
</dd>
|
|
<dt>since</dt>
|
|
<dd><p>1.4</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-get-signature tsd-parent-kind-class">
|
|
<a name="panel" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagReadOnly">Read-only</span>
|
|
panel
|
|
<span class="tsd-signature-symbol">: </span><a href="Panel.html" class="tsd-signature-type">Panel</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This read-only property returns the GraphObject's containing <a href="Panel.html">Panel</a>, or null if this object is not in a Panel.</p>
|
|
<p>Although <a href="Part.html">Part</a> inherits from this class, a Part will never belong to a Panel,
|
|
so this property will always be null for every <a href="Node.html">Node</a> or <a href="Link.html">Link</a>.</p>
|
|
<p>This property is not settable.
|
|
Instead, call <a href="Panel.html#add">Panel.add</a> in order to put a GraphObject in a Panel.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-get-signature tsd-parent-kind-class">
|
|
<a name="part" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagReadOnly">Read-only</span>
|
|
part
|
|
<span class="tsd-signature-symbol">: </span><a href="Part.html" class="tsd-signature-type">Part</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This read-only property returns the <a href="Part.html">Part</a> containing this object, if any.
|
|
The Part will be the root GraphObject in this GraphObject's visual tree.</p>
|
|
<p>It is common to refer to the containing Part of a GraphObject
|
|
in order to refer to the <a href="Panel.html#data">Panel.data</a> to which it is bound.</p>
|
|
<p>This property is not settable.
|
|
If you want this GraphObject to belong to a Part, you will need to add it to a Part,
|
|
or else add it to some visual tree structure that is added to a Part using <a href="Panel.html#add">Panel.add</a>.</p>
|
|
<p>Note that for objects such as buttons that are in <a href="Adornment.html">Adornment</a>s such as tooltips or context menus,
|
|
this property will return that Adornment, not the Node or Link that is adorned.</p>
|
|
<p>If you want to find a <a href="Group.html">Group</a> that contains a Part, use the <a href="Part.html#containingGroup">Part.containingGroup</a> property:
|
|
<code>someObj.part.containingGroup</code></p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="pickable" class="tsd-anchor"></a>
|
|
<h3>
|
|
pickable
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets whether or not this GraphObject can be chosen by visual "find" or "hit-test" methods such
|
|
as <a href="Diagram.html#findObjectAt">Diagram.findObjectAt</a>.</p>
|
|
<p>This object does not get any mouse/touch events if it is not <a href="GraphObject.html#visible">visible</a>
|
|
or if it is not <a href="GraphObject.html#pickable">pickable</a>.</p>
|
|
<p>The default value is true -- mouse events on this object will be noticed.
|
|
If this value is false and this object is a <a href="Panel.html">Panel</a>, not only is this Panel not "hittable",
|
|
but all of the elements inside the Panel will be ignored.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#visible">visible</a>, <a href="GraphObject.html#opacity">opacity</a>, <a href="Layer.html#pickable">Layer.pickable</a>, <a href="Panel.html#isEnabled">Panel.isEnabled</a></p>
|
|
</dd>
|
|
<dt>since</dt>
|
|
<dd><p>1.2</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="portId" class="tsd-anchor"></a>
|
|
<h3>
|
|
port<wbr>Id
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets an identifier for an object acting as a port on a Node.
|
|
The default value is null -- this object is not a port.</p>
|
|
<p>A value that is the empty string is used by convention to mean the primary
|
|
(and usually only) port of the node.</p>
|
|
<p>If a Node has no named ports, then the Node itself is the sole port.</p>
|
|
<p>Note: the only kind of model that can save port information, i.e. portIds that are not an empty string,
|
|
for links is a <a href="GraphLinksModel.html">GraphLinksModel</a> whose <a href="GraphLinksModel.html#linkFromPortIdProperty">GraphLinksModel.linkFromPortIdProperty</a> and
|
|
<a href="GraphLinksModel.html#linkToPortIdProperty">GraphLinksModel.linkToPortIdProperty</a> have been set to name properties on the link data objects.</p>
|
|
<p>The value should be unique within the <a href="Node.html">Node</a>.
|
|
You must not modify this property once this GraphObject is in the visual tree of a Node.</p>
|
|
<p class="boxread">
|
|
See <a href="../../intro/ports.html">the Introduction page on ports</a>
|
|
for usage information and examples.
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#fromLinkable">fromLinkable</a>, <a href="GraphObject.html#toLinkable">toLinkable</a>, <a href="GraphObject.html#fromSpot">fromSpot</a>, <a href="GraphObject.html#toSpot">toSpot</a>, <a href="Link.html#fromSpot">Link.fromSpot</a>, <a href="Link.html#toSpot">Link.toSpot</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="position" class="tsd-anchor"></a>
|
|
<h3>
|
|
position
|
|
<span class="tsd-signature-symbol">: </span><a href="Point.html" class="tsd-signature-type">Point</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the position of this GraphObject in container coordinates
|
|
(either a <a href="Panel.html">Panel</a> or the document).
|
|
Value must be of type Point.
|
|
You cannot modify the x or y of the value of this property --
|
|
if you want to change the position you must set this property to a different Point.
|
|
Default is Point(NaN, NaN).</p>
|
|
<p>For <a href="Part.html">Part</a>s, see also <a href="Part.html#location">Part.location</a>.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="row" class="tsd-anchor"></a>
|
|
<h3>
|
|
row
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the row of this GraphObject if it is in a Table <a href="Panel.html">Panel</a>.
|
|
The value must be a small non-negative integer. The default is 0.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="rowSpan" class="tsd-anchor"></a>
|
|
<h3>
|
|
row<wbr>Span
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the number of rows spanned by this GraphObject if it is in a Table <a href="Panel.html">Panel</a>.
|
|
The value must be a small positive integer. The default is 1.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="scale" class="tsd-anchor"></a>
|
|
<h3>
|
|
scale
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the scale transform of this GraphObject.
|
|
Value must be a number; larger values will make this object appear bigger.
|
|
Default is 1.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#angle">angle</a>, <a href="GraphObject.html#stretch">stretch</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="segmentFraction" class="tsd-anchor"></a>
|
|
<h3>
|
|
segment<wbr>Fraction
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the fractional distance along a segment of a GraphObject that is in a <a href="Link.html">Link</a>.
|
|
The value should be between zero and one, where zero is at the point at the start of the segment,
|
|
and where one is at the point at the end of the segment.
|
|
The default value is zero.</p>
|
|
<p>For examples of how to use this property, see <a href="../../intro/linkLabels.html">Link Labels</a>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#segmentIndex">segmentIndex</a>, <a href="GraphObject.html#segmentOffset">segmentOffset</a>, <a href="GraphObject.html#segmentOrientation">segmentOrientation</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="segmentIndex" class="tsd-anchor"></a>
|
|
<h3>
|
|
segment<wbr>Index
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the segment index of a GraphObject that is in a <a href="Link.html">Link</a>.
|
|
Non-negative numbers count up from zero, which is the first segment, at the "from" end of the Link.
|
|
Negative numbers count segments from the "to" end of the Link, where -1 means the last segment
|
|
and -2 means the next-to-last segment.
|
|
The value should be an integer.</p>
|
|
<p>If you do not set this property, the Link will choose a place that is approximately at the
|
|
mid-point of the link's route.</p>
|
|
<p>For examples of how to use this property, see <a href="../../intro/linkLabels.html">Link Labels</a>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#segmentFraction">segmentFraction</a>, <a href="GraphObject.html#segmentOffset">segmentOffset</a>, <a href="GraphObject.html#segmentOrientation">segmentOrientation</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="segmentOffset" class="tsd-anchor"></a>
|
|
<h3>
|
|
segment<wbr>Offset
|
|
<span class="tsd-signature-symbol">: </span><a href="Point.html" class="tsd-signature-type">Point</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the offset of a GraphObject that is in a <a href="Link.html">Link</a> from a point on a segment
|
|
or in a <a href="Panel.html#static-Graduated">Panel.Graduated</a> from a point along the main element.
|
|
The X component of the Point indicates the distance along the route,
|
|
with positive values going further toward the "to" end of the link or panel.
|
|
The Y component of the Point indicates the distance away from the route,
|
|
with positive values towards the right as seen when facing further towards the "to" end of the link or panel.
|
|
The value defaults to the Point (0, 0).
|
|
You cannot modify the x or y of the value of this property --
|
|
if you want to change the segmentOffset you must set this property to a different Point.</p>
|
|
<p>For labels that are near either end of a link, it may be convenient to set the segmentOffset
|
|
to Point(NaN, NaN). This causes the offset to be half the width and half the height of the label object.</p>
|
|
<p>For examples of how to use this property, see <a href="../../intro/linkLabels.html">Link Labels</a>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#segmentFraction">segmentFraction</a>, <a href="GraphObject.html#segmentIndex">segmentIndex</a>, <a href="GraphObject.html#segmentOrientation">segmentOrientation</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="segmentOrientation" class="tsd-anchor"></a>
|
|
<h3>
|
|
segment<wbr>Orientation
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the orientation of a GraphObject that is in a <a href="Link.html">Link</a> or <a href="Panel.html#static-Graduated">Panel.Graduated</a>.
|
|
This controls the automatic rotation of the object by the Link Panel or Graduated Panel.
|
|
The only accepted values are the <a href="Link.html">Link</a> "Orient..." values of Link
|
|
and the default value: <a href="Link.html#static-None">Link.None</a>.</p>
|
|
<p>When the value is <a href="Link.html#static-None">Link.None</a>, the <a href="GraphObject.html#angle">angle</a> of this object is unchanged as the link is routed.
|
|
Setting this to a value of <a href="Link.html#static-OrientAlong">Link.OrientAlong</a> will cause routing to set the <a href="GraphObject.html#angle">angle</a>
|
|
to be the angle of the segment that this object is on.
|
|
Other values compute the angle somewhat differently.
|
|
If the value is changed back to <a href="Link.html#static-None">Link.None</a>, the <a href="GraphObject.html#angle">angle</a> of this object is set to zero.</p>
|
|
<p>Note that when this property is not <a href="Link.html#static-None">Link.None</a>, this property takes precedence
|
|
over any setting or binding of the <a href="GraphObject.html#angle">angle</a> property.
|
|
Changes to the angle caused by orientation might not result in Changed events,
|
|
and any original value for the angle may be lost.</p>
|
|
<p>For examples of how to use this property, see <a href="../../intro/linkLabels.html">Link Labels</a>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#segmentFraction">segmentFraction</a>, <a href="GraphObject.html#segmentIndex">segmentIndex</a>, <a href="GraphObject.html#segmentOffset">segmentOffset</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="shadowVisible" class="tsd-anchor"></a>
|
|
<h3>
|
|
shadow<wbr>Visible
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets whether or not this GraphObject will be shadowed inside a Part that has <a href="Part.html#isShadowed">Part.isShadowed</a> set to true.</p>
|
|
<p>The default is null, which means this GraphObject will obey the default shadow rules (see <a href="Part.html#isShadowed">Part.isShadowed</a>).</p>
|
|
<p>A value of true or false will ensure that this part is shadowed or not regardless of the default shadow rules,
|
|
but this GraphObject's shadowed status will not affect other GraphObjects in the Part.</p>
|
|
<p>Typically this property does not need to be set, but you may need to set this value to false
|
|
on GraphObjects inside a Part that you do not wish to be shadowed.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="Part.html#isShadowed">Part.isShadowed</a></p>
|
|
</dd>
|
|
<dt>since</dt>
|
|
<dd><p>1.6</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="stretch" class="tsd-anchor"></a>
|
|
<h3>
|
|
stretch
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the stretch of the GraphObject.
|
|
This controls whether the width and/or height of this object automatically adjusts to fill
|
|
the area allotted by the containing Panel.</p>
|
|
<p>The only accepted values are listed as constant properties of GraphObject,
|
|
such as <a href="GraphObject.html#static-None">GraphObject.None</a>, <a href="GraphObject.html#static-Fill">GraphObject.Fill</a>, <a href="GraphObject.html#static-Horizontal">GraphObject.Horizontal</a>, or <a href="GraphObject.html#static-Vertical">GraphObject.Vertical</a>.
|
|
The default value is <a href="GraphObject.html#static-Default">GraphObject.Default</a>, which allows the Panel to decide how to treat this object, depending on the type of Panel.</p>
|
|
<p>Objects with an <a href="GraphObject.html#angle">angle</a> that are stretched may look incorrect unless the angle is a multiple of 90.</p>
|
|
<p>Stretch will have have different effects based upon the Panel containing this object. Elements of:</p>
|
|
<ul>
|
|
<li>Auto panels will not stretch, except the main element growing to fill the panel or being made uniform</li>
|
|
<li>Horizontal panels will only stretch vertically</li>
|
|
<li>Vertical panels will only stretch horizontally</li>
|
|
<li>Spot panels will stretch to the size of the main element</li>
|
|
<li>Table panels will stretch to the size of their cell, defined by their row and column, which is usually determined by other GraphObjects in that cell that are not stretching</li>
|
|
<li>Grid panels, Link panels, and Graduated panels will not stretch</li>
|
|
</ul>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="Panel.html#defaultStretch">Panel.defaultStretch</a>, <a href="GraphObject.html#desiredSize">desiredSize</a>, <a href="GraphObject.html#minSize">minSize</a>, <a href="GraphObject.html#maxSize">maxSize</a>, <a href="GraphObject.html#measuredBounds">measuredBounds</a>, <a href="GraphObject.html#actualBounds">actualBounds</a>, <a href="GraphObject.html#scale">scale</a>, <a href="Picture.html#imageStretch">Picture.imageStretch</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="toEndSegmentLength" class="tsd-anchor"></a>
|
|
<h3>
|
|
to<wbr>End<wbr>Segment<wbr>Length
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the length of the last segment of a link going to this port.
|
|
This value is used when the computed "to spot" is not <a href="Spot.html#static-None">Spot.None</a>.
|
|
The default value is 10.</p>
|
|
<p>The value of <a href="Link.html#toEndSegmentLength">Link.toEndSegmentLength</a>, if not NaN, takes precedence over the value at this port
|
|
when determining the route of the link.
|
|
This value also limits how short the <a href="Link.html#toShortLength">Link.toShortLength</a> may be drawn.</p>
|
|
<p>For examples of how to use this property, see <a href="../../intro/links.html#EndSegmentLengths">Link End Segment Lengths</a>.</p>
|
|
<p>You must set this property on a GraphObject whose <a href="GraphObject.html#portId">portId</a> is non-null,
|
|
unless the whole <a href="Node.html">Node</a> is acting as a single port,
|
|
in which case this property should be set on the Node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="Link.html#toEndSegmentLength">Link.toEndSegmentLength</a>, <a href="Link.html#computeEndSegmentLength">Link.computeEndSegmentLength</a>, <a href="GraphObject.html#fromEndSegmentLength">fromEndSegmentLength</a>, <a href="GraphObject.html#portId">portId</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="toLinkable" class="tsd-anchor"></a>
|
|
<h3>
|
|
to<wbr>Linkable
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets whether the user may draw Links to this port.
|
|
This property is used by <a href="LinkingBaseTool.html#isValidTo">LinkingBaseTool.isValidTo</a>.</p>
|
|
<p>The default value is null, which indicates that the real value is inherited from
|
|
the parent <a href="Panel.html">Panel</a>, or false if there is no containing panel.</p>
|
|
<p>You must set this property on a GraphObject whose <a href="GraphObject.html#portId">portId</a> is non-null,
|
|
unless the whole <a href="Node.html">Node</a> is acting as a single port,
|
|
in which case this property should be set on the Node,
|
|
or unless you are disabling the "linkability" of a particular GraphObject
|
|
inside a Panel whose toLinkable has been set or bound to true.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#fromLinkable">fromLinkable</a>, <a href="GraphObject.html#toMaxLinks">toMaxLinks</a>, <a href="GraphObject.html#portId">portId</a>, <a href="GraphObject.html#cursor">cursor</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="toLinkableDuplicates" class="tsd-anchor"></a>
|
|
<h3>
|
|
to<wbr>Linkable<wbr>Duplicates
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets whether the user may draw duplicate Links to this port.
|
|
This property is used by <a href="LinkingBaseTool.html#isValidLink">LinkingBaseTool.isValidLink</a>.
|
|
The default value is false.</p>
|
|
<p>You must set this property on a GraphObject whose <a href="GraphObject.html#portId">portId</a> is non-null,
|
|
unless the whole <a href="Node.html">Node</a> is acting as a single port,
|
|
in which case this property should be set on the Node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#toLinkable">toLinkable</a>, <a href="GraphObject.html#toLinkableSelfNode">toLinkableSelfNode</a>, <a href="GraphObject.html#fromLinkableDuplicates">fromLinkableDuplicates</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="toLinkableSelfNode" class="tsd-anchor"></a>
|
|
<h3>
|
|
to<wbr>Linkable<wbr>Self<wbr>Node
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets whether the user may draw Links that connect to this port's Node.
|
|
This property is used by <a href="LinkingBaseTool.html#isValidLink">LinkingBaseTool.isValidLink</a>.
|
|
The default value is false.</p>
|
|
<p>You must set this property on a GraphObject whose <a href="GraphObject.html#portId">portId</a> is non-null,
|
|
unless the whole <a href="Node.html">Node</a> is acting as a single port,
|
|
in which case this property should be set on the Node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#toLinkable">toLinkable</a>, <a href="GraphObject.html#toLinkableDuplicates">toLinkableDuplicates</a>, <a href="GraphObject.html#fromLinkableSelfNode">fromLinkableSelfNode</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="toMaxLinks" class="tsd-anchor"></a>
|
|
<h3>
|
|
to<wbr>Max<wbr>Links
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the maximum number of links that may go into this port.
|
|
This property is used by <a href="LinkingBaseTool.html#isValidTo">LinkingBaseTool.isValidTo</a>.</p>
|
|
<p>The value must be non-negative.
|
|
The default value is Infinity.</p>
|
|
<p>You must set this property on a GraphObject whose <a href="GraphObject.html#portId">portId</a> is non-null,
|
|
unless the whole <a href="Node.html">Node</a> is acting as a single port,
|
|
in which case this property should be set on the Node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#toLinkable">toLinkable</a>, <a href="GraphObject.html#fromMaxLinks">fromMaxLinks</a>, <a href="GraphObject.html#portId">portId</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="toShortLength" class="tsd-anchor"></a>
|
|
<h3>
|
|
to<wbr>Short<wbr>Length
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets how far the end segment of a link going to this port stops short of the actual port.
|
|
Positive values are limited by the <a href="GraphObject.html#toEndSegmentLength">toEndSegmentLength</a> or <a href="Link.html#toEndSegmentLength">Link.toEndSegmentLength</a>.
|
|
Negative values cause the link to extend into the port.
|
|
The default value is zero.</p>
|
|
<p>This property is useful when you have a thick link and a pointy arrowhead.
|
|
Normally the link Shape extends all the way to the end of the arrowhead.
|
|
If the link Shape is wide, its edges will be seen behind the arrowhead.
|
|
By setting this property to a small positive value, the link Shape can end within the
|
|
body of the arrowhead, leaving only the point of the arrowhead visible at the end of the link.</p>
|
|
<p>A negative value for this property can also be useful when you want the link Shape to continue
|
|
into the port, perhaps because a portion of the port is transparent and you want the link to
|
|
appear to connect visually with a different point on the node.</p>
|
|
<p>The value of <a href="Link.html#toShortLength">Link.toShortLength</a>, if not NaN, takes precedence over the value at this port
|
|
when determining the route of the link.</p>
|
|
<p>For examples of how to use this property, see <a href="../../intro/connectionPoints.html">Link Connection Points</a>.</p>
|
|
<p>You must set this property on a GraphObject whose <a href="GraphObject.html#portId">portId</a> is non-null,
|
|
unless the whole <a href="Node.html">Node</a> is acting as a single port,
|
|
in which case this property should be set on the Node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#fromShortLength">fromShortLength</a>, <a href="Link.html#toShortLength">Link.toShortLength</a>, <a href="GraphObject.html#portId">portId</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="toSpot" class="tsd-anchor"></a>
|
|
<h3>
|
|
to<wbr>Spot
|
|
<span class="tsd-signature-symbol">: </span><a href="Spot.html" class="tsd-signature-type">Spot</a> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets where a link should connect to this port.
|
|
The default value is <a href="Spot.html#static-None">Spot.None</a>, meaning that the link routing
|
|
must consider the shape of the port and connect to the closest point.</p>
|
|
<p>The value of <a href="Link.html#toSpot">Link.toSpot</a>, if not <a href="Spot.html#static-Default">Spot.Default</a>, takes precedence over the value at this port
|
|
when determining the route of the link.
|
|
A number of the predefined <a href="Layout.html">Layout</a>s automatically set <a href="Link.html#fromSpot">Link.fromSpot</a> and <a href="Link.html#toSpot">Link.toSpot</a>,
|
|
thereby causing this property and <a href="GraphObject.html#fromSpot">fromSpot</a> on the port element to be ignored.
|
|
Depending on the layout, you may be able to disable that behavior, such as by setting <a href="ForceDirectedLayout.html#setsPortSpots">ForceDirectedLayout.setsPortSpots</a>,
|
|
<a href="TreeLayout.html#setsPortSpot">TreeLayout.setsPortSpot</a>, <a href="TreeLayout.html#setsChildPortSpot">TreeLayout.setsChildPortSpot</a>, or <a href="LayeredDigraphLayout.html#setsPortSpots">LayeredDigraphLayout.setsPortSpots</a> to false.</p>
|
|
<p>For examples of how to use this property, see <a href="../../intro/connectionPoints.html">Link Connection Points</a>.</p>
|
|
<p>You must set this property on a GraphObject whose <a href="GraphObject.html#portId">portId</a> is non-null,
|
|
unless the whole <a href="Node.html">Node</a> is acting as a single port,
|
|
in which case this property should be set on the Node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="Link.html#toSpot">Link.toSpot</a>, <a href="Link.html#computeSpot">Link.computeSpot</a>, <a href="GraphObject.html#fromSpot">fromSpot</a>, <a href="GraphObject.html#portId">portId</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="toolTip" class="tsd-anchor"></a>
|
|
<h3>
|
|
tool<wbr>Tip
|
|
<span class="tsd-signature-symbol">: </span><a href="Adornment.html" class="tsd-signature-type">Adornment</a><span class="tsd-signature-symbol"> | </span><a href="HTMLInfo.html" class="tsd-signature-type">HTMLInfo</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This <a href="Adornment.html">Adornment</a> or <a href="HTMLInfo.html">HTMLInfo</a> is shown when the mouse hovers over this object.
|
|
The default value is null, which means no tooltip is shown.</p>
|
|
<p>A typical tooltip is defined in the following manner, as taken from
|
|
the <a href="../../samples/kittenMonitor.html">Kitten Monitor sample</a>:</p>
|
|
<pre><code class="hljs js">myDiagram.nodeTemplate =
|
|
$(go.Node,
|
|
. . .
|
|
{ <span class="hljs-comment">// this tooltip shows the name and picture of the kitten</span>
|
|
toolTip:
|
|
$(<span class="hljs-string">"ToolTip"</span>,
|
|
$(go.Panel, <span class="hljs-string">"Vertical"</span>,
|
|
$(go.Picture,
|
|
<span class="hljs-keyword">new</span> go.Binding(<span class="hljs-string">"source"</span>, <span class="hljs-string">"src"</span>, <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">s</span>) </span>{ <span class="hljs-keyword">return</span> <span class="hljs-string">"images/"</span> + s + <span class="hljs-string">".png"</span>; })),
|
|
$(go.TextBlock, { <span class="hljs-attr">margin</span>: <span class="hljs-number">3</span> },
|
|
<span class="hljs-keyword">new</span> go.Binding(<span class="hljs-string">"text"</span>, <span class="hljs-string">"key"</span>))))
|
|
});</code></pre>
|
|
<p>Note that this Adornment depends on having the same data binding as the adorned Part
|
|
(i.e. the same value for <a href="Panel.html#data">Panel.data</a>).</p>
|
|
<p>Tooltips are not copied by <a href="GraphObject.html#copy">copy</a>, so that tooltips may be shared by all instances of a template.</p>
|
|
<p>Tooltips are shown after a timed delay given by the <a href="ToolManager.html#hoverDelay">ToolManager.hoverDelay</a>.
|
|
You can change the delay time by:</p>
|
|
<pre><code class="hljs js">myDiagram =
|
|
$(go.Diagram, <span class="hljs-string">"myDiagramDiv"</span>,
|
|
{ <span class="hljs-string">"toolManager.hoverDelay"</span>: <span class="hljs-number">500</span> }); <span class="hljs-comment">// 500 milliseconds</span></code></pre>
|
|
<p>or:</p>
|
|
<pre><code class="hljs js">myDiagram.toolManager.hoverDelay = <span class="hljs-number">500</span>; <span class="hljs-comment">// 500 milliseconds</span></code></pre>
|
|
<p>Tooltips are normally positioned by <a href="ToolManager.html#positionToolTip">ToolManager.positionToolTip</a>.
|
|
However, if there is a <a href="Placeholder.html">Placeholder</a> in the tooltip, the tooltip (i.e. an Adornment)
|
|
will be positioned so that the Placeholder is at the same position as this adorned GraphObject.</p>
|
|
<p>Replacing this value will not modify or remove any existing tooltip that is being shown for this object.</p>
|
|
<p>Read more about tooltips at <a href="../../intro/toolTips.html">ToolTips</a>.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="visible" class="tsd-anchor"></a>
|
|
<h3>
|
|
visible
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets whether a GraphObject is visible.
|
|
The default value is true.
|
|
A not visible object takes no space in the Panel that it is in.
|
|
Toggling visibility may cause elements in the visual tree to re-measure and re-arrange.
|
|
Making a Panel not visible causes all of its elements not to be seen or receive input events.
|
|
Changing a Panel to become visible causes all of its elements to be seen and be active,
|
|
unless those elements are themselves not visible.</p>
|
|
<p>This object does not get any mouse/touch events if it is not <a href="GraphObject.html#visible">visible</a>
|
|
or if it is not <a href="GraphObject.html#pickable">pickable</a>.</p>
|
|
<p>One can have a visible <a href="Shape.html">Shape</a> that is not drawn by setting its <a href="Shape.html#fill">Shape.fill</a>
|
|
and <a href="Shape.html#stroke">Shape.stroke</a> to null or to <code>"transparent"</code>.
|
|
Similarly, one can set <a href="TextBlock.html#stroke">TextBlock.stroke</a> to null or to <code>"transparent"</code>.
|
|
It is also possible make a GraphObjects transparent by setting <a href="GraphObject.html#opacity">GraphObject.opacity</a> to 0.
|
|
Finally, one can make a whole <a href="Layer.html">Layer</a>-full of Parts invisible by setting <a href="Layer.html#visible">Layer.visible</a> to false.</p>
|
|
<p>Use the <a href="GraphObject.html#isVisibleObject">isVisibleObject</a> predicate to see if this GraphObject is visible and is inside a <a href="Panel.html">Panel</a>
|
|
that is <a href="GraphObject.html#isVisibleObject">isVisibleObject</a>, and so forth up the chain of panels until reaching the <a href="Part.html">Part</a>.</p>
|
|
<p>For <a href="Part.html">Part</a>s, you can call the <a href="Part.html#isVisible">Part.isVisible</a> predicate to determine
|
|
if not only the Part is visible but also any containing <a href="Group.html">Group</a> or <a href="Link.html">Link</a>,
|
|
and whether the <a href="Layer.html">Layer</a> it is in is visible.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#opacity">opacity</a>, <a href="GraphObject.html#pickable">pickable</a>, <a href="Layer.html#visible">Layer.visible</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="width" class="tsd-anchor"></a>
|
|
<h3>
|
|
width
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span> </h3>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Gets or sets the desired width of this GraphObject in local coordinates.
|
|
This just gets or sets the width component of the <a href="GraphObject.html#desiredSize">desiredSize</a>.
|
|
Default is NaN.</p>
|
|
<p>Size can also be constrained by setting <a href="GraphObject.html#minSize">minSize</a> and <a href="GraphObject.html#maxSize">maxSize</a>.</p>
|
|
<p>The width does not include any transformation due to <a href="GraphObject.html#scale">scale</a> or <a href="GraphObject.html#angle">angle</a>,
|
|
nor any pen thickness due to <a href="Shape.html#strokeWidth">Shape.strokeWidth</a> if this is a <a href="Shape.html">Shape</a>.
|
|
If there is a containing <a href="Panel.html">Panel</a> the Panel will determine the actual size.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
</section>
|
|
<section class="tsd-panel-group tsd-member-group ">
|
|
<h2>Methods</h2>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class">
|
|
<a name="bind" class="tsd-anchor"></a>
|
|
<h3>
|
|
bind
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">bind<span class="tsd-signature-symbol">(</span>binding<span class="tsd-signature-symbol">: </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Add a data-binding of a property on this GraphObject to a property on a data object.
|
|
It is unusual to call this method -- <a href="GraphObject.html#static-make">GraphObject.make</a> will call this method for you
|
|
when you pass it an instance of <a href="Binding.html">Binding</a>.</p>
|
|
<p>Do not add, modify, or remove any Bindings after this object has been copied.</p>
|
|
<p>Read more about <a href="Binding.html">Binding</a>s at <a href="../../intro/dataBinding.html">the Introduction page about Data Bindings</a>.</p>
|
|
</div>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>binding: <a href="Binding.html" class="tsd-signature-type">Binding</a></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-protected">
|
|
<a name="cloneProtected" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagProtected">Protected</span> <span class="tsd-flag ts-flagVirtual">Virtual</span>
|
|
clone<wbr>Protected
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-protected">
|
|
<li class="tsd-signature tsd-kind-icon">clone<wbr>Protected<span class="tsd-signature-symbol">(</span>copy<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">this</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Copies properties from this object to the given object, which must be of the same class.
|
|
This is called by <a href="GraphObject.html#copy">copy</a>.
|
|
This method may be overridden.</p>
|
|
<p>For every property that you add to a subclass of a GraphObject-inheriting class,
|
|
in this method you should assign its value to the copied object.
|
|
For performance reasons you should set all of the same properties to <code>this</code>
|
|
that the constructor does, and in the same order.</p>
|
|
<p>For example, let us define a custom <a href="Link.html">Link</a> class and add two properties:</p>
|
|
<pre><code class="hljs js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">CustomLink</span>(<span class="hljs-params"></span>) </span>{
|
|
go.Link.call(<span class="hljs-keyword">this</span>);
|
|
<span class="hljs-keyword">this</span>._someNewProperty = <span class="hljs-number">17</span>;
|
|
<span class="hljs-keyword">this</span>._someNewProperty2 = []; <span class="hljs-comment">// an Array</span>
|
|
}
|
|
go.Diagram.inherit(CustomLink, go.Link);
|
|
|
|
CustomLink.prototype.cloneProtected = <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params"></span>) </span>{
|
|
<span class="hljs-comment">// Always call the base method in an override</span>
|
|
<span class="hljs-comment">// In TypeScript you would use: super.cloneProtected(copy);</span>
|
|
go.Link.prototype.cloneProtected.call(<span class="hljs-keyword">this</span>, copy);
|
|
<span class="hljs-comment">// assign every new property to the copy:</span>
|
|
copy._someNewProperty = <span class="hljs-keyword">this</span>._someNewProperty;
|
|
copy._someNewProperty2 = <span class="hljs-keyword">this</span>._someNewProperty2.slice(<span class="hljs-number">0</span>); <span class="hljs-comment">// make a copy of the Array</span>
|
|
}</code></pre>
|
|
<p>This ensures that copies of GraphObjects and their subclasses are faithful reproductions.
|
|
Consider for properties that are references to objects whether the reference should be shared
|
|
or whether that object value should be copied as well, resulting in a less shallow copy.
|
|
This is demonstrated above by making a copy of the property value that is an Array,
|
|
so that modifications to the Array will not be shared by copies of the CustomLink.
|
|
Further copies of the Array items might be warranted, depending on their purpose.</p>
|
|
<p>Please read the Introduction page on <a href="../../intro/extensions.html">Extensions</a> for how to override methods and how to call this base method.</p>
|
|
</div>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>copy: <span class="tsd-signature-type">this</span></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class">
|
|
<a name="copy" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagVirtual">Virtual</span>
|
|
copy
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">copy<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">this</span></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Creates a deep copy of this GraphObject and returns it.
|
|
This method is the same as a clone for simple GraphObjects
|
|
such as <a href="Shape.html">Shape</a>, <a href="TextBlock.html">TextBlock</a>, and <a href="Picture.html">Picture</a>.
|
|
For <a href="Panel.html">Panel</a> this method copies the visual tree of GraphObjects that it contains.</p>
|
|
</div>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">this</span></h4>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-static">
|
|
<a name="static-defineBuilder" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagStatic">Static</span>
|
|
define<wbr>Builder
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-static">
|
|
<li class="tsd-signature tsd-kind-icon">define<wbr>Builder<span class="tsd-signature-symbol">(</span>name<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span>, func<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">a</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="ObjectData.html" class="tsd-signature-type">ObjectData</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This static function defines a named function that <a href="GraphObject.html#static-make">GraphObject.make</a> can use to build objects.
|
|
Once this is called one can use the name as the first argument for <a href="GraphObject.html#static-make">GraphObject.make</a>.
|
|
Names are case sensitive.</p>
|
|
<p>The second argument must be a function that returns a newly created object, typically a <a href="GraphObject.html">GraphObject</a>.
|
|
It is commonplace for that object to be a <a href="Panel.html">Panel</a> holding a newly created visual tree of GraphObjects.
|
|
The function receives as its only argument an Array that is holds all of the arguments that are being
|
|
passed to <a href="GraphObject.html#static-make">GraphObject.make</a>, which it may modify in order to change the arguments that GraphObject.make receives.</p>
|
|
<p>Predefined builder names include: <code>"Button"</code>, <code>"TreeExpanderButton"</code>, <code>"SubGraphExpanderButton"</code>,
|
|
<code>"PanelExpanderButton"</code>, and <code>"ContextMenuButton"</code>.
|
|
The implementation of these builders is provided by <a href="../../extensions/Buttons.js">Buttons.js</a>
|
|
in the Extensions directory.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>since</dt>
|
|
<dd><p>1.5</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>name: <span class="tsd-signature-type">string</span></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>a capitalized name; must not be <code>""</code> or <code>"None"</code></p>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<h5>func: <span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">a</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="ObjectData.html" class="tsd-signature-type">ObjectData</a></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>that takes an Array of <code>GraphObject.make</code> arguments and returns a new object</p>
|
|
</div>
|
|
<ul class="tsd-parameters">
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class">
|
|
<a name="getDocumentAngle" class="tsd-anchor"></a>
|
|
<h3>
|
|
get<wbr>Document<wbr>Angle
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">get<wbr>Document<wbr>Angle<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Returns the effective angle that the object is drawn at, in document coordinates, normalized to between 0 and 360.</p>
|
|
<p>Basically this adds together all of the rotation declared by this <a href="GraphObject.html#angle">angle</a> and the angles of all of its containing Panels, including the Part.</p>
|
|
</div>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">number</span></h4>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class">
|
|
<a name="getDocumentBounds" class="tsd-anchor"></a>
|
|
<h3>
|
|
get<wbr>Document<wbr>Bounds
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">get<wbr>Document<wbr>Bounds<span class="tsd-signature-symbol">(</span>result<span class="tsd-signature-symbol">?: </span><a href="Rect.html" class="tsd-signature-type">Rect</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="Rect.html" class="tsd-signature-type">Rect</a></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Returns the Rect in document coordinates for this object's bounds.
|
|
If this GraphObject is a Part, the rect will be identical to its <a href="GraphObject.html#actualBounds">actualBounds</a>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#getDocumentPoint">getDocumentPoint</a></p>
|
|
</dd>
|
|
<dt>since</dt>
|
|
<dd><p>2.0</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5><span class="tsd-flag ts-flagOptional">Optional</span> result: <a href="Rect.html" class="tsd-signature-type">Rect</a></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>an optional Rect that is modified and returned.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <a href="Rect.html" class="tsd-signature-type">Rect</a></h4>
|
|
<p>in document coordinates.</p>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class">
|
|
<a name="getDocumentPoint" class="tsd-anchor"></a>
|
|
<h3>
|
|
get<wbr>Document<wbr>Point
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">get<wbr>Document<wbr>Point<span class="tsd-signature-symbol">(</span>local<span class="tsd-signature-symbol">: </span><a href="Spot.html" class="tsd-signature-type">Spot</a><span class="tsd-signature-symbol"> | </span><a href="Point.html" class="tsd-signature-type">Point</a>, result<span class="tsd-signature-symbol">?: </span><a href="Point.html" class="tsd-signature-type">Point</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="Point.html" class="tsd-signature-type">Point</a></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Returns the Point in document coordinates for a given Spot in this object's bounds
|
|
or for a Point in local coordinates.</p>
|
|
<p>For example, for an instance of a Node like this:</p>
|
|
<pre><code class="hljs js">myDiagram.nodeTemplate =
|
|
$(go.Node, <span class="hljs-string">"Auto"</span>,
|
|
$(go.Shape, <span class="hljs-string">"RoundedRectangle"</span>,
|
|
<span class="hljs-keyword">new</span> go.Binding(<span class="hljs-string">"fill"</span>, <span class="hljs-string">"color"</span>)),
|
|
$(go.TextBlock,
|
|
{ <span class="hljs-attr">name</span>: <span class="hljs-string">"TB"</span>, <span class="hljs-attr">margin</span>: <span class="hljs-number">3</span> },
|
|
<span class="hljs-keyword">new</span> go.Binding(<span class="hljs-string">"text"</span>, <span class="hljs-string">"key"</span>)));</code></pre>
|
|
<p>where the Node is positioned at <code>100, 200</code>,</p>
|
|
<pre><code class="hljs js"> node.findObject(<span class="hljs-string">"TB"</span>).getDocumentPoint(go.Spot.Center)</code></pre>
|
|
<p>could return a Point that is approximately at <code>122, 213</code>.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#getDocumentBounds">getDocumentBounds</a>, <a href="GraphObject.html#getLocalPoint">getLocalPoint</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>local: <a href="Spot.html" class="tsd-signature-type">Spot</a><span class="tsd-signature-symbol"> | </span><a href="Point.html" class="tsd-signature-type">Point</a></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>a real Spot describing a relative location in or near this GraphObject, or a real Point in local coordinates.</p>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<h5><span class="tsd-flag ts-flagOptional">Optional</span> result: <a href="Point.html" class="tsd-signature-type">Point</a></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>an optional Point that is modified and returned.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <a href="Point.html" class="tsd-signature-type">Point</a></h4>
|
|
<p>in document coordinates.</p>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class">
|
|
<a name="getDocumentScale" class="tsd-anchor"></a>
|
|
<h3>
|
|
get<wbr>Document<wbr>Scale
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">get<wbr>Document<wbr>Scale<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Returns the total scale that the object is drawn at, in document coordinates.</p>
|
|
<p>Basically this multiplies together this <a href="GraphObject.html#scale">scale</a> with the scales of all of its containing Panels, including the Part.</p>
|
|
</div>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">number</span></h4>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class">
|
|
<a name="getLocalPoint" class="tsd-anchor"></a>
|
|
<h3>
|
|
get<wbr>Local<wbr>Point
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">get<wbr>Local<wbr>Point<span class="tsd-signature-symbol">(</span>p<span class="tsd-signature-symbol">: </span><a href="Point.html" class="tsd-signature-type">Point</a>, result<span class="tsd-signature-symbol">?: </span><a href="Point.html" class="tsd-signature-type">Point</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="Point.html" class="tsd-signature-type">Point</a></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Given a Point in document coordinates, returns a new Point in local coordinates.</p>
|
|
<p>For example, if you have a mouse event whose <a href="InputEvent.html#documentPoint">InputEvent.documentPoint</a> is at <code>122, 213</code>,
|
|
and if you have a Node whose <a href="GraphObject.html#position">position</a> is at <code>100, 200</code>,
|
|
<code>node.getLocalPoint(e.documentPoint)</code> could return a Point that is at <code>22, 13</code>.
|
|
For a GraphObject within the Node named "TB",</p>
|
|
<pre><code class="hljs js"> node.findObject(<span class="hljs-string">"TB"</span>).getLocalPoint(e.documentPoint)</code></pre>
|
|
<p>could return a Point that is at <code>15.7, 6.7</code>,
|
|
if that "TB" object is positioned somewhat inside the bounds of the Node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#getDocumentPoint">getDocumentPoint</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>p: <a href="Point.html" class="tsd-signature-type">Point</a></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>a real Point in document coordinates.</p>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<h5><span class="tsd-flag ts-flagOptional">Optional</span> result: <a href="Point.html" class="tsd-signature-type">Point</a></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>an optional Point that is modified and returned.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <a href="Point.html" class="tsd-signature-type">Point</a></h4>
|
|
<p>The corresponding Point in local coordinates.</p>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class">
|
|
<a name="isContainedBy" class="tsd-anchor"></a>
|
|
<h3>
|
|
is<wbr>Contained<wbr>By
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">is<wbr>Contained<wbr>By<span class="tsd-signature-symbol">(</span>panel<span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This predicate is true if this object is an element, perhaps indirectly,
|
|
of the given panel.</p>
|
|
<p>For example, if this GraphObject is inside a Part but is not itself the Part,
|
|
<code>obj.isContainedBy(obj.part)</code> should be true.</p>
|
|
</div>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>panel: <a href="GraphObject.html" class="tsd-signature-type">GraphObject</a></h5>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">boolean</span></h4>
|
|
<p>true if this object is contained by the given panel,
|
|
or if it is contained by another panel that is contained by the given panel,
|
|
to any depth; false if the argument is null or is not a <a href="Panel.html">Panel</a>.</p>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class">
|
|
<a name="isEnabledObject" class="tsd-anchor"></a>
|
|
<h3>
|
|
is<wbr>Enabled<wbr>Object
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">is<wbr>Enabled<wbr>Object<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This predicate is false if this object is inside any Panel that is not <a href="Panel.html#isEnabled">Panel.isEnabled</a>,
|
|
or if this is itself a disabled panel.
|
|
This ignores the <a href="GraphObject.html#visible">visible</a> and <a href="GraphObject.html#pickable">pickable</a> properties.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="GraphObject.html#enabledChanged">enabledChanged</a>, <a href="Panel.html#isEnabled">Panel.isEnabled</a></p>
|
|
</dd>
|
|
<dt>since</dt>
|
|
<dd><p>1.7</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">boolean</span></h4>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class">
|
|
<a name="isVisibleObject" class="tsd-anchor"></a>
|
|
<h3>
|
|
is<wbr>Visible<wbr>Object
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">is<wbr>Visible<wbr>Object<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This predicate is true if this object is <a href="GraphObject.html#visible">visible</a>
|
|
and each of its visual containing panels are also visible.
|
|
This ignores the actual location or appearance (except visibility)
|
|
of the panel that this object is part of, as well as ignoring all
|
|
properties of the <a href="Layer.html">Layer</a> or <a href="Diagram.html">Diagram</a>.</p>
|
|
<p>For <a href="Part.html">Part</a>s, you can call the <a href="Part.html#isVisible">Part.isVisible</a> predicate to determine
|
|
if not only the Part is visible but also any containing <a href="Group.html">Group</a> or <a href="Link.html">Link</a> or <a href="Layer.html">Layer</a>.</p>
|
|
</div>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">boolean</span></h4>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static">
|
|
<a name="static-make" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagStatic">Static</span>
|
|
make
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static">
|
|
<li class="tsd-signature tsd-kind-icon">make<T><span class="tsd-signature-symbol">(</span>cls<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">"ToolTip"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"ContextMenu"</span>, <span class="tsd-signature-symbol">...</span>initializers<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> | </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol"> | </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol"> | </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> | </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol"> | </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol"> | </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">T</span></li>
|
|
<li class="tsd-signature tsd-kind-icon">make<T><span class="tsd-signature-symbol">(</span>cls<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">"Button"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"TreeExpanderButton"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"SubGraphExpanderButton"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"ContextMenuButton"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"PanelExpanderButton"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"CheckBoxButton"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"CheckBox"</span>, <span class="tsd-signature-symbol">...</span>initializers<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> | </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol"> | </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol"> | </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> | </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol"> | </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol"> | </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">T</span></li>
|
|
<li class="tsd-signature tsd-kind-icon">make<T><span class="tsd-signature-symbol">(</span>cls<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span>, <span class="tsd-signature-symbol">...</span>initializers<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> | </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol"> | </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol"> | </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> | </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol"> | </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol"> | </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">T</span></li>
|
|
<li class="tsd-signature tsd-kind-icon">make<CT><span class="tsd-signature-symbol">(</span>cls<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">CT</span>, <span class="tsd-signature-symbol">...</span>initializers<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">InstanceType<CT> extends Diagram ? DiagramEventsInterface & { Changed?: ChangedEventHandler; ModelChanged?: ChangedEventHandler; } : {}</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">, </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Panel.html" class="tsd-signature-type">Panel</a><span class="tsd-signature-symbol">, </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Panel.html" class="tsd-signature-type">Panel</a><span class="tsd-signature-symbol">, </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Panel.html" class="tsd-signature-type">Panel</a><span class="tsd-signature-symbol">, </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol">, </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Geometry.html" class="tsd-signature-type">Geometry</a><span class="tsd-signature-symbol">, </span><a href="PathFigure.html" class="tsd-signature-type">PathFigure</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="PathFigure.html" class="tsd-signature-type">PathFigure</a><span class="tsd-signature-symbol">, </span><a href="PathSegment.html" class="tsd-signature-type">PathSegment</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">HTMLDivElement</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">InstanceType<CT> extends Diagram ? DiagramEventsInterface & { Changed?: ChangedEventHandler; ModelChanged?: ChangedEventHandler; } : {}</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">, </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Panel.html" class="tsd-signature-type">Panel</a><span class="tsd-signature-symbol">, </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Panel.html" class="tsd-signature-type">Panel</a><span class="tsd-signature-symbol">, </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Panel.html" class="tsd-signature-type">Panel</a><span class="tsd-signature-symbol">, </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol">, </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Geometry.html" class="tsd-signature-type">Geometry</a><span class="tsd-signature-symbol">, </span><a href="PathFigure.html" class="tsd-signature-type">PathFigure</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="PathFigure.html" class="tsd-signature-type">PathFigure</a><span class="tsd-signature-symbol">, </span><a href="PathSegment.html" class="tsd-signature-type">PathSegment</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">InstanceType</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">></span></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This static function builds an object given its class and additional arguments
|
|
providing initial properties or <a href="GraphObject.html">GraphObject</a>s that become <a href="Panel.html">Panel</a> elements.</p>
|
|
<p>The first argument must be the class type or the name of a class or the name of a predefined kind of Panel.
|
|
This function will construct a new instance of that type and use the rest of the arguments to initialize the object.
|
|
The first argument cannot be a regular Object (such as a GraphObject) that you are trying to initialize;
|
|
for that you can call <a href="GraphObject.html#setProperties">setProperties</a> or <a href="Diagram.html#setProperties">Diagram.setProperties</a>, although that would
|
|
be less efficient than setting properties directly.</p>
|
|
<p>If an initializer argument is an enumerated value, this tries to set the property that seems most appropriate.</p>
|
|
<p>If an initializer argument is a string, this sets a particular property depending on the type of object being built.</p>
|
|
<ul>
|
|
<li>If the object is a <a href="TextBlock.html">TextBlock</a>, it sets <a href="TextBlock.html#text">TextBlock.text</a>.</li>
|
|
<li>If the object is a <a href="Shape.html">Shape</a>, it sets <a href="Shape.html#figure">Shape.figure</a>.</li>
|
|
<li>If the object is a <a href="Picture.html">Picture</a>, it sets <a href="Picture.html#source">Picture.source</a>.</li>
|
|
<li>If the object is a <a href="Panel.html">Panel</a> (including <a href="Part.html">Part</a>, <a href="Node.html">Node</a>, or <a href="Group.html">Group</a>), it sets <a href="Panel.html#type">Panel.type</a>.</li>
|
|
</ul>
|
|
<p>If an initializer argument is a particular kind of object, this can add that object to the object being built.</p>
|
|
<ul>
|
|
<li><a href="GraphObject.html">GraphObject</a>s and <a href="RowColumnDefinition.html">RowColumnDefinition</a>s can only be added as elements of <a href="Panel.html">Panel</a>s.</li>
|
|
<li><a href="Binding.html">Binding</a>s can only be applied to <a href="GraphObject.html">GraphObject</a>s and <a href="RowColumnDefinition.html">RowColumnDefinition</a>s.</li>
|
|
<li><a href="PathFigure.html">PathFigure</a>s can only be added to <a href="Geometry.html">Geometry</a> objects.</li>
|
|
<li><a href="PathSegment.html">PathSegment</a>s can only be added to <a href="PathFigure.html">PathFigure</a> objects.</li>
|
|
<li>Regular JavaScript Arrays provide a sequence of initializer arguments.</li>
|
|
<li>Regular JavaScript objects provide property/value pairs that are set on the object being built.</li>
|
|
</ul>
|
|
<p>When the initializer argument is a plain JavaScript Object, there are several ways that that object's properties are applied.
|
|
If the property name is a string with a period inside it, this has a special meaning if the object is a <a href="Panel.html">Panel</a> or a <a href="Diagram.html">Diagram</a>.
|
|
At the current time only a single period separator is valid syntax for a property string, and it is valid only on Panels and Diagrams.</p>
|
|
<p>For Panels, the substring before the period is used as the name passed to <a href="Panel.html#findObject">Panel.findObject</a>
|
|
to get the actual object on which to set the property, which is the substring after the period.
|
|
This is normally useful only on the predefined Panels:</p>
|
|
<ul>
|
|
<li>a <strong>"Button"</strong> has a <a href="Shape.html">Shape</a> named "ButtonBorder" surrounding the content of the Panel.</li>
|
|
<li>a <strong>"TreeExpanderButton"</strong> has a "ButtonBorder" Shape and a "ButtonIcon" Shape that is the plus-or-minus sign.</li>
|
|
<li>a <strong>"SubGraphExpanderButton"</strong> has a "ButtonBorder" Shape and a "ButtonIcon" Shape that is the plus-or-minus sign.</li>
|
|
<li>a <strong>"ContextMenuButton"</strong> has a Shape named "ButtonBorder" surrounding the content of the Panel.</li>
|
|
</ul>
|
|
<p>But you can define your own names that GraphObject.make can build by calling the static function <a href="GraphObject.html#static-defineBuilder">GraphObject.defineBuilder</a>.</p>
|
|
<p>For Diagrams, the substring before the period is used as the name of a property on the Diagram itself
|
|
to get the actual object on which to set the property.
|
|
As a special case, if such a property value does not exist on the Diagram, it looks on the <a href="Diagram.html#toolManager">Diagram.toolManager</a>.
|
|
See some examples below.</p>
|
|
<p>Also for Diagrams, and only for Diagrams, if the property name is the name of a <a href="DiagramEvent.html">DiagramEvent</a>,
|
|
the property value must be a DiagramEvent listener function, and <a href="Diagram.html#addDiagramListener">Diagram.addDiagramListener</a> is called
|
|
using that DiagramEvent name and that function.
|
|
Note that all DiagramEvent names are capitalized and do not contain any periods,
|
|
so there cannot be any name conflicts with any properties on <a href="Diagram.html">Diagram</a> or <a href="ToolManager.html">ToolManager</a>.
|
|
Although you can register multiple listeners for the same DiagramEvent names, due to JavaScript limitations
|
|
those need to be declared using separate JavaScript objects, because JavaScript does not permit duplicate property names
|
|
in an Object literal.</p>
|
|
<p>Furthermore for Diagrams, if the property name is <code>"Changed"</code> or <code>"ModelChanged"</code>,
|
|
the property value must be a ChangedEvent listener function, which is called with a <a href="ChangedEvent.html">ChangedEvent</a> argument.
|
|
When the property name is <code>"Changed"</code>, it calls <a href="Diagram.html#addChangedListener">Diagram.addChangedListener</a>,
|
|
notifying about changes to the Diagram or its Layers or GraphObjects.
|
|
When the property name is <code>"ModelChanged"</code>, it calls <a href="Model.html#addChangedListener">Model.addChangedListener</a> on the <a href="Diagram.html#model">Diagram.model</a>,
|
|
resulting in notifications about changes to the Model or its data.
|
|
This is handy because the <a href="Diagram.html#model">Diagram.model</a> property setter will automatically call
|
|
<a href="Model.html#removeChangedListener">Model.removeChangedListener</a> on the old model, thereby avoiding any overhead if there are any
|
|
more changes to the old model and also avoiding a reference to the listener which might cause garbage collection retention.
|
|
It also will call <a href="Model.html#addChangedListener">Model.addChangedListener</a> on the new model, helping implement the same behavior with the new model.</p>
|
|
<p>If the property name is a number and if the object being constructed is a <a href="Brush.html">Brush</a>,
|
|
the number and value are added to the Brush by calling <a href="Brush.html#addColorStop">Brush.addColorStop</a>.</p>
|
|
<p>Otherwise the property name is used as a regular property name on the object being built.
|
|
This tries to do some property name and value checking:
|
|
when a property is not defined on the object being built, it will signal an error.
|
|
Many typos can be found this way that would be ignored by JavaScript code.</p>
|
|
<p>If the property name begins with an underscore, this will not complain about the property being undefined.
|
|
Not only is that underscore property set on the object being built, but calls to <a href="GraphObject.html#copy">copy</a>
|
|
will also copy the values of such named properties to the new objects.</p>
|
|
<p>In the samples and in the intro pages this function is called using the alias <code>$</code>.
|
|
You can use a different short name if you would like to preserve the use of <code>$</code> for another JavaScript library.</p>
|
|
<pre><code class="hljs js"> <span class="hljs-keyword">var</span> $ = go.GraphObject.make;
|
|
|
|
<span class="hljs-keyword">var</span> diagram =
|
|
$(go.Diagram, <span class="hljs-string">"myDiagramDiv"</span>,
|
|
{
|
|
<span class="hljs-comment">// don't initialize some properties until after a new model has been loaded</span>
|
|
<span class="hljs-string">"InitialLayoutCompleted"</span>: loadDiagramProperties,
|
|
<span class="hljs-attr">allowZoom</span>: <span class="hljs-literal">false</span>, <span class="hljs-comment">// don't allow the user to change the diagram's scale</span>
|
|
<span class="hljs-string">"grid.visible"</span>: <span class="hljs-literal">true</span>, <span class="hljs-comment">// display a background grid for the whole diagram</span>
|
|
<span class="hljs-string">"grid.gridCellSize"</span>: <span class="hljs-keyword">new</span> go.Size(<span class="hljs-number">20</span>, <span class="hljs-number">20</span>),
|
|
<span class="hljs-comment">// allow double-click in background to create a new node</span>
|
|
<span class="hljs-string">"clickCreatingTool.archetypeNodeData"</span>: { <span class="hljs-attr">text</span>: <span class="hljs-string">"Node"</span> },
|
|
<span class="hljs-comment">// allow Ctrl-G to call the groupSelection command</span>
|
|
<span class="hljs-string">"commandHandler.archetypeGroupData"</span>:
|
|
{ <span class="hljs-attr">text</span>: <span class="hljs-string">"Group"</span>, <span class="hljs-attr">isGroup</span>: <span class="hljs-literal">true</span>, <span class="hljs-attr">color</span>: <span class="hljs-string">"blue"</span> },
|
|
<span class="hljs-string">"toolManager.hoverDelay"</span>: <span class="hljs-number">100</span>, <span class="hljs-comment">// how quickly tooltips are shown</span>
|
|
<span class="hljs-comment">// mouse wheel zooms instead of scrolls</span>
|
|
<span class="hljs-string">"toolManager.mouseWheelBehavior"</span>: go.ToolManager.WheelZoom,
|
|
<span class="hljs-string">"commandHandler.copiesTree"</span>: <span class="hljs-literal">true</span>, <span class="hljs-comment">// for the copy command</span>
|
|
<span class="hljs-string">"commandHandler.deletesTree"</span>: <span class="hljs-literal">true</span>, <span class="hljs-comment">// for the delete command</span>
|
|
<span class="hljs-string">"draggingTool.dragsTree"</span>: <span class="hljs-literal">true</span>, <span class="hljs-comment">// dragging for both move and copy</span>
|
|
<span class="hljs-string">"draggingTool.isGridSnapEnabled"</span>: <span class="hljs-literal">true</span>,
|
|
<span class="hljs-attr">layout</span>: $(go.TreeLayout,
|
|
{ <span class="hljs-attr">angle</span>: <span class="hljs-number">90</span>, <span class="hljs-attr">sorting</span>: go.TreeLayout.SortingAscending })
|
|
});
|
|
|
|
diagram.nodeTemplate =
|
|
$(go.Node, <span class="hljs-string">"Auto"</span>, <span class="hljs-comment">// or go.Panel.Auto</span>
|
|
<span class="hljs-keyword">new</span> go.Binding(<span class="hljs-string">"location"</span>, <span class="hljs-string">"loc"</span>, go.Point.parse).makeTwoWay(go.Point.stringify),
|
|
$(go.Shape, <span class="hljs-string">"RoundedRectangle"</span>,
|
|
{
|
|
<span class="hljs-attr">fill</span>: $(go.Brush, <span class="hljs-string">"Linear"</span>, { <span class="hljs-number">0</span>: <span class="hljs-string">"#FEC901"</span>, <span class="hljs-number">1</span>: <span class="hljs-string">"#FEA200"</span> }),
|
|
<span class="hljs-attr">stroke</span>: <span class="hljs-string">"gray"</span>,
|
|
<span class="hljs-attr">strokeWidth</span>: <span class="hljs-number">2</span>,
|
|
<span class="hljs-attr">strokeDashArray</span>: [<span class="hljs-number">3</span>, <span class="hljs-number">3</span>]
|
|
}),
|
|
$(go.TextBlock,
|
|
{ <span class="hljs-attr">margin</span>: <span class="hljs-number">5</span>, <span class="hljs-attr">font</span>: <span class="hljs-string">"bold 12pt sans-serif"</span> },
|
|
<span class="hljs-keyword">new</span> go.Binding(<span class="hljs-string">"text"</span>, <span class="hljs-string">"key"</span>))
|
|
);</code></pre>
|
|
<p class="boxread">
|
|
See <a href="../../intro/buildingObjects.html">the Introduction page on building objects</a>
|
|
for usage information and examples of GraphObject.make.
|
|
</div>
|
|
<h4 class="tsd-type-parameters-title">Type parameters</h4>
|
|
<ul class="tsd-type-parameters">
|
|
<li>
|
|
<h4>T<span class="tsd-signature-symbol">: </span><a href="Adornment.html" class="tsd-signature-type">Adornment</a></h4>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>cls: <span class="tsd-signature-type">"ToolTip"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"ContextMenu"</span></h5>
|
|
</li>
|
|
<li>
|
|
<h5><span class="tsd-flag ts-flagRest">Rest</span> <span class="tsd-signature-symbol">...</span>initializers: <span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> | </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol"> | </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol"> | </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> | </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol"> | </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol"> | </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">></span></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>zero or more values that initialize the new object,
|
|
typically an Object with properties whose values are set on the new object,
|
|
or a JavaScript Array with additional initializer arguments,
|
|
or a <a href="GraphObject.html">GraphObject</a> that is added to a <a href="Panel.html">Panel</a>,
|
|
or a <a href="Binding.html">Binding</a> for one of the new object's properties,
|
|
or a constant value as the initial value of a single property of the new object that
|
|
is recognized to take that value,
|
|
or a string that is used as the value of a commonly set property.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">T</span></h4>
|
|
</li>
|
|
<li class="tsd-description">
|
|
<h4 class="tsd-type-parameters-title">Type parameters</h4>
|
|
<ul class="tsd-type-parameters">
|
|
<li>
|
|
<h4>T<span class="tsd-signature-symbol">: </span><a href="Panel.html" class="tsd-signature-type">Panel</a></h4>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>cls: <span class="tsd-signature-type">"Button"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"TreeExpanderButton"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"SubGraphExpanderButton"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"ContextMenuButton"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"PanelExpanderButton"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"CheckBoxButton"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"CheckBox"</span></h5>
|
|
</li>
|
|
<li>
|
|
<h5><span class="tsd-flag ts-flagRest">Rest</span> <span class="tsd-signature-symbol">...</span>initializers: <span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> | </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol"> | </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol"> | </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> | </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol"> | </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol"> | </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">></span></h5>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">T</span></h4>
|
|
</li>
|
|
<li class="tsd-description">
|
|
<h4 class="tsd-type-parameters-title">Type parameters</h4>
|
|
<ul class="tsd-type-parameters">
|
|
<li>
|
|
<h4>T<span class="tsd-signature-symbol">: </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a></h4>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>cls: <span class="tsd-signature-type">string</span></h5>
|
|
</li>
|
|
<li>
|
|
<h5><span class="tsd-flag ts-flagRest">Rest</span> <span class="tsd-signature-symbol">...</span>initializers: <span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> | </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol"> | </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol"> | </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> | </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol"> | </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol"> | </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">></span></h5>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">T</span></h4>
|
|
</li>
|
|
<li class="tsd-description">
|
|
<h4 class="tsd-type-parameters-title">Type parameters</h4>
|
|
<ul class="tsd-type-parameters">
|
|
<li>
|
|
<h4>CT<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">ConstructorType</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">></span></h4>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>cls: <span class="tsd-signature-type">CT</span></h5>
|
|
</li>
|
|
<li>
|
|
<h5><span class="tsd-flag ts-flagRest">Rest</span> <span class="tsd-signature-symbol">...</span>initializers: <span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">InstanceType<CT> extends Diagram ? DiagramEventsInterface & { Changed?: ChangedEventHandler; ModelChanged?: ChangedEventHandler; } : {}</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">, </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Panel.html" class="tsd-signature-type">Panel</a><span class="tsd-signature-symbol">, </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Panel.html" class="tsd-signature-type">Panel</a><span class="tsd-signature-symbol">, </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Panel.html" class="tsd-signature-type">Panel</a><span class="tsd-signature-symbol">, </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol">, </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Geometry.html" class="tsd-signature-type">Geometry</a><span class="tsd-signature-symbol">, </span><a href="PathFigure.html" class="tsd-signature-type">PathFigure</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="PathFigure.html" class="tsd-signature-type">PathFigure</a><span class="tsd-signature-symbol">, </span><a href="PathSegment.html" class="tsd-signature-type">PathSegment</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">HTMLDivElement</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">InstanceType<CT> extends Diagram ? DiagramEventsInterface & { Changed?: ChangedEventHandler; ModelChanged?: ChangedEventHandler; } : {}</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">, </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Panel.html" class="tsd-signature-type">Panel</a><span class="tsd-signature-symbol">, </span><a href="GraphObject.html" class="tsd-signature-type">GraphObject</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Panel.html" class="tsd-signature-type">Panel</a><span class="tsd-signature-symbol">, </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Panel.html" class="tsd-signature-type">Panel</a><span class="tsd-signature-symbol">, </span><a href="PanelLayout.html" class="tsd-signature-type">PanelLayout</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="RowColumnDefinition.html" class="tsd-signature-type">RowColumnDefinition</a><span class="tsd-signature-symbol">, </span><a href="Binding.html" class="tsd-signature-type">Binding</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="Geometry.html" class="tsd-signature-type">Geometry</a><span class="tsd-signature-symbol">, </span><a href="PathFigure.html" class="tsd-signature-type">PathFigure</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">MakeAllow</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">, </span><a href="PathFigure.html" class="tsd-signature-type">PathFigure</a><span class="tsd-signature-symbol">, </span><a href="PathSegment.html" class="tsd-signature-type">PathSegment</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">EnumValue</span><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">></span></h5>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">InstanceType</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">CT</span><span class="tsd-signature-symbol">></span></h4>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class">
|
|
<a name="setProperties" class="tsd-anchor"></a>
|
|
<h3>
|
|
set<wbr>Properties
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">set<wbr>Properties<span class="tsd-signature-symbol">(</span>props<span class="tsd-signature-symbol">: </span><a href="ObjectData.html" class="tsd-signature-type">ObjectData</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This method sets a collection of properties according to the property/value pairs that have been set on the given Object,
|
|
in the same manner as <a href="GraphObject.html#static-make">GraphObject.make</a> does when constructing a GraphObject with an argument that is a simple JavaScript Object.</p>
|
|
<p>If this is a <a href="Panel.html">Panel</a>, you can set properties on named elements within the panel by using a <em>name.property</em> syntax for the property name.
|
|
For example, if a <a href="Node.html">Node</a> has a <a href="Picture.html">Picture</a> that is named "ICON" (because its <a href="GraphObject.html#name">name</a> property has been set to "ICON")
|
|
and a <a href="TextBlock.html">TextBlock</a> whose name is "TB", one could set properties on the Node and on each of those named elements by:</p>
|
|
<pre><code class="hljs js">aNode.setProperties({
|
|
<span class="hljs-attr">background</span>: <span class="hljs-string">"red"</span>,
|
|
<span class="hljs-string">"ICON.source"</span>: <span class="hljs-string">"https://www.example.com/images/alert.jpg"</span>,
|
|
<span class="hljs-string">"TB.font"</span>: <span class="hljs-string">"bold 12pt sans-serif"</span>
|
|
});</code></pre>
|
|
<p>At the current time only a single dot is permitted in the property "name".
|
|
Note that the use of all-upper-case object names is simply a convention.</p>
|
|
<p>Calling this method is much less efficient than setting properties directly.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>since</dt>
|
|
<dd><p>1.5</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>props: <a href="ObjectData.html" class="tsd-signature-type">ObjectData</a></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>a plain JavaScript object with various property values to be set on this GraphObject.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-static">
|
|
<a name="static-takeBuilderArgument" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagStatic">Static</span>
|
|
take<wbr>Builder<wbr>Argument
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-static">
|
|
<li class="tsd-signature tsd-kind-icon">take<wbr>Builder<wbr>Argument<span class="tsd-signature-symbol">(</span>args<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol">></span>, defval<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">any</span>, pred<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">a</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">any</span></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This static function returns the first argument from the arguments array passed
|
|
to a <a href="GraphObject.html#static-defineBuilder">GraphObject.defineBuilder</a> function by <a href="GraphObject.html#static-make">GraphObject.make</a>.
|
|
By default this requires the first argument to be a string,
|
|
but you can provide a predicate to determine whether the argument is suitable.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>since</dt>
|
|
<dd><p>1.5</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>args: <span class="tsd-signature-type">Array</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol">></span></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>the arguments Array passed to the builder function;
|
|
this may be modified if an acceptable argument is found and returned</p>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<h5><span class="tsd-flag ts-flagOptional">Optional</span> defval: <span class="tsd-signature-type">any</span></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>the default value to return if the argument is optional and not present as the first argument;
|
|
otherwise throw an error when the argument is not there</p>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<h5><span class="tsd-flag ts-flagOptional">Optional</span> pred: <span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">a</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>a predicate to determine the acceptability of the argument;
|
|
the default predicate checks whether the argument is a string</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">any</span></h4>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
</section>
|
|
<section class="tsd-panel-group tsd-member-group ">
|
|
<h2>Constants</h2>
|
|
<section class="tsd-panel tsd-member tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a name="static-Default" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagStatic">Static</span>
|
|
Default
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span> </h3>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>GraphObjects with this enumeration as the value of <a href="GraphObject.html#stretch">GraphObject.stretch</a>
|
|
are stretched depending on the context they are used. For instance a 'Circle' figure might
|
|
be uniformly stretched whereas an 'Ellipse' figure might be non-uniformly stretched.</p>
|
|
</div>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a name="static-Fill" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagStatic">Static</span>
|
|
Fill
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span> </h3>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>GraphObjects with this enumeration as the value of <a href="GraphObject.html#stretch">GraphObject.stretch</a>
|
|
are scaled in both directions so as to fit exactly in the given bounds;
|
|
there is no clipping but the aspect ratio may change, causing the object to appear stretched.</p>
|
|
</div>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a name="static-FlipBoth" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagStatic">Static</span>
|
|
Flip<wbr>Both
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span> </h3>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>GraphObjects with this enumeration as the value of <a href="Picture.html#flip">Picture.flip</a> or <a href="TextBlock.html#flip">TextBlock.flip</a>
|
|
are drawn with both X and Y coordinates reversed.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>since</dt>
|
|
<dd><p>2.0</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a name="static-FlipHorizontal" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagStatic">Static</span>
|
|
Flip<wbr>Horizontal
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span> </h3>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>GraphObjects with this enumeration as the value of <a href="Picture.html#flip">Picture.flip</a> or <a href="TextBlock.html#flip">TextBlock.flip</a>
|
|
are drawn mirror-image, with X coordinate points increasing towards the left.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>since</dt>
|
|
<dd><p>2.0</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a name="static-FlipVertical" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagStatic">Static</span>
|
|
Flip<wbr>Vertical
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span> </h3>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>GraphObjects with this enumeration as the value of <a href="Picture.html#flip">Picture.flip</a> or <a href="TextBlock.html#flip">TextBlock.flip</a>
|
|
are drawn upside-down, with Y coordinate points increasing upwards.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>since</dt>
|
|
<dd><p>2.0</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a name="static-Horizontal" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagStatic">Static</span>
|
|
Horizontal
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">any</span> </h3>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>GraphObjects with this enumeration as the value of <a href="GraphObject.html#stretch">GraphObject.stretch</a>
|
|
are scaled as much as possible in the x-axis. In another context, can be used as a value of PanelLayout, so type is "any".</p>
|
|
</div>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a name="static-None" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagStatic">Static</span>
|
|
None
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span> </h3>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>GraphObjects with this enumeration as the value of <a href="GraphObject.html#stretch">GraphObject.stretch</a>
|
|
are not automatically scaled to fit in the given bounds;
|
|
there may be clipping in one or both directions if the available dimensions are too small.</p>
|
|
</div>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a name="static-Uniform" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagStatic">Static</span>
|
|
Uniform
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span> </h3>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Pictures with this enumeration as the value of <a href="Picture.html#imageStretch">Picture.imageStretch</a> are drawn with equal
|
|
scale in both directions to fit the arranged (actual) bounds;
|
|
Panels of type Viewbox with this as the value of <a href="Panel.html#viewboxStretch">Panel.viewboxStretch</a>
|
|
are scaled equally in both directions to fit in the given bounds.</p>
|
|
</div>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a name="static-UniformToFill" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagStatic">Static</span>
|
|
Uniform<wbr>ToFill
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span> </h3>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Pictures with this enumeration as the value of <a href="Picture.html#imageStretch">Picture.imageStretch</a> are drawn with equal
|
|
scale in both directions to fit the larger side of the image bounds;
|
|
Panels of type Viewbox with this as the value of <a href="Panel.html#viewboxStretch">Panel.viewboxStretch</a>
|
|
are scaled equally in both directions to fit the larger side of the element's bounds.
|
|
there may be clipping in one dimension.</p>
|
|
</div>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a name="static-Vertical" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagStatic">Static</span>
|
|
Vertical
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">any</span> </h3>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>GraphObjects with this enumeration as the value of <a href="GraphObject.html#stretch">GraphObject.stretch</a>
|
|
are scaled as much as possible in the y-axis. In another context, can be used as a value of PanelLayout, so type is "any".</p>
|
|
</div>
|
|
</section>
|
|
</section>
|
|
</div>
|
|
<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
|
|
<nav class="tsd-navigation primary">
|
|
<ul>
|
|
<li class="globals ">
|
|
<a href="../index.html"><em>GoJS <wbr>Class <wbr>Index</em></a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
<nav class="tsd-navigation secondary menu-sticky">
|
|
<ul class="before-current">
|
|
</ul>
|
|
<ul class="current">
|
|
<li class="current tsd-kind-class">
|
|
<a href="GraphObject.html" class="tsd-kind-icon">Graph<wbr>Object</a>
|
|
<ul>
|
|
<li class=" tsd-kind-constructor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#constructor" class="tsd-kind-icon">constructor</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#actionCancel" class="tsd-kind-icon">action<wbr>Cancel</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#actionDown" class="tsd-kind-icon">action<wbr>Down</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#actionMove" class="tsd-kind-icon">action<wbr>Move</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#actionUp" class="tsd-kind-icon">action<wbr>Up</a>
|
|
</li>
|
|
<li class=" tsd-kind-get-signature tsd-parent-kind-class">
|
|
<a href="GraphObject.html#actualBounds" class="tsd-kind-icon">actual<wbr>Bounds</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#alignment" class="tsd-kind-icon">alignment</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#alignmentFocus" class="tsd-kind-icon">alignment<wbr>Focus</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#angle" class="tsd-kind-icon">angle</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#areaBackground" class="tsd-kind-icon">area<wbr>Background</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#background" class="tsd-kind-icon">background</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#click" class="tsd-kind-icon">click</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#column" class="tsd-kind-icon">column</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#columnSpan" class="tsd-kind-icon">column<wbr>Span</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#contextClick" class="tsd-kind-icon">context<wbr>Click</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#contextMenu" class="tsd-kind-icon">context<wbr>Menu</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#cursor" class="tsd-kind-icon">cursor</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#desiredSize" class="tsd-kind-icon">desired<wbr>Size</a>
|
|
</li>
|
|
<li class=" tsd-kind-get-signature tsd-parent-kind-class">
|
|
<a href="GraphObject.html#diagram" class="tsd-kind-icon">diagram</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#doubleClick" class="tsd-kind-icon">double<wbr>Click</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#enabledChanged" class="tsd-kind-icon">enabled<wbr>Changed</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#fromEndSegmentLength" class="tsd-kind-icon">from<wbr>End<wbr>Segment<wbr>Length</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#fromLinkable" class="tsd-kind-icon">from<wbr>Linkable</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#fromLinkableDuplicates" class="tsd-kind-icon">from<wbr>Linkable<wbr>Duplicates</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#fromLinkableSelfNode" class="tsd-kind-icon">from<wbr>Linkable<wbr>Self<wbr>Node</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#fromMaxLinks" class="tsd-kind-icon">from<wbr>Max<wbr>Links</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#fromShortLength" class="tsd-kind-icon">from<wbr>Short<wbr>Length</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#fromSpot" class="tsd-kind-icon">from<wbr>Spot</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#height" class="tsd-kind-icon">height</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#isActionable" class="tsd-kind-icon">is<wbr>Actionable</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#isPanelMain" class="tsd-kind-icon">is<wbr>Panel<wbr>Main</a>
|
|
</li>
|
|
<li class=" tsd-kind-get-signature tsd-parent-kind-class">
|
|
<a href="GraphObject.html#layer" class="tsd-kind-icon">layer</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#margin" class="tsd-kind-icon">margin</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#maxSize" class="tsd-kind-icon">max<wbr>Size</a>
|
|
</li>
|
|
<li class=" tsd-kind-get-signature tsd-parent-kind-class">
|
|
<a href="GraphObject.html#measuredBounds" class="tsd-kind-icon">measured<wbr>Bounds</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#minSize" class="tsd-kind-icon">min<wbr>Size</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#mouseDragEnter" class="tsd-kind-icon">mouse<wbr>Drag<wbr>Enter</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#mouseDragLeave" class="tsd-kind-icon">mouse<wbr>Drag<wbr>Leave</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#mouseDrop" class="tsd-kind-icon">mouse<wbr>Drop</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#mouseEnter" class="tsd-kind-icon">mouse<wbr>Enter</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#mouseHold" class="tsd-kind-icon">mouse<wbr>Hold</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#mouseHover" class="tsd-kind-icon">mouse<wbr>Hover</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#mouseLeave" class="tsd-kind-icon">mouse<wbr>Leave</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#mouseOver" class="tsd-kind-icon">mouse<wbr>Over</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#name" class="tsd-kind-icon">name</a>
|
|
</li>
|
|
<li class=" tsd-kind-get-signature tsd-parent-kind-class">
|
|
<a href="GraphObject.html#naturalBounds" class="tsd-kind-icon">natural<wbr>Bounds</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#opacity" class="tsd-kind-icon">opacity</a>
|
|
</li>
|
|
<li class=" tsd-kind-get-signature tsd-parent-kind-class">
|
|
<a href="GraphObject.html#panel" class="tsd-kind-icon">panel</a>
|
|
</li>
|
|
<li class=" tsd-kind-get-signature tsd-parent-kind-class">
|
|
<a href="GraphObject.html#part" class="tsd-kind-icon">part</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#pickable" class="tsd-kind-icon">pickable</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#portId" class="tsd-kind-icon">port<wbr>Id</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#position" class="tsd-kind-icon">position</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#row" class="tsd-kind-icon">row</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#rowSpan" class="tsd-kind-icon">row<wbr>Span</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#scale" class="tsd-kind-icon">scale</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#segmentFraction" class="tsd-kind-icon">segment<wbr>Fraction</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#segmentIndex" class="tsd-kind-icon">segment<wbr>Index</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#segmentOffset" class="tsd-kind-icon">segment<wbr>Offset</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#segmentOrientation" class="tsd-kind-icon">segment<wbr>Orientation</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#shadowVisible" class="tsd-kind-icon">shadow<wbr>Visible</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#stretch" class="tsd-kind-icon">stretch</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#toEndSegmentLength" class="tsd-kind-icon">to<wbr>End<wbr>Segment<wbr>Length</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#toLinkable" class="tsd-kind-icon">to<wbr>Linkable</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#toLinkableDuplicates" class="tsd-kind-icon">to<wbr>Linkable<wbr>Duplicates</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#toLinkableSelfNode" class="tsd-kind-icon">to<wbr>Linkable<wbr>Self<wbr>Node</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#toMaxLinks" class="tsd-kind-icon">to<wbr>Max<wbr>Links</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#toShortLength" class="tsd-kind-icon">to<wbr>Short<wbr>Length</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#toSpot" class="tsd-kind-icon">to<wbr>Spot</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#toolTip" class="tsd-kind-icon">tool<wbr>Tip</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#visible" class="tsd-kind-icon">visible</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="GraphObject.html#width" class="tsd-kind-icon">width</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="GraphObject.html#bind" class="tsd-kind-icon">bind</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class tsd-is-protected">
|
|
<a href="GraphObject.html#cloneProtected" class="tsd-kind-icon">clone<wbr>Protected</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="GraphObject.html#copy" class="tsd-kind-icon">copy</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class tsd-is-static">
|
|
<a href="GraphObject.html#static-defineBuilder" class="tsd-kind-icon">define<wbr>Builder</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="GraphObject.html#getDocumentAngle" class="tsd-kind-icon">get<wbr>Document<wbr>Angle</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="GraphObject.html#getDocumentBounds" class="tsd-kind-icon">get<wbr>Document<wbr>Bounds</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="GraphObject.html#getDocumentPoint" class="tsd-kind-icon">get<wbr>Document<wbr>Point</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="GraphObject.html#getDocumentScale" class="tsd-kind-icon">get<wbr>Document<wbr>Scale</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="GraphObject.html#getLocalPoint" class="tsd-kind-icon">get<wbr>Local<wbr>Point</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="GraphObject.html#isContainedBy" class="tsd-kind-icon">is<wbr>Contained<wbr>By</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="GraphObject.html#isEnabledObject" class="tsd-kind-icon">is<wbr>Enabled<wbr>Object</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="GraphObject.html#isVisibleObject" class="tsd-kind-icon">is<wbr>Visible<wbr>Object</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static">
|
|
<a href="GraphObject.html#static-make" class="tsd-kind-icon">make</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="GraphObject.html#setProperties" class="tsd-kind-icon">set<wbr>Properties</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class tsd-is-static">
|
|
<a href="GraphObject.html#static-takeBuilderArgument" class="tsd-kind-icon">take<wbr>Builder<wbr>Argument</a>
|
|
</li>
|
|
<li class=" tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a href="GraphObject.html#static-Default" class="tsd-kind-icon">Default</a>
|
|
</li>
|
|
<li class=" tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a href="GraphObject.html#static-Fill" class="tsd-kind-icon">Fill</a>
|
|
</li>
|
|
<li class=" tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a href="GraphObject.html#static-FlipBoth" class="tsd-kind-icon">Flip<wbr>Both</a>
|
|
</li>
|
|
<li class=" tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a href="GraphObject.html#static-FlipHorizontal" class="tsd-kind-icon">Flip<wbr>Horizontal</a>
|
|
</li>
|
|
<li class=" tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a href="GraphObject.html#static-FlipVertical" class="tsd-kind-icon">Flip<wbr>Vertical</a>
|
|
</li>
|
|
<li class=" tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a href="GraphObject.html#static-Horizontal" class="tsd-kind-icon">Horizontal</a>
|
|
</li>
|
|
<li class=" tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a href="GraphObject.html#static-None" class="tsd-kind-icon">None</a>
|
|
</li>
|
|
<li class=" tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a href="GraphObject.html#static-Uniform" class="tsd-kind-icon">Uniform</a>
|
|
</li>
|
|
<li class=" tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a href="GraphObject.html#static-UniformToFill" class="tsd-kind-icon">Uniform<wbr>ToFill</a>
|
|
</li>
|
|
<li class=" tsd-kind-constant tsd-parent-kind-class tsd-is-static">
|
|
<a href="GraphObject.html#static-Vertical" class="tsd-kind-icon">Vertical</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
<ul class="after-current">
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="container-fluid bottom-copyright plr15">
|
|
Copyright © 1998-2019 by Northwoods Software Corporation.
|
|
</div>
|
|
<div class="overlay"></div>
|
|
<script src="../assets/js/main.js"></script>
|
|
<script src="../../assets/js/api.js"></script>
|
|
<script src="../../assets/js/bootstrap.min.js"></script>
|
|
<script>if (location.protocol == 'file:') document.write('<script src="../assets/js/search.js"><' + '/script>');</script>
|
|
<script>
|
|
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
|
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
|
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
|
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
|
|
|
|
ga('create', 'UA-1506307-5', 'auto');
|
|
ga('send', 'pageview');
|
|
</script>
|
|
</body>
|
|
</html> |