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.
985 lines
62 KiB
985 lines
62 KiB
<!doctype html>
|
|
<html class="default no-js">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<title>Layout | 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 Layout</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">Layout</span>
|
|
<ul class="tsd-hierarchy">
|
|
<li>
|
|
<a href="GridLayout.html" class="tsd-signature-type">GridLayout</a>
|
|
</li>
|
|
<li>
|
|
<a href="CircularLayout.html" class="tsd-signature-type">CircularLayout</a>
|
|
</li>
|
|
<li>
|
|
<a href="ForceDirectedLayout.html" class="tsd-signature-type">ForceDirectedLayout</a>
|
|
</li>
|
|
<li>
|
|
<a href="LayeredDigraphLayout.html" class="tsd-signature-type">LayeredDigraphLayout</a>
|
|
</li>
|
|
<li>
|
|
<a href="TreeLayout.html" class="tsd-signature-type">TreeLayout</a>
|
|
</li>
|
|
<li>
|
|
<a href="PackedLayout.html" class="tsd-signature-type">PackedLayout</a>
|
|
</li>
|
|
<li>
|
|
<a href="RadialLayout.html" class="tsd-signature-type">RadialLayout</a>
|
|
</li>
|
|
<li>
|
|
<a href="SerpentineLayout.html" class="tsd-signature-type">SerpentineLayout</a>
|
|
</li>
|
|
<li>
|
|
<a href="SpiralLayout.html" class="tsd-signature-type">SpiralLayout</a>
|
|
</li>
|
|
<li>
|
|
<a href="TableLayout.html" class="tsd-signature-type">TableLayout</a>
|
|
</li>
|
|
<li>
|
|
<a href="TreeMapLayout.html" class="tsd-signature-type">TreeMapLayout</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-comment">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>This is the base class for all of the predefined diagram layout implementations.
|
|
They only arrange <a href="Part.html">Part</a>s (primarily <a href="Node.html">Node</a>s and <a href="Link.html">Link</a>s) in a <a href="Diagram.html">Diagram</a>,
|
|
not to <a href="GraphObject.html">GraphObject</a>s in <a href="Panel.html">Panel</a>s (i.e. panel layout).</p>
|
|
<p>The layout classes include <a href="TreeLayout.html">TreeLayout</a>, <a href="ForceDirectedLayout.html">ForceDirectedLayout</a>,
|
|
<a href="LayeredDigraphLayout.html">LayeredDigraphLayout</a>, <a href="CircularLayout.html">CircularLayout</a>, and <a href="GridLayout.html">GridLayout</a>.
|
|
This base class is not abstract -- in fact an instance of this base class is the default
|
|
value for <a href="Diagram.html#layout">Diagram.layout</a> and for <a href="Group.html#layout">Group.layout</a>.</p>
|
|
<p>An instance of a Layout class will be the value of <a href="Diagram.html#layout">Diagram.layout</a>.
|
|
That layout positions the graph of top-level nodes and links.
|
|
Nodes and links that belong to a <a href="Group.html">Group</a> are laid out by that group's <a href="Group.html#layout">Group.layout</a>.
|
|
The Diagram will automatically perform all nested group layouts before laying out the whole diagram.</p>
|
|
<p>If you have position information for all of the nodes when you load a model,
|
|
you will typically have data bound the <a href="Part.html#location">Part.location</a> to some property on your node data.
|
|
In order to avoid an initial layout causing those saved node positions to be discarded,
|
|
you can either not set the <a href="Diagram.html#layout">Diagram.layout</a> to a predefined layout or you can
|
|
set <a href="Layout.html#isInitial">isInitial</a> to false.</p>
|
|
<p>Because performing layouts can be expensive in space and time, automatic layouts
|
|
are performed only on "invalid" layouts, and only well after a layout has been invalidated.
|
|
This state is held by the <a href="Layout.html#isValidLayout">isValidLayout</a> property.
|
|
Many standard operations, such as adding or removing nodes or links, will cause
|
|
the layout that is responsible for positioning those nodes or routing those links
|
|
to be invalidated.
|
|
Such invalidation is performed by calling <a href="Layout.html#invalidateLayout">invalidateLayout</a>,
|
|
which not only clears the <a href="Layout.html#isValidLayout">isValidLayout</a> state but also requests that the diagram
|
|
do an automatic layout soon.
|
|
You can avoid such invalidations by setting <a href="Layout.html#isOngoing">isOngoing</a> to false.</p>
|
|
<p>Layouts will ignore parts that have <a href="Part.html#isLayoutPositioned">Part.isLayoutPositioned</a> set to false
|
|
or parts that are not <a href="GraphObject.html#visible">GraphObject.visible</a>.
|
|
Layouts will also ignore parts that are in layers that are <a href="Layer.html#isTemporary">Layer.isTemporary</a>.</p>
|
|
<p>Various operations on <a href="Part.html">Part</a>s will cause the responsible Layout to be invalidated.
|
|
This includes adding or removing parts, changing their visibility, and changing their size.
|
|
You can disable such automatic layout invalidations by setting <a href="Part.html#layoutConditions">Part.layoutConditions</a>
|
|
to the combination of Part flags named "Layout..." that you want.</p>
|
|
<p>But operations on parts are not the only way in which layouts become invalidated.
|
|
Setting most properties on the layouts, thereby changing their behavior, will invalidate that layout.
|
|
Replacing the <a href="Diagram.html#layout">Diagram.layout</a> or <a href="Group.html#layout">Group.layout</a> will automatically invalidate the new layout.
|
|
If <a href="Layout.html#isViewportSized">isViewportSized</a> is true, when a diagram's <a href="Diagram.html#viewportBounds">Diagram.viewportBounds</a> changes size,
|
|
the <a href="Diagram.html#layout">Diagram.layout</a> is invalidated.
|
|
(This is normally only true for <a href="GridLayout.html">GridLayout</a>s when its <a href="GridLayout.html#wrappingWidth">GridLayout.wrappingWidth</a> is <code>NaN</code>.
|
|
Most layouts do not care about the size of the viewport.)</p>
|
|
<p>You can also explicitly call <a href="Diagram.html#layoutDiagram">Diagram.layoutDiagram</a>, which can invalidate all layouts and
|
|
then perform them all.
|
|
But we recommend that you avoid doing so, to allow the normal updating process perform layouts as needed.</p>
|
|
<p>If an automatic layout is the first time that a layout has been performed for the model,
|
|
the diagram first raises the <a href="DiagramEvent.html">DiagramEvent</a> named "InitialLayoutCompleted".
|
|
Whenever a Diagram finishes an automatic layout, it raises the DiagramEvent named "LayoutCompleted".</p>
|
|
<p>It is also possible to call <a href="Layout.html#doLayout">doLayout</a> explicitly, but this is uncommon and only used with
|
|
instances of Layout that are not the <a href="Diagram.html#layout">Diagram.layout</a> or <a href="Group.html#layout">Group.layout</a>.
|
|
It should only be needed when you want to layout a collection of nodes and links that is not
|
|
the normal graph of top-level parts of a Diagram or a subgraph of a Group.</p>
|
|
<p>More complicated layouts make use of a separate <a href="LayoutNetwork.html">LayoutNetwork</a>, consisting of <a href="LayoutVertex.html">LayoutVertex</a>es and <a href="LayoutEdge.html">LayoutEdge</a>s,
|
|
that normally holds a graph that is isomorphic to the graph consisting of <a href="Node.html">Node</a>s and <a href="Link.html">Link</a>s in the <a href="Diagram.html">Diagram</a> or <a href="Group.html">Group</a>.
|
|
The implementation of <a href="Layout.html#doLayout">doLayout</a> will call <a href="Layout.html#makeNetwork">makeNetwork</a> and remember the result as the <a href="Layout.html#network">network</a>.
|
|
<a href="Layout.html#makeNetwork">makeNetwork</a> will call <a href="Layout.html#createNetwork">createNetwork</a> and initialize it by adding new instances of LayoutVertexes and LayoutEdges
|
|
corresponding to the given collection of Nodes and Links.</p>
|
|
<p>When <a href="Layout.html#doLayout">doLayout</a> is finished with its work it will call <a href="Layout.html#updateParts">updateParts</a>, which will call <a href="Layout.html#commitLayout">commitLayout</a>
|
|
to set new node locations and route links. It then normally discards the <a href="Layout.html#network">network</a>.</p>
|
|
<p>The LayoutVertex and LayoutEdge instances allow the layout to work with more information about each Node and Link without
|
|
actually modifying those Nodes and Links until <a href="Layout.html#commitLayout">commitLayout</a> is called to actually set the Node locations and route the Links.
|
|
The use of a LayoutNetwork also allows the Layout to work with a graph that is not isomorphic to the given collection of Nodes and Links.
|
|
This is useful when needing to use dummy vertexes and/or edges to achieve certain layout behaviors,
|
|
or when one wants to ignore certain vertexes or edges, without actually modifying or adding or removing the diagram's nodes or links.</p>
|
|
<p>An instance of this base class provides a rudimentary default layout that will position
|
|
all of the parts that have no position (i.e. the <a href="Part.html#location">Part.location</a> is (NaN,NaN).
|
|
Parts that already have a position are ignored.
|
|
This primitive layout class does not make use of a <a href="LayoutNetwork.html">LayoutNetwork</a> because
|
|
it ignores all links.</p>
|
|
<p>To implement your own custom layouts, you can inherit from either this class or
|
|
from one of the other predefined layout classes.
|
|
If you inherit from this base class, you will want to override the <a href="Layout.html#doLayout">doLayout</a> method.
|
|
You can call the <a href="Part.html#move">Part.move</a> method to re-position a part, including whole groups.
|
|
Please read the Introduction page on <a href="../../intro/extensions.html">Extensions</a> for how to override methods and how to call a base method.</p>
|
|
</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="Layout.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="Layout.html#arrangementOrigin" class="tsd-kind-icon">arrangement<wbr>Origin</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#boundsComputation" class="tsd-kind-icon">bounds<wbr>Computation</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#diagram" class="tsd-kind-icon">diagram</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#group" class="tsd-kind-icon">group</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#isInitial" class="tsd-kind-icon">is<wbr>Initial</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#isOngoing" class="tsd-kind-icon">is<wbr>Ongoing</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#isRealtime" class="tsd-kind-icon">is<wbr>Realtime</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#isRouting" class="tsd-kind-icon">is<wbr>Routing</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#isValidLayout" class="tsd-kind-icon">is<wbr>Valid<wbr>Layout</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#isViewportSized" class="tsd-kind-icon">is<wbr>Viewport<wbr>Sized</a></li>
|
|
<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#network" class="tsd-kind-icon">network</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 tsd-is-protected"><a href="Layout.html#cloneProtected" class="tsd-kind-icon">clone<wbr>Protected</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class tsd-is-protected"><a href="Layout.html#collectParts" class="tsd-kind-icon">collect<wbr>Parts</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class tsd-is-protected"><a href="Layout.html#commitLayout" class="tsd-kind-icon">commit<wbr>Layout</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="Layout.html#copy" class="tsd-kind-icon">copy</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="Layout.html#createNetwork" class="tsd-kind-icon">create<wbr>Network</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="Layout.html#doLayout" class="tsd-kind-icon">do<wbr>Layout</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="Layout.html#getLayoutBounds" class="tsd-kind-icon">get<wbr>Layout<wbr>Bounds</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class tsd-is-protected"><a href="Layout.html#initialOrigin" class="tsd-kind-icon">initial<wbr>Origin</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="Layout.html#invalidateLayout" class="tsd-kind-icon">invalidate<wbr>Layout</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="Layout.html#makeNetwork" class="tsd-kind-icon">make<wbr>Network</a></li>
|
|
<li class="tsd-kind-method tsd-parent-kind-class"><a href="Layout.html#updateParts" class="tsd-kind-icon">update<wbr>Parts</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>Layout<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="Layout.html" class="tsd-signature-type">Layout</a></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Create a minimal layout that only positions <a href="Node.html">Node</a>s that do not have a location.</p>
|
|
</div>
|
|
<h4 class="tsd-returns-title">Returns <a href="Layout.html" class="tsd-signature-type">Layout</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="arrangementOrigin" class="tsd-anchor"></a>
|
|
<h3>
|
|
arrangement<wbr>Origin
|
|
<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 top-left point for where the graph should be positioned when laid out.
|
|
The default value for this property is the Point(0, 0).
|
|
Setting this property to a new value invalidates this layout.
|
|
This property is likely to be set by many Layouts that belong to a Group when the layout is performed.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="boundsComputation" class="tsd-anchor"></a>
|
|
<h3>
|
|
bounds<wbr>Computation
|
|
<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">function</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">part</span><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-symbol">lay</span><span class="tsd-signature-symbol">: </span><a href="Layout.html" class="tsd-signature-type">Layout</a><span class="tsd-signature-symbol">, </span><span class="tsd-signature-symbol">rect</span><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><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 a function that determines the initial size and position in document coordinates of a LayoutVertex corresponding to a Node.
|
|
This function is called by <a href="Layout.html#getLayoutBounds">getLayoutBounds</a>.
|
|
The default value for this property is null, in which case the <a href="GraphObject.html#actualBounds">GraphObject.actualBounds</a> of the Node is used.
|
|
Setting this property to a new value invalidates this layout.</p>
|
|
<p>The non-null value must be a function that takes 3 arguments.
|
|
The first argument will be the Part whose bounds the Layout should use.
|
|
The second argument will be this Layout.
|
|
The third argument will be a Rect that must be modified and returned
|
|
The return value must be in document coordinates. You may find it convenient to call <a href="GraphObject.html#getDocumentBounds">GraphObject.getDocumentBounds</a>
|
|
to get the bounds in document coordinates of an object within the node.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>since</dt>
|
|
<dd><p>2.0</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="diagram" class="tsd-anchor"></a>
|
|
<h3>
|
|
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>Gets the <a href="Diagram.html">Diagram</a> that owns this layout, if it is the value of <a href="Diagram.html#layout">Diagram.layout</a>.</p>
|
|
<p>If this property and <a href="Layout.html#group">group</a> are non-null, the Group should be in this Diagram.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="Layout.html#group">group</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="group" class="tsd-anchor"></a>
|
|
<h3>
|
|
group
|
|
<span class="tsd-signature-symbol">: </span><a href="Group.html" class="tsd-signature-type">Group</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>Gets the <a href="Group.html">Group</a> that uses this layout, if it is the value of a group's <a href="Group.html#layout">Group.layout</a>.</p>
|
|
<p>If this property is set to a Group, the <a href="Layout.html#diagram">diagram</a> is automatically set to be the Group's Diagram.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>see</dt>
|
|
<dd><p><a href="Layout.html#diagram">diagram</a></p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="isInitial" class="tsd-anchor"></a>
|
|
<h3>
|
|
is<wbr>Initial
|
|
<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 this layout is performed on an initial layout.
|
|
The default value is true.
|
|
Setting this property to false causes <a href="Layout.html#isValidLayout">isValidLayout</a> to be set to true
|
|
so that the diagram does not perform this layout.</p>
|
|
<p>If you set both <a href="Layout.html#isInitial">isInitial</a> and <a href="Layout.html#isOngoing">isOngoing</a> to false,
|
|
there will be no automatic layout invalidation, because <a href="Layout.html#invalidateLayout">invalidateLayout</a>
|
|
will not set <a href="Layout.html#isValidLayout">isValidLayout</a> to false.
|
|
To get your nodes to appear, you will need to explicitly set or data-bind their <a href="Part.html#location">Part.location</a>
|
|
or <a href="GraphObject.html#position">GraphObject.position</a> to real Point values, because automatic layout will not assign any positions.</p>
|
|
<p>Another way of controlling when layouts are invalidated is by setting
|
|
<a href="Part.html#isLayoutPositioned">Part.isLayoutPositioned</a> or <a href="Part.html#layoutConditions">Part.layoutConditions</a>.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="isOngoing" class="tsd-anchor"></a>
|
|
<h3>
|
|
is<wbr>Ongoing
|
|
<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 this layout can be invalidated by <a href="Layout.html#invalidateLayout">invalidateLayout</a>.
|
|
Set this to false to prevent actions such as adding or removing Parts from invalidating this layout.
|
|
The default value is true.
|
|
Setting this property does not invalidate this layout.</p>
|
|
<p>If you set both <a href="Layout.html#isInitial">isInitial</a> and <a href="Layout.html#isOngoing">isOngoing</a> to false,
|
|
there will be no automatic layout invalidation, because <a href="Layout.html#invalidateLayout">invalidateLayout</a>
|
|
will not set <a href="Layout.html#isValidLayout">isValidLayout</a> to false.
|
|
To get your nodes to appear, you will need to explicitly set or data-bind their <a href="Part.html#location">Part.location</a>
|
|
or <a href="GraphObject.html#position">GraphObject.position</a> to real Point values, because automatic layout will not assign any positions.</p>
|
|
<p>Another way of controlling when layouts are invalidated is by setting
|
|
<a href="Part.html#isLayoutPositioned">Part.isLayoutPositioned</a> or <a href="Part.html#layoutConditions">Part.layoutConditions</a>.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="isRealtime" class="tsd-anchor"></a>
|
|
<h3>
|
|
is<wbr>Realtime
|
|
<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 this layout be performed in real-time, before the end of a transaction.
|
|
All layouts that are invalidated will be performed at the end of a transaction.
|
|
The default value is null.
|
|
A null value is treated as true for a <a href="Diagram.html#layout">Diagram.layout</a> but false for a <a href="Group.html#layout">Group.layout</a>.
|
|
Setting this property does not invalidate this layout.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<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="isRouting" class="tsd-anchor"></a>
|
|
<h3>
|
|
is<wbr>Routing
|
|
<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 this layout routes <a href="Link.html">Link</a>s.
|
|
The default value is true.
|
|
When false, this layout will not explicitly set the <a href="Link.html#points">Link.points</a>,
|
|
and the default routing of each individual Link will take place after the Nodes are moved by <a href="Layout.html#commitLayout">commitLayout</a>.
|
|
Setting this property does not invalidate this layout.</p>
|
|
<p>Some layouts ignore links, in which case this property is ignored.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>since</dt>
|
|
<dd><p>1.1</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="isValidLayout" class="tsd-anchor"></a>
|
|
<h3>
|
|
is<wbr>Valid<wbr>Layout
|
|
<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 this layout needs to be performed again (if false).
|
|
Instead of setting this property directly, it is normal to set it to false by calling <a href="Layout.html#invalidateLayout">invalidateLayout</a>,
|
|
since that also requests performing a layout in the near future.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="isViewportSized" class="tsd-anchor"></a>
|
|
<h3>
|
|
is<wbr>Viewport<wbr>Sized
|
|
<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 this layout depends on the <a href="Diagram.html#viewportBounds">Diagram.viewportBounds</a>'s size.
|
|
If set to true, the layout will invalidate when the Diagram's viewport changes size.
|
|
This only applies to diagram layouts, not to group layouts,
|
|
and only when <a href="Diagram.html#autoScale">Diagram.autoScale</a> is set to <a href="Diagram.html#static-None">Diagram.None</a>.
|
|
The default value is false.
|
|
Setting this property to true will invalidate this layout.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class">
|
|
<a name="network" class="tsd-anchor"></a>
|
|
<h3>
|
|
network
|
|
<span class="tsd-signature-symbol">: </span><a href="LayoutNetwork.html" class="tsd-signature-type">LayoutNetwork</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>Gets or sets the <a href="LayoutNetwork.html">LayoutNetwork</a> used by this Layout, if any.
|
|
The default value is null.
|
|
Setting this property does not invalidate this layout.
|
|
Not all kinds of layout make use of a <a href="LayoutNetwork.html">LayoutNetwork</a>.
|
|
Call <a href="Layout.html#createNetwork">createNetwork</a> or <a href="Layout.html#makeNetwork">makeNetwork</a> to create a network.</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 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 is of the same class.
|
|
This is called by <a href="Layout.html#copy">copy</a> and should be overridden for each class that adds properties.
|
|
There are examples of such overrides in the samples.
|
|
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>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>since</dt>
|
|
<dd><p>1.6</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>copy: <span class="tsd-signature-type">this</span></h5>
|
|
</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="collectParts" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagProtected">Protected</span>
|
|
collect<wbr>Parts
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-protected">
|
|
<li class="tsd-signature tsd-kind-icon">collect<wbr>Parts<span class="tsd-signature-symbol">(</span>coll<span class="tsd-signature-symbol">: </span><a href="Diagram.html" class="tsd-signature-type">Diagram</a><span class="tsd-signature-symbol"> | </span><a href="Group.html" class="tsd-signature-type">Group</a><span class="tsd-signature-symbol"> | </span><a href="Iterable.html" class="tsd-signature-type">Iterable</a><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-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="Set.html" class="tsd-signature-type">Set</a><span class="tsd-signature-symbol"><</span><a href="Part.html" class="tsd-signature-type">Part</a><span class="tsd-signature-symbol">></span></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>A convenient way of converting the Diagram|Group|Iterable argument to doLayout to an actual collection of eligible Parts.
|
|
The resulting Set will not include any Nodes or Links for which <a href="Part.html#canLayout">Part.canLayout</a> is false.
|
|
If the argument includes a Group for which <a href="Group.html#layout">Group.layout</a> is null, the resulting Set
|
|
will include the member parts of that group rather than that group itself.
|
|
You will not need to call collectParts if you call <a href="Layout.html#makeNetwork">makeNetwork</a>,
|
|
because that method does effectively the same thing when building the <a href="LayoutNetwork.html">LayoutNetwork</a>.</p>
|
|
<p>Typical usage:</p>
|
|
<pre><code class="hljs js">public doLayout(coll) {
|
|
<span class="hljs-comment">// COLL might be a Diagram or a Group or some Iterable<Part></span>
|
|
<span class="hljs-keyword">var</span> it = <span class="hljs-keyword">this</span>.collectParts(coll).iterator;
|
|
<span class="hljs-keyword">while</span> (it.next()) {
|
|
<span class="hljs-keyword">var</span> node = it.value;
|
|
<span class="hljs-keyword">if</span> (node <span class="hljs-keyword">instanceof</span> go.Node) {
|
|
. . . position the node . . .
|
|
}
|
|
}
|
|
}</code></pre>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>since</dt>
|
|
<dd><p>1.7</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>coll: <a href="Diagram.html" class="tsd-signature-type">Diagram</a><span class="tsd-signature-symbol"> | </span><a href="Group.html" class="tsd-signature-type">Group</a><span class="tsd-signature-symbol"> | </span><a href="Iterable.html" class="tsd-signature-type">Iterable</a><span class="tsd-signature-symbol"><</span><a href="Part.html" class="tsd-signature-type">Part</a><span class="tsd-signature-symbol">></span></h5>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <a href="Set.html" class="tsd-signature-type">Set</a><span class="tsd-signature-symbol"><</span><a href="Part.html" class="tsd-signature-type">Part</a><span class="tsd-signature-symbol">></span></h4>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-protected">
|
|
<a name="commitLayout" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagProtected">Protected</span> <span class="tsd-flag ts-flagVirtual">Virtual</span>
|
|
commit<wbr>Layout
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-protected">
|
|
<li class="tsd-signature tsd-kind-icon">commit<wbr>Layout<span class="tsd-signature-symbol">(</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>When using a <a href="LayoutNetwork.html">LayoutNetwork</a>, commit changes to the diagram
|
|
by setting <a href="Node.html">Node</a> positions and by routing the <a href="Link.html">Link</a>s.
|
|
This is called by <a href="Layout.html#updateParts">updateParts</a> within a transaction.</p>
|
|
<p>You should not call this method -- it is a "protected virtual" method.
|
|
This may be overridden by subclasses of Layout.
|
|
By default this method is implemented as follows:</p>
|
|
<pre><code class="hljs js">protected commitLayout() {
|
|
<span class="hljs-keyword">if</span> (<span class="hljs-keyword">this</span>.network === <span class="hljs-literal">null</span>) <span class="hljs-keyword">return</span>;
|
|
<span class="hljs-keyword">var</span> vit = <span class="hljs-keyword">this</span>.network.vertexes.iterator;
|
|
<span class="hljs-keyword">while</span> (vit.next()) {
|
|
<span class="hljs-keyword">var</span> vert = vit.value;
|
|
vert.commit();
|
|
}
|
|
<span class="hljs-keyword">if</span> (<span class="hljs-keyword">this</span>.isRouting) {
|
|
<span class="hljs-keyword">var</span> eit = <span class="hljs-keyword">this</span>.network.edges.iterator;
|
|
<span class="hljs-keyword">while</span> (eit.next()) {
|
|
<span class="hljs-keyword">var</span> edge = eit.value;
|
|
edge.commit();
|
|
}
|
|
}
|
|
}</code></pre>
|
|
<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-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 copy of this Layout and returns it.
|
|
When a <a href="Group.html">Group</a> is copied that has a <a href="Group.html#layout">Group.layout</a>, the <a href="Layout.html">Layout</a> must also be copied.
|
|
This calls <a href="Layout.html#cloneProtected">cloneProtected</a> on a newly constructed Layout.</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">
|
|
<a name="createNetwork" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagVirtual">Virtual</span>
|
|
create<wbr>Network
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">create<wbr>Network<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="LayoutNetwork.html" class="tsd-signature-type">LayoutNetwork</a></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Create a new <a href="LayoutNetwork.html">LayoutNetwork</a> of <a href="LayoutVertex.html">LayoutVertex</a>es and <a href="LayoutEdge.html">LayoutEdge</a>s.
|
|
This may be overridden in Layout subclasses to create instances of subclasses of
|
|
<a href="LayoutNetwork.html">LayoutNetwork</a>.
|
|
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-returns-title">Returns <a href="LayoutNetwork.html" class="tsd-signature-type">LayoutNetwork</a></h4>
|
|
<p>a new <a href="LayoutNetwork.html">LayoutNetwork</a>.</p>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class">
|
|
<a name="doLayout" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagVirtual">Virtual</span>
|
|
do<wbr>Layout
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">do<wbr>Layout<span class="tsd-signature-symbol">(</span>coll<span class="tsd-signature-symbol">: </span><a href="Diagram.html" class="tsd-signature-type">Diagram</a><span class="tsd-signature-symbol"> | </span><a href="Group.html" class="tsd-signature-type">Group</a><span class="tsd-signature-symbol"> | </span><a href="Iterable.html" class="tsd-signature-type">Iterable</a><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-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>Position all of the nodes that do not have an assigned <a href="Part.html#location">Part.location</a>
|
|
in the manner of a simple rectangular array.
|
|
The default implementation ignores all <a href="Group.html">Group</a>s and <a href="Link.html">Link</a>s;
|
|
many subclasses of <a href="Layout.html">Layout</a> ignore all instances of <a href="Part.html">Part</a>s
|
|
that are not <a href="Node.html">Node</a>s or <a href="Link.html">Link</a>s.</p>
|
|
<p>You can override this method to do whatever node positioning and link routing
|
|
that you wish.</p>
|
|
<p>When the layout makes use of a <a href="LayoutNetwork.html">LayoutNetwork</a>,
|
|
this method should call <a href="Layout.html#makeNetwork">makeNetwork</a> and <a href="Layout.html#updateParts">updateParts</a>.
|
|
The <a href="Layout.html#updateParts">updateParts</a> method will call <a href="Layout.html#commitLayout">commitLayout</a> within a transaction.
|
|
The outline of such an override should be like:</p>
|
|
<pre><code class="hljs js">public doLayout(coll) {
|
|
<span class="hljs-keyword">if</span> (<span class="hljs-keyword">this</span>.network === <span class="hljs-literal">null</span>) <span class="hljs-keyword">this</span>.network = <span class="hljs-keyword">this</span>.makeNetwork(coll);
|
|
<span class="hljs-comment">// assign LayoutVertex.bounds to all vertexes in the network:</span>
|
|
<span class="hljs-keyword">var</span> vit = <span class="hljs-keyword">this</span>.network.vertexes.iterator;
|
|
<span class="hljs-keyword">while</span> (vit.next()) {
|
|
<span class="hljs-keyword">var</span> v = vit.value;
|
|
v.centerX = ...
|
|
v.centerY = ...
|
|
}
|
|
<span class="hljs-keyword">this</span>.updateParts();
|
|
<span class="hljs-keyword">this</span>.network = <span class="hljs-literal">null</span>;
|
|
}</code></pre>
|
|
<p>Override <a href="Layout.html#commitLayout">commitLayout</a> to actually position nodes and route links.</p>
|
|
<p>When the layout does <em>not</em> make use of a <a href="LayoutNetwork.html">LayoutNetwork</a>,
|
|
this method should make direct changes to <a href="Node.html">Node</a>s and <a href="Link.html">Link</a>s
|
|
within a transaction, and it should call <a href="Layout.html#collectParts">collectParts</a> on the argument <em>coll</em> in order
|
|
to get the proper set of Nodes and Links to work on.
|
|
Examples are provided in the Extensions directory.</p>
|
|
<p>If this Layout belongs to a Diagram, the argument must be either the same Diagram or must denote Parts that belong to the Diagram.
|
|
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>coll: <a href="Diagram.html" class="tsd-signature-type">Diagram</a><span class="tsd-signature-symbol"> | </span><a href="Group.html" class="tsd-signature-type">Group</a><span class="tsd-signature-symbol"> | </span><a href="Iterable.html" class="tsd-signature-type">Iterable</a><span class="tsd-signature-symbol"><</span><a href="Part.html" class="tsd-signature-type">Part</a><span class="tsd-signature-symbol">></span></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>A <a href="Diagram.html">Diagram</a> or a <a href="Group.html">Group</a> or a collection of <a href="Part.html">Part</a>s.</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">
|
|
<a name="getLayoutBounds" class="tsd-anchor"></a>
|
|
<h3>
|
|
get<wbr>Layout<wbr>Bounds
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">get<wbr>Layout<wbr>Bounds<span class="tsd-signature-symbol">(</span>part<span class="tsd-signature-symbol">: </span><a href="Part.html" class="tsd-signature-type">Part</a>, rect<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>This method is called by layouts to determine the size and initial position of the nodes that it is laying out.
|
|
Normally this just returns the part's <a href="GraphObject.html#actualBounds">GraphObject.actualBounds</a>.
|
|
However, if <a href="Layout.html#boundsComputation">boundsComputation</a> has been set to a function, that function will be called
|
|
in order to return the bounds of the given Part in document coordinates that the layout should pretend it has.</p>
|
|
<dl class="tsd-comment-tags">
|
|
<dt>since</dt>
|
|
<dd><p>2.0</p>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>part: <a href="Part.html" class="tsd-signature-type">Part</a></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>the Part being laid out</p>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<h5><span class="tsd-flag ts-flagOptional">Optional</span> rect: <a href="Rect.html" class="tsd-signature-type">Rect</a></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>an optional Rect that will be 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>a Rect in document coordinates</p>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-protected">
|
|
<a name="initialOrigin" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagProtected">Protected</span> <span class="tsd-flag ts-flagVirtual">Virtual</span>
|
|
initial<wbr>Origin
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-protected">
|
|
<li class="tsd-signature tsd-kind-icon">initial<wbr>Origin<span class="tsd-signature-symbol">(</span>origin<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>Compute the desired value of <a href="Layout.html#arrangementOrigin">arrangementOrigin</a> if this Layout is being performed for a Group.
|
|
This is typically called near the beginning of the implementation of <a href="Layout.html#doLayout">doLayout</a>:
|
|
<code>this.arrangementOrigin = this.initialOrigin(this.arrangementOrigin);</code>
|
|
if the layout wants to respect the pre-layout location of the Group when deciding where to position its member nodes.</p>
|
|
</div>
|
|
<h4 class="tsd-parameters-title">Parameters</h4>
|
|
<ul class="tsd-parameters">
|
|
<li>
|
|
<h5>origin: <a href="Point.html" class="tsd-signature-type">Point</a></h5>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <a href="Point.html" class="tsd-signature-type">Point</a></h4>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class">
|
|
<a name="invalidateLayout" class="tsd-anchor"></a>
|
|
<h3>
|
|
invalidate<wbr>Layout
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">invalidate<wbr>Layout<span class="tsd-signature-symbol">(</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>If <a href="Layout.html#isOngoing">isOngoing</a> is true and if an initial layout has not yet been performed,
|
|
set the <a href="Layout.html#isValidLayout">isValidLayout</a> property to false, and ask to perform another layout in the near future.
|
|
If <a href="Layout.html#isInitial">isInitial</a> is true, this layout is invalidated only when the <a href="Diagram.html#model">Diagram.model</a> is replaced,
|
|
not under the normal circumstances such as when parts are added or removed or
|
|
due to other calls to <a href="Layout.html#invalidateLayout">Layout.invalidateLayout</a>.</p>
|
|
<p>If you set both <a href="Layout.html#isInitial">isInitial</a> and <a href="Layout.html#isOngoing">isOngoing</a> to false,
|
|
there will be no automatic layout invalidation, because this method
|
|
will not set <a href="Layout.html#isValidLayout">isValidLayout</a> to false.
|
|
However you can still set <a href="Layout.html#isValidLayout">isValidLayout</a> explicitly.</p>
|
|
<p>This is typically called when a layout property value has changed,
|
|
or when a Part is added or removed or changes visibility, if <a href="Part.html#layoutConditions">Part.layoutConditions</a> includes the pertinent flags.</p>
|
|
</div>
|
|
<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="makeNetwork" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagVirtual">Virtual</span>
|
|
make<wbr>Network
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">make<wbr>Network<span class="tsd-signature-symbol">(</span>coll<span class="tsd-signature-symbol">: </span><a href="Diagram.html" class="tsd-signature-type">Diagram</a><span class="tsd-signature-symbol"> | </span><a href="Group.html" class="tsd-signature-type">Group</a><span class="tsd-signature-symbol"> | </span><a href="Iterable.html" class="tsd-signature-type">Iterable</a><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-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="LayoutNetwork.html" class="tsd-signature-type">LayoutNetwork</a></li>
|
|
</ul>
|
|
<ul class="tsd-descriptions">
|
|
<li class="tsd-description">
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>Create and initialize a <a href="LayoutNetwork.html">LayoutNetwork</a> with the given nodes and links.
|
|
This should be called by <a href="Layout.html#doLayout">doLayout</a> when this layout uses a <a href="Layout.html#network">network</a>.
|
|
This method calls <a href="Layout.html#createNetwork">createNetwork</a> to allocate the network.
|
|
This may be overridden in Layout subclasses to customize the initialization.
|
|
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>coll: <a href="Diagram.html" class="tsd-signature-type">Diagram</a><span class="tsd-signature-symbol"> | </span><a href="Group.html" class="tsd-signature-type">Group</a><span class="tsd-signature-symbol"> | </span><a href="Iterable.html" class="tsd-signature-type">Iterable</a><span class="tsd-signature-symbol"><</span><a href="Part.html" class="tsd-signature-type">Part</a><span class="tsd-signature-symbol">></span></h5>
|
|
<div class="tsd-comment tsd-typography">
|
|
<p>A <a href="Diagram.html">Diagram</a> or a <a href="Group.html">Group</a> or a collection of <a href="Part.html">Part</a>s.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<h4 class="tsd-returns-title">Returns <a href="LayoutNetwork.html" class="tsd-signature-type">LayoutNetwork</a></h4>
|
|
<p>normally the value of a call to <a href="Layout.html#createNetwork">createNetwork</a> initialized by vertexes and edges corresponding to the <em>coll</em> argument.</p>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class">
|
|
<a name="updateParts" class="tsd-anchor"></a>
|
|
<h3>
|
|
<span class="tsd-flag ts-flagVirtual">Virtual</span>
|
|
update<wbr>Parts
|
|
</h3>
|
|
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
|
|
<li class="tsd-signature tsd-kind-icon">update<wbr>Parts<span class="tsd-signature-symbol">(</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>When using a <a href="LayoutNetwork.html">LayoutNetwork</a>, update the "physical" node positionings and link routings.
|
|
This should be called by <a href="Layout.html#doLayout">doLayout</a> when this layout uses a <a href="Layout.html#network">network</a>.
|
|
This calls <a href="Layout.html#commitLayout">commitLayout</a> to actually set <a href="Node.html">Node</a> positions and route <a href="Link.html">Link</a>s.
|
|
This performs the changes within a transaction.
|
|
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-returns-title">Returns <span class="tsd-signature-type">void</span></h4>
|
|
</li>
|
|
</ul>
|
|
</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="Layout.html" class="tsd-kind-icon">Layout</a>
|
|
<ul>
|
|
<li class=" tsd-kind-constructor tsd-parent-kind-class">
|
|
<a href="Layout.html#constructor" class="tsd-kind-icon">constructor</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="Layout.html#arrangementOrigin" class="tsd-kind-icon">arrangement<wbr>Origin</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="Layout.html#boundsComputation" class="tsd-kind-icon">bounds<wbr>Computation</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="Layout.html#diagram" class="tsd-kind-icon">diagram</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="Layout.html#group" class="tsd-kind-icon">group</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="Layout.html#isInitial" class="tsd-kind-icon">is<wbr>Initial</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="Layout.html#isOngoing" class="tsd-kind-icon">is<wbr>Ongoing</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="Layout.html#isRealtime" class="tsd-kind-icon">is<wbr>Realtime</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="Layout.html#isRouting" class="tsd-kind-icon">is<wbr>Routing</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="Layout.html#isValidLayout" class="tsd-kind-icon">is<wbr>Valid<wbr>Layout</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="Layout.html#isViewportSized" class="tsd-kind-icon">is<wbr>Viewport<wbr>Sized</a>
|
|
</li>
|
|
<li class=" tsd-kind-accessor tsd-parent-kind-class">
|
|
<a href="Layout.html#network" class="tsd-kind-icon">network</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class tsd-is-protected">
|
|
<a href="Layout.html#cloneProtected" class="tsd-kind-icon">clone<wbr>Protected</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class tsd-is-protected">
|
|
<a href="Layout.html#collectParts" class="tsd-kind-icon">collect<wbr>Parts</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class tsd-is-protected">
|
|
<a href="Layout.html#commitLayout" class="tsd-kind-icon">commit<wbr>Layout</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="Layout.html#copy" class="tsd-kind-icon">copy</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="Layout.html#createNetwork" class="tsd-kind-icon">create<wbr>Network</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="Layout.html#doLayout" class="tsd-kind-icon">do<wbr>Layout</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="Layout.html#getLayoutBounds" class="tsd-kind-icon">get<wbr>Layout<wbr>Bounds</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class tsd-is-protected">
|
|
<a href="Layout.html#initialOrigin" class="tsd-kind-icon">initial<wbr>Origin</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="Layout.html#invalidateLayout" class="tsd-kind-icon">invalidate<wbr>Layout</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="Layout.html#makeNetwork" class="tsd-kind-icon">make<wbr>Network</a>
|
|
</li>
|
|
<li class=" tsd-kind-method tsd-parent-kind-class">
|
|
<a href="Layout.html#updateParts" class="tsd-kind-icon">update<wbr>Parts</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> |