gojs
Version:
Interactive diagrams, charts, and graphs, such as trees, flowcharts, orgcharts, UML, BPMN, or business diagrams
120 lines • 68.5 kB
HTML
<!DOCTYPE html><html class="default"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>CircularLayout | GoJS API</title><meta name="description" content="Documentation for GoJS API"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../../assets/css/style.css"/><link rel="stylesheet" href="../assets/style-tsd.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.body.classList.add(localStorage.getItem("tsd-theme") || "os")</script><header><nav id="navTop" class="w-full z-30 top-0 text-white bg-nwoods-primary"><div class="w-full container max-w-screen-lg mx-auto flex flex-wrap sm:flex-nowrap items-center justify-between mt-0 py-2"><div class="md:pl-4"><a class="text-white hover:text-white no-underline hover:no-underline\n font-bold text-2xl lg:text-4xl rounded-lg hover:bg-nwoods-secondary" href="../../index.html"><h1 class="my-0 p-1 leading-none">GoJS</h1></a></div><button id="topnavButton" class="rounded-lg sm:hidden focus:outline-none focus:ring" aria-label="Navigation"><svg fill="currentColor" viewBox="0 0 20 20" class="w-6 h-6"><path id="topnavOpen" fill-rule="evenodd" d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM9 15a1 1 0 011-1h6a1 1 0 110 2h-6a1 1 0 01-1-1z" clip-rule="evenodd"></path><path id="topnavClosed" class="hidden" fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></button><div id="topnavList" class="hidden sm:block items-center w-auto mt-0 text-white p-0 z-20"><ul class="list-reset list-none font-semibold flex justify-end flex-wrap sm:flex-nowrap items-center px-0 pb-0"><li class="p-1 sm:p-0"><a class="topnav-link" href="../../learn/index.html">Learn</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="../../samples/index.html">Samples</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="../../intro/index.html">Intro</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="../../api/index.html">API</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="https://www.nwoods.com/products/register.html">Register</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="../../download.html">Download</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="https://forum.nwoods.com/c/gojs/11">Forum</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="https://www.nwoods.com/contact.html" target="_blank" rel="noopener" id="contactBtn">Contact</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="https://www.nwoods.com/sales/index.html" target="_blank" rel="noopener" id="buyBtn">Buy</a></li></ul></div></div><hr class="border-b border-gray-600 opacity-50 my-0 py-0"/></nav><div class="tsd-page-header"><div class="tsd-page-toolbar"><div class="w-full max-w-screen-xl mx-auto px-2"><div class="table-wrap"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget search no-caption">Search</label><input type="text" id="tsd-search-field"/></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> <input type="checkbox" id="tsd-filter-inherited"/><label class="tsd-widget" for="tsd-filter-inherited">Inherited</label></div></div><a href="#" class="tsd-widget menu no-caption" data-toggle="menu">Menu</a></div></div></div></div></div><div class="tsd-page-title"><div class="w-full max-w-screen-xl mx-auto px-2"><div class="top-copyright"><b>GoJS</b>® Diagramming Components<br/>version 2.3.8<br/>by <a href="https://www.nwoods.com/">Northwoods Software®</a></div><div><h1>Class CircularLayout </h1></div></div></div></header><div class="tsd w-full max-w-screen-xl mx-auto pb-4"><div class="row px-2 w-full"><div class="col-8 col-content"><section class="tsd-panel tsd-hierarchy"><h3>Hierarchy</h3><ul class="tsd-hierarchy"><li><a href="Layout.html" class="tsd-signature-type" data-tsd-kind="Class">Layout</a><ul class="tsd-hierarchy"><li><span class="target">CircularLayout</span></li></ul></li></ul></section><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography">
<p>This layout positions nodes in a circular arrangement.
There are several samples that use CircularLayout.
The layout cannot guarantee that it provides optimal positioning of nodes when trying to minimize link crossings.</p>
<p class="boxrun">
If you want to experiment interactively with most of the properties, try the <a href="../../samples/cLayout.html">Circular Layout</a> sample.
See samples that make use of CircularLayout in the <a href="../../samples/index.html#circularlayout">samples index</a>.<div><p>This layout makes use of a <a href="LayoutNetwork.html">LayoutNetwork</a> of
<a href="CircularVertex.html">CircularVertex</a>es and <a href="CircularEdge.html">CircularEdge</a>s that normally
correspond to the <a href="Node.html">Node</a>s and <a href="Link.html">Link</a>s of the <a href="Diagram.html">Diagram</a>.</p>
</div></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 tsd-is-overwrite"><a href="CircularLayout.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-get-signature tsd-parent-kind-class"><a href="CircularLayout.html#actualCenter" class="tsd-kind-icon">actual<wbr/>Center</a></li><li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="CircularLayout.html#actualSpacing" class="tsd-kind-icon">actual<wbr/>Spacing</a></li><li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="CircularLayout.html#actualXRadius" class="tsd-kind-icon">actualXRadius</a></li><li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="CircularLayout.html#actualYRadius" class="tsd-kind-icon">actualYRadius</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="CircularLayout.html#arrangement" class="tsd-kind-icon">arrangement</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="CircularLayout.html#aspectRatio" class="tsd-kind-icon">aspect<wbr/>Ratio</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="CircularLayout.html#comparer" class="tsd-kind-icon">comparer</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="CircularLayout.html#direction" class="tsd-kind-icon">direction</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="CircularLayout.html#nodeDiameterFormula" class="tsd-kind-icon">node<wbr/>Diameter<wbr/>Formula</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="CircularLayout.html#radius" class="tsd-kind-icon">radius</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="CircularLayout.html#sorting" class="tsd-kind-icon">sorting</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="CircularLayout.html#spacing" class="tsd-kind-icon">spacing</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="CircularLayout.html#startAngle" class="tsd-kind-icon">start<wbr/>Angle</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="CircularLayout.html#sweepAngle" class="tsd-kind-icon">sweep<wbr/>Angle</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-overwrite tsd-is-protected"><a href="CircularLayout.html#commitLayout" class="tsd-kind-icon">commit<wbr/>Layout</a></li><li class="tsd-kind-method tsd-parent-kind-class tsd-is-protected"><a href="CircularLayout.html#commitLinks" class="tsd-kind-icon">commit<wbr/>Links</a></li><li class="tsd-kind-method tsd-parent-kind-class tsd-is-protected"><a href="CircularLayout.html#commitNodes" class="tsd-kind-icon">commit<wbr/>Nodes</a></li><li class="tsd-kind-method tsd-parent-kind-class tsd-is-overwrite"><a href="CircularLayout.html#createNetwork" class="tsd-kind-icon">create<wbr/>Network</a></li><li class="tsd-kind-method tsd-parent-kind-class tsd-is-overwrite"><a href="CircularLayout.html#doLayout" class="tsd-kind-icon">do<wbr/>Layout</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="CircularLayout.html#static-Ascending" class="tsd-kind-icon">Ascending</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="CircularLayout.html#static-BidirectionalLeft" class="tsd-kind-icon">Bidirectional<wbr/>Left</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="CircularLayout.html#static-BidirectionalRight" class="tsd-kind-icon">Bidirectional<wbr/>Right</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="CircularLayout.html#static-Circular" class="tsd-kind-icon">Circular</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="CircularLayout.html#static-Clockwise" class="tsd-kind-icon">Clockwise</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="CircularLayout.html#static-ConstantAngle" class="tsd-kind-icon">Constant<wbr/>Angle</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="CircularLayout.html#static-ConstantDistance" class="tsd-kind-icon">Constant<wbr/>Distance</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="CircularLayout.html#static-ConstantSpacing" class="tsd-kind-icon">Constant<wbr/>Spacing</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="CircularLayout.html#static-Counterclockwise" class="tsd-kind-icon">Counterclockwise</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="CircularLayout.html#static-Descending" class="tsd-kind-icon">Descending</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="CircularLayout.html#static-Forwards" class="tsd-kind-icon">Forwards</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="CircularLayout.html#static-Optimized" class="tsd-kind-icon">Optimized</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="CircularLayout.html#static-Packed" class="tsd-kind-icon">Packed</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="CircularLayout.html#static-Pythagorean" class="tsd-kind-icon">Pythagorean</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="CircularLayout.html#static-Reverse" class="tsd-kind-icon">Reverse</a></li></ul></section></div></section></section><section class="tsd-panel-group tsd-index-group tsd-is-inherited"><h2>Inherited Members</h2><section class="tsd-panel tsd-index-panel"><div class="tsd-index-content"><section class="tsd-index-section undefined"><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">Layout.arrangement<wbr/>Origin</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#boundsComputation" class="tsd-kind-icon">Layout.bounds<wbr/>Computation</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#diagram" class="tsd-kind-icon">Layout.diagram</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#group" class="tsd-kind-icon">Layout.group</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#isInitial" class="tsd-kind-icon">Layout.is<wbr/>Initial</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#isOngoing" class="tsd-kind-icon">Layout.is<wbr/>Ongoing</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#isRealtime" class="tsd-kind-icon">Layout.is<wbr/>Realtime</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#isRouting" class="tsd-kind-icon">Layout.is<wbr/>Routing</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="Layout.html#isValidLayout" class="tsd-kind-icon">Layout.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">Layout.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">Layout.network</a></li></ul></section><section class="tsd-index-section undefined"><h3>Methods</h3><ul class="tsd-index-list"><li class="tsd-kind-method tsd-parent-kind-class tsd-is-protected"><a href="Layout.html#collectParts" class="tsd-kind-icon">Layout.collect<wbr/>Parts</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="Layout.html#copy" class="tsd-kind-icon">Layout.copy</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="Layout.html#getLayoutBounds" class="tsd-kind-icon">Layout.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">Layout.initial<wbr/>Origin</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="Layout.html#invalidateLayout" class="tsd-kind-icon">Layout.invalidate<wbr/>Layout</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="Layout.html#makeNetwork" class="tsd-kind-icon">Layout.make<wbr/>Network</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="Layout.html#updateParts" class="tsd-kind-icon">Layout.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 tsd-is-overwrite"><a id="constructor" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> constructor<a href="#constructor" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-signatures tsd-kind-constructor tsd-parent-kind-class tsd-is-overwrite"><li class="tsd-signature tsd-kind-icon">new <wbr/>Circular<wbr/>Layout<span class="tsd-signature-symbol">(</span>init<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="CircularLayout.html" class="tsd-signature-type" data-tsd-kind="Class">CircularLayout</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="CircularLayout.html" class="tsd-signature-type" data-tsd-kind="Class">CircularLayout</a></li></ul><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Constructs a <a href="CircularLayout.html">CircularLayout</a> with no <a href="Layout.html#network">Layout.network</a>
and with no owning <a href="Layout.html#diagram">Layout.diagram</a>.</p>
</div><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameters"><li><h5><span class="tsd-flag ts-flagOptional">Optional</span> init: <span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="CircularLayout.html" class="tsd-signature-type" data-tsd-kind="Class">CircularLayout</a><span class="tsd-signature-symbol">></span></h5><div class="tsd-comment tsd-typography">
<p>Optional initialization properties.</p>
</div></li></ul><h4 class="tsd-returns-title">Returns <a href="CircularLayout.html" class="tsd-signature-type" data-tsd-kind="Class">CircularLayout</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-get-signature tsd-parent-kind-class"><a id="actualCenter" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagReadOnly">Read-only</span> actual<wbr/>Center<span class="tsd-signature-symbol">: </span><a href="Point.html" class="tsd-signature-type" data-tsd-kind="Class">Point</a><a href="#actualCenter" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>This read-only property is the coordinates of the center of the laid-out ellipse immediately after the layout.</p>
</div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-get-signature tsd-parent-kind-class"><a id="actualSpacing" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagReadOnly">Read-only</span> actual<wbr/>Spacing<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><a href="#actualSpacing" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>This read-only property is the effective spacing that may have been calculated by the layout.</p>
</div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-get-signature tsd-parent-kind-class"><a id="actualXRadius" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagReadOnly">Read-only</span> actualXRadius<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><a href="#actualXRadius" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>This read-only property is the effective X radius that may have been calculated by the layout.</p>
</div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-get-signature tsd-parent-kind-class"><a id="actualYRadius" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagReadOnly">Read-only</span> actualYRadius<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><a href="#actualYRadius" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>This read-only property is the effective Y radius that may have been calculated by the layout.</p>
</div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="arrangement" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> arrangement<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span><a href="#arrangement" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets how the nodes are spaced.
If <a href="CircularLayout.html#arrangement">arrangement</a> === <a href="CircularLayout.html#static-Packed">CircularLayout.Packed</a>,
the specified <a href="CircularLayout.html#radius">radius</a> will be ignored.</p>
<div><p>The default value is <a href="CircularLayout.html#static-ConstantSpacing">CircularLayout.ConstantSpacing</a>.</p>
</div></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="aspectRatio" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> aspect<wbr/>Ratio<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><a href="#aspectRatio" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets the ratio of the arrangement's height to its width
(1 for a circle, >1 for a vertically elongated ellipse).</p>
<div><p>This is 1 by default.
The value must be a positive number.</p>
<p>Modifying this value changes the height, but keeps the width and the <a href="CircularLayout.html#radius">radius</a> constant.</p>
</div></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="comparer" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> comparer<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>a<span class="tsd-signature-symbol">: </span><a href="CircularVertex.html" class="tsd-signature-type" data-tsd-kind="Class">CircularVertex</a>, b<span class="tsd-signature-symbol">: </span><a href="CircularVertex.html" class="tsd-signature-type" data-tsd-kind="Class">CircularVertex</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">number</span><a href="#comparer" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets the comparer which sorts the data when <a href="CircularLayout.html#sorting">sorting</a> is
set to <a href="CircularLayout.html#static-Ascending">CircularLayout.Ascending</a> or <a href="CircularLayout.html#static-Descending">CircularLayout.Descending</a>.</p>
<div><p>The default function compares the <a href="Part.html#text">Part.text</a> values of the vertexes' <a href="LayoutVertex.html#node">LayoutVertex.node</a>s.</p>
</div></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="direction" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> direction<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span><a href="#direction" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets whether the nodes are arranged clockwise or counterclockwise.</p>
<div><p>The default value is <a href="CircularLayout.html#static-Clockwise">CircularLayout.Clockwise</a>.</p>
</div></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="nodeDiameterFormula" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> node<wbr/>Diameter<wbr/>Formula<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span><a href="#nodeDiameterFormula" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Specifies how the diameter of nodes will be calculated.
When a node is not circular, it is not clear what its diameter is.</p>
<div><p>The default is <a href="CircularLayout.html#static-Pythagorean">CircularLayout.Pythagorean</a>.</p>
</div></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="radius" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> radius<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><a href="#radius" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets the horizontal radius of the elliptical arrangement.</p>
<div><p>The default value is NaN.
NaN indicates that the <a href="CircularLayout.html#spacing">spacing</a> will determine the size of the ring.
If <a href="CircularLayout.html#spacing">spacing</a> is also NaN, the effective spacing will be 6.
If <a href="CircularLayout.html#spacing">spacing</a> is a number, the effective radius will be > radius if and only if
the spacing between elements would otherwise be less than spacing.
The specified value for <a href="CircularLayout.html#radius">radius</a> will be ignored if <a href="CircularLayout.html#arrangement">arrangement</a> === <a href="CircularLayout.html#static-Packed">CircularLayout.Packed</a>.
This property must always be positive or NaN.</p>
</div></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="sorting" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> sorting<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span><a href="#sorting" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets if and how the nodes are sorted.</p>
<div><p><a href="CircularLayout.html#static-Forwards">CircularLayout.Forwards</a> indicates that the nodes are arranged in the order the layout gets them.
<a href="CircularLayout.html#static-Reverse">CircularLayout.Reverse</a> indicates that the nodes are arranged in the reverse order that the layout gets them.
<a href="CircularLayout.html#static-Ascending">CircularLayout.Ascending</a> and <a href="CircularLayout.html#static-Descending">CircularLayout.Descending</a> indicate that the nodes
will be sorted using the <a href="CircularLayout.html#comparer">comparer</a>.
<a href="CircularLayout.html#static-Optimized">CircularLayout.Optimized</a> indicates that the nodes will be arranged to minimize link crossings.</p>
<p>The default value is <a href="CircularLayout.html#static-Optimized">CircularLayout.Optimized</a>.</p>
</div></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="spacing" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> spacing<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><a href="#spacing" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets the distance between nodes (if <a href="CircularLayout.html#radius">radius</a> is NaN)
or the minimum distance between nodes (if <a href="CircularLayout.html#radius">radius</a> is a number).</p>
<div><p>The default value is 6.
The value may be NaN.</p>
<p>If <a href="CircularLayout.html#spacing">spacing</a> is NaN, there is no minimum spacing, allowing nodes to overlap,
unless <a href="CircularLayout.html#radius">radius</a> is NaN,
in which case the effective spacing will be 6 to determine an effective radius.
If <a href="CircularLayout.html#spacing">spacing</a> is a number but <a href="CircularLayout.html#radius">radius</a> isn't,
the effective spacing will be spacing, and this will determine the effective radius.
If both <a href="CircularLayout.html#spacing">spacing</a> and <a href="CircularLayout.html#radius">radius</a> are numbers,
the effective radius will be at least <a href="CircularLayout.html#radius">radius</a>,
but may be larger so that the minimum spacing between nodes is <a href="CircularLayout.html#spacing">spacing</a>.</p>
</div></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="startAngle" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> start<wbr/>Angle<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><a href="#startAngle" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets the angle (in degrees, clockwise from the positive side of the X axis) of the first element.</p>
<div><p>The default value is 0.</p>
</div></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="sweepAngle" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> sweep<wbr/>Angle<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><a href="#sweepAngle" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets the absolute angle (in degrees) between the first and last node.</p>
<div><p>The default value is 360.
The value must be greater than zero and less than or equal to 360.
If it is not in this range, it will be automatically set to 360.</p>
<p>Whether the arrangement is clockwise or counterclockwise does not depend on the sign of this value.
The direction can be controlled by setting <a href="CircularLayout.html#direction">direction</a>.
If 360 is the specified value, the actual value will be less to keep the first and last
elements from overlapping, and the spacing between the first and last nodes will be determined
the same way as for all other adjacent nodes.</p>
</div></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-overwrite tsd-is-protected"><a id="commitLayout" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagProtected">Protected</span> <span class="tsd-flag ts-flagOverride">Override</span> commit<wbr/>Layout<a href="#commitLayout" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-overwrite 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>Position each <a href="Node.html">Node</a> according to the Vertex position, and then position the <a href="Link.html">Link</a>s.</p>
<div><p>You should not call this method -- it is a "protected virtual" method.</p>
</div></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 tsd-is-protected"><a id="commitLinks" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagProtected">Protected</span> <span class="tsd-flag ts-flagVirtual">Virtual</span> commit<wbr/>Links<a href="#commitLinks" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-protected"><li class="tsd-signature tsd-kind-icon">commit<wbr/>Links<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>Commit the position and routing of all edge links.
This is called by <a href="CircularLayout.html#commitLayout">commitLayout</a>.
This is only called if <a href="Layout.html#isRouting">Layout.isRouting</a> is true.
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 tsd-is-protected"><a id="commitNodes" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagProtected">Protected</span> <span class="tsd-flag ts-flagVirtual">Virtual</span> commit<wbr/>Nodes<a href="#commitNodes" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-protected"><li class="tsd-signature tsd-kind-icon">commit<wbr/>Nodes<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>Commit the position of all vertex nodes.
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 tsd-is-overwrite"><a id="createNetwork" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagOverride">Override</span> create<wbr/>Network<a href="#createNetwork" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-overwrite"><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="CircularNetwork.html" class="tsd-signature-type" data-tsd-kind="Class">CircularNetwork</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="CircularVertex.html">CircularVertex</a>es and <a href="CircularEdge.html">CircularEdge</a>s.</p>
</div><h4 class="tsd-returns-title">Returns <a href="CircularNetwork.html" class="tsd-signature-type" data-tsd-kind="Class">CircularNetwork</a></h4><div><p>a new <a href="LayoutNetwork.html">LayoutNetwork</a>.</p>
</div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-overwrite"><a id="doLayout" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagOverride">Override</span> do<wbr/>Layout<a href="#doLayout" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-overwrite"><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" data-tsd-kind="Class">Diagram</a><span class="tsd-signature-symbol"> | </span><a href="Iterable.html" class="tsd-signature-type" data-tsd-kind="Interface">Iterable</a><span class="tsd-signature-symbol"><</span><a href="Part.html" class="tsd-signature-type" data-tsd-kind="Class">Part</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><a href="Group.html" class="tsd-signature-type" data-tsd-kind="Class">Group</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>Assign the positions of the vertexes in the network.</p>
</div><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameters"><li><h5>coll: <a href="Diagram.html" class="tsd-signature-type" data-tsd-kind="Class">Diagram</a><span class="tsd-signature-symbol"> | </span><a href="Iterable.html" class="tsd-signature-type" data-tsd-kind="Interface">Iterable</a><span class="tsd-signature-symbol"><</span><a href="Part.html" class="tsd-signature-type" data-tsd-kind="Class">Part</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> | </span><a href="Group.html" class="tsd-signature-type" data-tsd-kind="Class">Group</a></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><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 id="static-Ascending" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagStatic">Static</span> Ascending<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span><a href="#static-Ascending" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><div class="tsd-comment tsd-typography">
<p>Nodes are sorted using the <a href="CircularLayout.html#comparer">comparer</a>, in ascending order;
This value is used for <a href="CircularLayout.html#sorting">CircularLayout.sorting</a>.</p>
</div></section><section class="tsd-panel tsd-member tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a id="static-BidirectionalLeft" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagStatic">Static</span> Bidirectional<wbr/>Left<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span><a href="#static-BidirectionalLeft" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><div class="tsd-comment tsd-typography">
<p>The ring is filled by alternating sides; the second node is counterclockwise from the first node;
This value is used for <a href="CircularLayout.html#direction">CircularLayout.direction</a>.</p>
</div></section><section class="tsd-panel tsd-member tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a id="static-BidirectionalRight" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagStatic">Static</span> Bidirectional<wbr/>Right<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span><a href="#static-BidirectionalRight" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><div class="tsd-comment tsd-typography">
<p>The ring is filled by alternating sides; the second node is clockwise from the first node;
This value is used for <a href="CircularLayout.html#direction">CircularLayout.direction</a>.</p>
</div></section><section class="tsd-panel tsd-member tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a id="static-Circular" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagStatic">Static</span> Circular<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span><a href="#static-Circular" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><div class="tsd-comment tsd-typography">
<p>The effective diameter is either the width or height of the node, whichever is larger;
This will cause circular nodes to touch when <a href="CircularLayout.html#spacing">CircularLayout.spacing</a> is 0;
This is ideal when the nodes are circular.
This value is used for <a href="CircularLayout.html#nodeDiameterFormula">CircularLayout.nodeDiameterFormula</a>.</p>
</div></section><section class="tsd-panel tsd-member tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a id="static-Clockwise" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagStatic">Static</span> Clockwise<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span><a href="#static-Clockwise" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path>