1954 lines
66 KiB
HTML
1954 lines
66 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>GoJS® CircularLayout Class</title>
|
|
|
|
<script src="../../assets/js/jquery.min.js"></script>
|
|
<script src="../../assets/js/bootstrap.min.js"></script>
|
|
<script src="../../assets/js/highlight.js"></script>
|
|
<script src="../../assets/js/api.js"></script>
|
|
|
|
<link href="../../assets/css/bootstrap.min.css" rel="stylesheet" >
|
|
<!-- custom CSS after bootstrap -->
|
|
<link href="../../assets/css/main.css" rel="stylesheet" type="text/css"/>
|
|
<link href="../../assets/css/api.css" rel="stylesheet" type="text/css"/>
|
|
<!--<link rel="stylesheet" href="../../assets/css/api.css" type="text/css" media="all" />-->
|
|
<link rel="stylesheet" href="../../assets/css/highlight.css" type="text/css" media="all" />
|
|
|
|
</head>
|
|
|
|
<body>
|
|
<!-- 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">API</a></li>
|
|
<li><a href="https://www.nwoods.com/components/evalform.htm">Register</a></li>
|
|
<li><a href="../../doc/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="container-fluid">
|
|
|
|
<!-- ============================== classes index ============================ -->
|
|
<div id="navindex" class="col-md-2">
|
|
<!-- begin publish.classesIndex -->
|
|
<!-- <div><a href="../index.html">GoJS Class Index</a></div> -->
|
|
|
|
<div class="sidebar-nav">
|
|
<div class="navbar navbar-default" role="navigation">
|
|
<div class="navbar-header">
|
|
<div class="navheader-container">
|
|
<div class="navheader-collapse" data-toggle="collapse" data-target="#DiagramNavbar">
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#DiagramNavbar">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
</div>
|
|
<span class="navbar-brand">Diagram Classes</span>
|
|
</div>
|
|
</div>
|
|
<div id="DiagramNavbar" class="navbar-collapse collapse sidebar-navbar-collapse">
|
|
<ul class="classList nav navbar-nav">
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Adornment.html" class="linkConstructor">Adornment</a></li>
|
|
|
|
<li><a href="../symbols/AnimationManager.html" class="linkConstructor">AnimationManager</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/CommandHandler.html" class="linkConstructor">CommandHandler</a></li>
|
|
|
|
|
|
|
|
<li><a href="../symbols/Diagram.html" class="linkConstructor">Diagram</a></li>
|
|
|
|
<li><a href="../symbols/DiagramEvent.html" class="linkConstructor">DiagramEvent</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/GraphObject.html" class="linkConstructor">GraphObject</a></li>
|
|
|
|
|
|
|
|
<li><a href="../symbols/Group.html" class="linkConstructor">Group</a></li>
|
|
|
|
|
|
|
|
<li><a href="../symbols/InputEvent.html" class="linkConstructor">InputEvent</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Layer.html" class="linkConstructor">Layer</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Link.html" class="linkConstructor">Link</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Node.html" class="linkConstructor">Node</a></li>
|
|
|
|
<li><a href="../symbols/Overview.html" class="linkConstructor">Overview</a></li>
|
|
|
|
<li><a href="../symbols/Palette.html" class="linkConstructor">Palette</a></li>
|
|
|
|
<li><a href="../symbols/Panel.html" class="linkConstructor">Panel</a></li>
|
|
|
|
|
|
|
|
<li><a href="../symbols/Part.html" class="linkConstructor">Part</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Picture.html" class="linkConstructor">Picture</a></li>
|
|
|
|
<li><a href="../symbols/Placeholder.html" class="linkConstructor">Placeholder</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/RowColumnDefinition.html" class="linkConstructor">RowColumnDefinition</a></li>
|
|
|
|
|
|
|
|
<li><a href="../symbols/Shape.html" class="linkConstructor">Shape</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/TextBlock.html" class="linkConstructor">TextBlock</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="navbar navbar-default" role="navigation">
|
|
<div class="navbar-header">
|
|
<div class="navheader-container">
|
|
<div class="navheader-collapse" data-toggle="collapse" data-target="#GeometryNavbar">
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#GeometryNavbar">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
</div>
|
|
<span class="navbar-brand">Geometry Classes</span>
|
|
</div>
|
|
</div>
|
|
<div id="GeometryNavbar" class="navbar-collapse collapse sidebar-navbar-collapse">
|
|
<ul class="classList nav navbar-nav">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Brush.html" class="linkConstructor">Brush</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Geometry.html" class="linkConstructor">Geometry</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Margin.html" class="linkConstructor">Margin</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/PathFigure.html" class="linkConstructor">PathFigure</a></li>
|
|
|
|
<li><a href="../symbols/PathSegment.html" class="linkConstructor">PathSegment</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Point.html" class="linkConstructor">Point</a></li>
|
|
|
|
<li><a href="../symbols/Rect.html" class="linkConstructor">Rect</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Size.html" class="linkConstructor">Size</a></li>
|
|
|
|
<li><a href="../symbols/Spot.html" class="linkConstructor">Spot</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="navbar navbar-default" role="navigation">
|
|
<div class="navbar-header">
|
|
<div class="navheader-container">
|
|
<div class="navheader-collapse" data-toggle="collapse" data-target="#ModelNavbar">
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#ModelNavbar">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
</div>
|
|
<span class="navbar-brand">Model Classes</span>
|
|
</div>
|
|
</div>
|
|
<div id="ModelNavbar" class="navbar-collapse collapse sidebar-navbar-collapse">
|
|
<ul class="classList nav navbar-nav">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Binding.html" class="linkConstructor">Binding</a></li>
|
|
|
|
|
|
|
|
<li><a href="../symbols/ChangedEvent.html" class="linkConstructor">ChangedEvent</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/GraphLinksModel.html" class="linkConstructor">GraphLinksModel</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Model.html" class="linkConstructor">Model</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Transaction.html" class="linkConstructor">Transaction</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/TreeModel.html" class="linkConstructor">TreeModel</a></li>
|
|
|
|
|
|
|
|
<li><a href="../symbols/UndoManager.html" class="linkConstructor">UndoManager</a></li>
|
|
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="navbar navbar-default" role="navigation">
|
|
<div class="navbar-header">
|
|
<div class="navheader-container">
|
|
<div class="navheader-collapse" data-toggle="collapse" data-target="#LayoutNavbar">
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#LayoutNavbar">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
</div>
|
|
<span class="navbar-brand">Layout Classes</span>
|
|
</div>
|
|
</div>
|
|
<div id="LayoutNavbar" class="navbar-collapse collapse sidebar-navbar-collapse">
|
|
<ul class="classList nav navbar-nav">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/CircularLayout.html" class="linkConstructor">CircularLayout</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/ForceDirectedLayout.html" class="linkConstructor">ForceDirectedLayout</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/GridLayout.html" class="linkConstructor">GridLayout</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/LayeredDigraphLayout.html" class="linkConstructor">LayeredDigraphLayout</a></li>
|
|
|
|
|
|
|
|
<li><a href="../symbols/Layout.html" class="linkConstructor">Layout</a></li>
|
|
|
|
|
|
|
|
<li><a href="../symbols/LayoutNetwork.html" class="linkConstructor">LayoutNetwork</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/TreeLayout.html" class="linkConstructor">TreeLayout</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="navbar navbar-default" role="navigation">
|
|
<div class="navbar-header">
|
|
<div class="navheader-container">
|
|
<div class="navheader-collapse" data-toggle="collapse" data-target="#ToolNavbar">
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#ToolNavbar">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
</div>
|
|
<span class="navbar-brand">Tool Classes</span>
|
|
</div>
|
|
</div>
|
|
<div id="ToolNavbar" class="navbar-collapse collapse sidebar-navbar-collapse">
|
|
<ul class="classList nav navbar-nav">
|
|
|
|
|
|
|
|
<li><a href="../symbols/ActionTool.html" class="linkConstructor">ActionTool</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/ClickCreatingTool.html" class="linkConstructor">ClickCreatingTool</a></li>
|
|
|
|
<li><a href="../symbols/ClickSelectingTool.html" class="linkConstructor">ClickSelectingTool</a></li>
|
|
|
|
|
|
|
|
<li><a href="../symbols/ContextMenuTool.html" class="linkConstructor">ContextMenuTool</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/DraggingTool.html" class="linkConstructor">DraggingTool</a></li>
|
|
|
|
<li><a href="../symbols/DragSelectingTool.html" class="linkConstructor">DragSelectingTool</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/HTMLInfo.html" class="linkConstructor">HTMLInfo</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/LinkingBaseTool.html" class="linkConstructor">LinkingBaseTool</a></li>
|
|
|
|
<li><a href="../symbols/LinkingTool.html" class="linkConstructor">LinkingTool</a></li>
|
|
|
|
<li><a href="../symbols/LinkReshapingTool.html" class="linkConstructor">LinkReshapingTool</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/PanningTool.html" class="linkConstructor">PanningTool</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/RelinkingTool.html" class="linkConstructor">RelinkingTool</a></li>
|
|
|
|
<li><a href="../symbols/ResizingTool.html" class="linkConstructor">ResizingTool</a></li>
|
|
|
|
<li><a href="../symbols/RotatingTool.html" class="linkConstructor">RotatingTool</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/TextEditingTool.html" class="linkConstructor">TextEditingTool</a></li>
|
|
|
|
<li><a href="../symbols/Tool.html" class="linkConstructor">Tool</a></li>
|
|
|
|
<li><a href="../symbols/ToolManager.html" class="linkConstructor">ToolManager</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="navbar navbar-default" role="navigation">
|
|
<div class="navbar-header">
|
|
<div class="navheader-container">
|
|
<div class="navheader-collapse" data-toggle="collapse" data-target="#CollectionNavbar">
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#CollectionNavbar">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
</div>
|
|
<span class="navbar-brand">Collection Classes</span>
|
|
</div>
|
|
</div>
|
|
<div id="CollectionNavbar" class="navbar-collapse collapse sidebar-navbar-collapse">
|
|
<ul class="classList nav navbar-nav">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Iterable.html" class="linkConstructor">Iterable</a></li>
|
|
|
|
<li><a href="../symbols/Iterator.html" class="linkConstructor">Iterator</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/List.html" class="linkConstructor">List</a></li>
|
|
|
|
<li><a href="../symbols/Map.html" class="linkConstructor">Map</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="../symbols/Set.html" class="linkConstructor">Set</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div> <!-- /class="sidebar-nav -->
|
|
|
|
|
|
|
|
|
|
<!-- end publish.classesIndex -->
|
|
</div>
|
|
|
|
<div id="contentBody" class="col-md-10">
|
|
<!-- ============================== header ================================= -->
|
|
<div id="header" class="fineprint mt30">
|
|
<b>GoJS</b>® Diagramming Components<br/>version 1.8.5 for JavaScript/HTML<br/>by <a href="https://www.nwoods.com/">Northwoods Software®</a>
|
|
</div>
|
|
|
|
<!-- ============================== class title ============================ -->
|
|
<h2 class="classTitle mt30">
|
|
|
|
Class CircularLayout
|
|
|
|
</h2>
|
|
|
|
<!-- ============================== class summary ========================== -->
|
|
<span class="hideshowall">
|
|
<span class="nodetails"><button id="buttonShow">Show Details</button></span>
|
|
<span class="details"><button id="buttonHide">Show Summaries</button></span>
|
|
</span>
|
|
|
|
<p class="classsummary">
|
|
|
|
<span class="extends"> Extends
|
|
<a href="../symbols/Layout.html" class="linkConstructor">Layout</a>.</span>
|
|
|
|
|
|
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 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>.
|
|
<p>
|
|
This layout makes use of a <a href="../symbols/LayoutNetwork.html" class="linkConstructor">LayoutNetwork</a> of
|
|
<a href="../symbols/CircularVertex.html" class="linkConstructor">CircularVertex</a>es and <a href="../symbols/CircularEdge.html" class="linkConstructor">CircularEdge</a>s that normally
|
|
correspond to the <a href="../symbols/Node.html" class="linkConstructor">Node</a>s and <a href="../symbols/Link.html" class="linkConstructor">Link</a>s of the <a href="../symbols/Diagram.html" class="linkConstructor">Diagram</a>.
|
|
</p>
|
|
|
|
<!-- ============================== constructor summary ==================== -->
|
|
|
|
<h2 id="constructor" class="summaryCaption"> Constructor <span class="nodetails"> Summary</span><span class="details"> Details</span></h2>
|
|
<div class="table-responsive">
|
|
<table class="summaryTable table table-bordered table-condensed" summary="A summary of the constructor documented in the class CircularLayout.">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col" class="name">Name</th>
|
|
<th scope="col" class="description">Description</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td class="name" >
|
|
<div class="name">
|
|
CircularLayout()
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>Constructs a <a href="../symbols/CircularLayout.html" class="linkConstructor">CircularLayout</a> with no <a href="../symbols/Layout.html#network" class="linkProperty">Layout.network</a>
|
|
and with no owning <a href="../symbols/Layout.html#diagram" class="linkProperty">Layout.diagram</a>.
|
|
|
|
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div><!-- class="table-responsive">-->
|
|
|
|
|
|
<!-- ============================== properties summary ===================== -->
|
|
|
|
|
|
|
|
<h2 class="summaryCaption">Properties<span class="nodetails"> Summary</span><span class="details"> Details</span></h2>
|
|
<div class="table-responsive">
|
|
<table class="summaryTable table table-bordered table-condensed" summary="A summary of the properties documented in the class CircularLayout.">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col" class="name">Name, Value Type</th>
|
|
<th scope="col" class="description">Description</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
|
|
<tr id="actualCenter" >
|
|
|
|
<td class="name">
|
|
<div class="name">
|
|
actualCenter
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{<a href="../symbols/Point.html" class="linkConstructor">Point</a>}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp <p> -->
|
|
<p>This read-only property is the coordinates of the center of the laid-out ellipse after the layout.
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="actualSpacing" >
|
|
|
|
<td class="name">
|
|
<div class="name">
|
|
actualSpacing
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{number}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp <p> -->
|
|
<p>This read-only property is the effective spacing that may have been calculated by the layout.
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="actualXRadius" >
|
|
|
|
<td class="name">
|
|
<div class="name">
|
|
actualXRadius
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{number}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp <p> -->
|
|
<p>This read-only property is the effective X radius that may have been calculated by the layout.
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="actualYRadius" >
|
|
|
|
<td class="name">
|
|
<div class="name">
|
|
actualYRadius
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{number}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp <p> -->
|
|
<p>This read-only property is the effective Y radius that may have been calculated by the layout.
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="arrangement" >
|
|
|
|
<td class="name">
|
|
<div class="name">
|
|
arrangement
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp <p> -->
|
|
<p>Gets or sets how the nodes are spaced.<span class="nodetails" id="xproparrangement"><a class="morelink" onclick="hst('proparrangement')">More...</a></span> <span class="details" id="proparrangement">
|
|
If <a href="../symbols/CircularLayout.html#arrangement" class="linkProperty">arrangement</a> === <a href="../symbols/CircularLayout.html#Packed" class="linkConstant">CircularLayout.Packed</a>,
|
|
the specified <a href="../symbols/CircularLayout.html#radius" class="linkProperty">radius</a> will be ignored.
|
|
</span><div class="details" id="dproparrangement"><p>
|
|
The default value is <a href="../symbols/CircularLayout.html#ConstantSpacing" class="linkConstant">CircularLayout.ConstantSpacing</a>.</div>
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="aspectRatio" >
|
|
|
|
<td class="name">
|
|
<div class="name">
|
|
aspectRatio
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{number}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp <p> -->
|
|
<p>Gets or sets the ratio of the arrangement's height to its width
|
|
(1 for a circle, >1 for a vertically elongated ellipse).<span class="nodetails" id="xpropaspectRatio"><a class="morelink" onclick="hst('propaspectRatio')">More...</a></span> <span class="details" id="propaspectRatio">
|
|
</span><div class="details" id="dpropaspectRatio"><p>
|
|
This is 1 by default.
|
|
The value must be a positive number.
|
|
<p>
|
|
Modifying this value changes the height, but keeps the width and the <a href="../symbols/CircularLayout.html#radius" class="linkProperty">radius</a> constant.</div>
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="comparer" >
|
|
|
|
<td class="name">
|
|
<div class="name">
|
|
comparer
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{function(CircularVertex, CircularVertex):number}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp <p> -->
|
|
<p>Gets or sets the comparer which sorts the data when <a href="../symbols/CircularLayout.html#sorting" class="linkProperty">sorting</a> is
|
|
set to <a href="../symbols/CircularLayout.html#Ascending" class="linkConstant">CircularLayout.Ascending</a> or <a href="../symbols/CircularLayout.html#Descending" class="linkConstant">CircularLayout.Descending</a>.<span class="nodetails" id="xpropcomparer"><a class="morelink" onclick="hst('propcomparer')">More...</a></span> <span class="details" id="propcomparer">
|
|
</span><div class="details" id="dpropcomparer"><p>
|
|
The default function compares the <a href="../symbols/Part.html#text" class="linkProperty">Part.text</a> values of the vertexes' <a href="../symbols/LayoutVertex.html#node" class="linkProperty">LayoutVertex.node</a>s.</div>
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="direction" >
|
|
|
|
<td class="name">
|
|
<div class="name">
|
|
direction
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp <p> -->
|
|
<p>Gets or sets whether the nodes are arranged clockwise or counterclockwise.<span class="nodetails" id="xpropdirection"><a class="morelink" onclick="hst('propdirection')">More...</a></span> <span class="details" id="propdirection">
|
|
</span><div class="details" id="dpropdirection"><p>
|
|
The default value is <a href="../symbols/CircularLayout.html#Clockwise" class="linkConstant">CircularLayout.Clockwise</a>.</div>
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="nodeDiameterFormula" >
|
|
|
|
<td class="name">
|
|
<div class="name">
|
|
nodeDiameterFormula
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp <p> -->
|
|
<p>Specifies how the diameter of nodes will be calculated.<span class="nodetails" id="xpropnodeDiameterFormula"><a class="morelink" onclick="hst('propnodeDiameterFormula')">More...</a></span> <span class="details" id="propnodeDiameterFormula">
|
|
When a node is not circular, it is not clear what its diameter is.
|
|
</span><div class="details" id="dpropnodeDiameterFormula"><p>
|
|
The default is <a href="../symbols/CircularLayout.html#Pythagorean" class="linkConstant">CircularLayout.Pythagorean</a>.</div>
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="radius" >
|
|
|
|
<td class="name">
|
|
<div class="name">
|
|
radius
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{number}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp <p> -->
|
|
<p>Gets or sets the horizontal radius of the elliptical arrangement.<span class="nodetails" id="xpropradius"><a class="morelink" onclick="hst('propradius')">More...</a></span> <span class="details" id="propradius">
|
|
</span><div class="details" id="dpropradius"><p>
|
|
The default value is NaN.
|
|
NaN indicates that the <a href="../symbols/CircularLayout.html#spacing" class="linkProperty">spacing</a> will determine the size of the ring.
|
|
If <a href="../symbols/CircularLayout.html#spacing" class="linkProperty">spacing</a> is also NaN, the effective spacing will be 6.
|
|
If <a href="../symbols/CircularLayout.html#spacing" class="linkProperty">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="../symbols/CircularLayout.html#radius" class="linkProperty">radius</a> will be ignored if <a href="../symbols/CircularLayout.html#arrangement" class="linkProperty">arrangement</a> === <a href="../symbols/CircularLayout.html#Packed" class="linkConstant">CircularLayout.Packed</a>.
|
|
This property must always be positive or NaN.</div>
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="sorting" >
|
|
|
|
<td class="name">
|
|
<div class="name">
|
|
sorting
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp <p> -->
|
|
<p>Gets or sets if and how the nodes are sorted.<span class="nodetails" id="xpropsorting"><a class="morelink" onclick="hst('propsorting')">More...</a></span> <span class="details" id="propsorting">
|
|
</span><div class="details" id="dpropsorting"><p>
|
|
<a href="../symbols/CircularLayout.html#Forwards" class="linkConstant">CircularLayout.Forwards</a> indicates that the nodes are arranged in the order the layout gets them.
|
|
<a href="../symbols/CircularLayout.html#Reverse" class="linkConstant">CircularLayout.Reverse</a> indicates that the nodes are arranged in the reverse order that the layout gets them.
|
|
<a href="../symbols/CircularLayout.html#Ascending" class="linkConstant">CircularLayout.Ascending</a> and <a href="../symbols/CircularLayout.html#Descending" class="linkConstant">CircularLayout.Descending</a> indicate that the nodes
|
|
will be sorted using the <a href="../symbols/CircularLayout.html#comparer" class="linkProperty">comparer</a>.
|
|
<a href="../symbols/CircularLayout.html#Optimized" class="linkConstant">CircularLayout.Optimized</a> indicates that the nodes will be arranged to minimize link crossings.
|
|
<p>
|
|
The default value is <a href="../symbols/CircularLayout.html#Optimized" class="linkConstant">CircularLayout.Optimized</a>.</div>
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="spacing" >
|
|
|
|
<td class="name">
|
|
<div class="name">
|
|
spacing
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{number}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp <p> -->
|
|
<p>Gets or sets the distance between nodes (if <a href="../symbols/CircularLayout.html#radius" class="linkProperty">radius</a> is NaN)
|
|
or the minimum distance between nodes (if <a href="../symbols/CircularLayout.html#radius" class="linkProperty">radius</a> is a number).<span class="nodetails" id="xpropspacing"><a class="morelink" onclick="hst('propspacing')">More...</a></span> <span class="details" id="propspacing">
|
|
</span><div class="details" id="dpropspacing"><p>
|
|
The default value is 6.
|
|
The value may be NaN.
|
|
<p>
|
|
If <a href="../symbols/CircularLayout.html#spacing" class="linkProperty">spacing</a> is NaN, there is no minimum spacing, allowing nodes to overlap,
|
|
unless <a href="../symbols/CircularLayout.html#radius" class="linkProperty">radius</a> is NaN,
|
|
in which case the effective spacing will be 6 to determine an effective radius.
|
|
If <a href="../symbols/CircularLayout.html#spacing" class="linkProperty">spacing</a> is a number but <a href="../symbols/CircularLayout.html#radius" class="linkProperty">radius</a> isn't,
|
|
the effective spacing will be spacing, and this will determine the effective radius.
|
|
If both <a href="../symbols/CircularLayout.html#spacing" class="linkProperty">spacing</a> and <a href="../symbols/CircularLayout.html#radius" class="linkProperty">radius</a> are numbers,
|
|
the effective radius will be at least <a href="../symbols/CircularLayout.html#radius" class="linkProperty">radius</a>,
|
|
but may be larger so that the minimum spacing between nodes is <a href="../symbols/CircularLayout.html#spacing" class="linkProperty">spacing</a>.</div>
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="startAngle" >
|
|
|
|
<td class="name">
|
|
<div class="name">
|
|
startAngle
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{number}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp <p> -->
|
|
<p>Gets or sets the angle (in degrees, clockwise from the positive side of the X axis) of the first element.<span class="nodetails" id="xpropstartAngle"><a class="morelink" onclick="hst('propstartAngle')">More...</a></span> <span class="details" id="propstartAngle">
|
|
</span><div class="details" id="dpropstartAngle"><p>
|
|
The default value is 0.</div>
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="sweepAngle" >
|
|
|
|
<td class="name">
|
|
<div class="name">
|
|
sweepAngle
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{number}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp <p> -->
|
|
<p>Gets or sets the absolute angle (in degrees) between the first and last node.<span class="nodetails" id="xpropsweepAngle"><a class="morelink" onclick="hst('propsweepAngle')">More...</a></span> <span class="details" id="propsweepAngle">
|
|
</span><div class="details" id="dpropsweepAngle"><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>
|
|
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="../symbols/CircularLayout.html#direction" class="linkProperty">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.</div>
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
</tbody>
|
|
</table>
|
|
</div><!-- class="table-responsive">-->
|
|
|
|
|
|
|
|
<dl class="inheritsList">
|
|
<dt>Properties borrowed from class <a href="../symbols/Layout.html" class="linkConstructor">Layout</a>: </dt><dd><a href="../symbols/Layout.html#arrangementOrigin" class="linkProperty">arrangementOrigin</a>, <a href="../symbols/Layout.html#diagram" class="linkProperty">diagram</a>, <a href="../symbols/Layout.html#group" class="linkProperty">group</a>, <a href="../symbols/Layout.html#isInitial" class="linkProperty">isInitial</a>, <a href="../symbols/Layout.html#isOngoing" class="linkProperty">isOngoing</a>, <a href="../symbols/Layout.html#isRealtime" class="linkProperty">isRealtime</a>, <a href="../symbols/Layout.html#isRouting" class="linkProperty">isRouting</a>, <a href="../symbols/Layout.html#isValidLayout" class="linkProperty">isValidLayout</a>, <a href="../symbols/Layout.html#isViewportSized" class="linkProperty">isViewportSized</a>, <a href="../symbols/Layout.html#network" class="linkProperty">network</a></dd>
|
|
</dl>
|
|
|
|
|
|
|
|
<!-- ============================== methods summary ======================== -->
|
|
|
|
|
|
|
|
<h2 class="summaryCaption">Method <span class="nodetails"> Summary</span><span class="details"> Details</span></h2>
|
|
<div class="table-responsive">
|
|
<table class="summaryTable table table-bordered table-condensed" summary="A summary of the methods documented in the class CircularLayout.">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col" class="name">Name, Return Type</th>
|
|
<th scope="col" class="description">Description</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
|
|
<tr id="commitLayout">
|
|
<td class="name">
|
|
|
|
<div class="name">
|
|
commitLayout()
|
|
</div>
|
|
<div class="attributes">
|
|
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>Position each <a href="../symbols/Node.html" class="linkConstructor">Node</a> according to the Vertex position, and then position the <a href="../symbols/Link.html" class="linkConstructor">Link</a>s.<span class="nodetails" id="xmethcommitLayout"><a class="morelink" onclick="hst('methcommitLayout')">More...</a></span> <span class="details" id="methcommitLayout">
|
|
</span><div class="details" id="dmethcommitLayout"><p>
|
|
You should not call this method -- it is a "protected virtual" method.</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="commitLinks">
|
|
<td class="name">
|
|
|
|
<div class="name">
|
|
commitLinks()
|
|
</div>
|
|
<div class="attributes">
|
|
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>Commit the position and routing of all edge links.<span class="nodetails" id="xmethcommitLinks"><a class="morelink" onclick="hst('methcommitLinks')">More...</a></span> <span class="details" id="methcommitLinks">
|
|
This is called by <a href="../symbols/CircularLayout.html#commitLayout" class="linkMethod">commitLayout</a>.
|
|
This is only called if <a href="../symbols/Layout.html#isRouting" class="linkProperty">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.</span>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="commitNodes">
|
|
<td class="name">
|
|
|
|
<div class="name">
|
|
commitNodes()
|
|
</div>
|
|
<div class="attributes">
|
|
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>Commit the position of all vertex nodes.<span class="nodetails" id="xmethcommitNodes"><a class="morelink" onclick="hst('methcommitNodes')">More...</a></span> <span class="details" id="methcommitNodes">
|
|
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.</span>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="createNetwork">
|
|
<td class="name">
|
|
|
|
<div class="name">
|
|
createNetwork()
|
|
</div>
|
|
<div class="attributes">
|
|
<span class="light">{CircularNetwork}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>Create a new <a href="../symbols/LayoutNetwork.html" class="linkConstructor">LayoutNetwork</a> of <a href="../symbols/CircularVertex.html" class="linkConstructor">CircularVertex</a>es and <a href="../symbols/CircularEdge.html" class="linkConstructor">CircularEdge</a>s.
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dt><span class="light fixedFont">{CircularNetwork}</span> a new <a href="../symbols/LayoutNetwork.html" class="linkConstructor">LayoutNetwork</a>.</dt>
|
|
|
|
</dl>
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="doLayout">
|
|
<td class="name">
|
|
|
|
<div class="name">
|
|
doLayout(coll)
|
|
</div>
|
|
<div class="attributes">
|
|
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>Assign the positions of the vertexes in the network.<span class="nodetails" id="xmethdoLayout"><a class="morelink" onclick="hst('methdoLayout')">More...</a></span> <span class="details" id="methdoLayout"></span>
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/Diagram.html" class="linkConstructor">Diagram</a>|<a href="../symbols/Group.html" class="linkConstructor">Group</a>|Iterable.<Part>}</span> <b>coll</b>
|
|
|
|
</dt>
|
|
<dd>A <a href="../symbols/Diagram.html" class="linkConstructor">Diagram</a> or a <a href="../symbols/Group.html" class="linkConstructor">Group</a> or a collection of <a href="../symbols/Part.html" class="linkConstructor">Part</a>s.</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
</tbody>
|
|
</table>
|
|
</div><!-- class="table-responsive">-->
|
|
|
|
|
|
|
|
<dl class="inheritsList">
|
|
<dt>Methods borrowed from class <a href="../symbols/Layout.html" class="linkConstructor">Layout</a>: </dt><dd><a href="../symbols/Layout.html#cloneProtected" class="linkMethod">cloneProtected</a>, <a href="../symbols/Layout.html#collectParts" class="linkMethod">collectParts</a>, <a href="../symbols/Layout.html#copy" class="linkMethod">copy</a>, <a href="../symbols/Layout.html#invalidateLayout" class="linkMethod">invalidateLayout</a>, <a href="../symbols/Layout.html#makeNetwork" class="linkMethod">makeNetwork</a>, <a href="../symbols/Layout.html#updateParts" class="linkMethod">updateParts</a></dd>
|
|
</dl>
|
|
|
|
|
|
<!-- ============================== events summary ======================== -->
|
|
|
|
|
|
<!-- ============================== fields summary ===================== -->
|
|
|
|
|
|
|
|
<h2 class="summaryCaption">Constants<span class="nodetails"> Summary</span><span class="details"> Details</span></h2>
|
|
<div class="table-responsive">
|
|
<table class="summaryTable table table-bordered table-condensed" summary="A summary of the properties documented in the class CircularLayout.">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col" class="name">Name</th>
|
|
<th scope="col" class="description">Description</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
|
|
<tr id="Ascending">
|
|
<td class="name">
|
|
<div class="name">
|
|
Ascending
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>Nodes are sorted using the <a href="../symbols/CircularLayout.html#comparer" class="linkProperty">comparer</a>, in ascending order;
|
|
This value is used for <a href="../symbols/CircularLayout.html#sorting" class="linkProperty">CircularLayout.sorting</a>.
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="BidirectionalLeft">
|
|
<td class="name">
|
|
<div class="name">
|
|
BidirectionalLeft
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>The ring is filled by alternating sides; the second node is counterclockwise from the first node;
|
|
This value is used for <a href="../symbols/CircularLayout.html#direction" class="linkProperty">CircularLayout.direction</a>.
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="BidirectionalRight">
|
|
<td class="name">
|
|
<div class="name">
|
|
BidirectionalRight
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>The ring is filled by alternating sides; the second node is clockwise from the first node;
|
|
This value is used for <a href="../symbols/CircularLayout.html#direction" class="linkProperty">CircularLayout.direction</a>.
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="Circular">
|
|
<td class="name">
|
|
<div class="name">
|
|
Circular
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><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="../symbols/CircularLayout.html#spacing" class="linkProperty">CircularLayout.spacing</a> is 0;
|
|
This is ideal when the nodes are circular.<span class="nodetails" id="xfldCircular"><a class="morelink" onclick="hst('fldCircular')">More...</a></span> <span class="details" id="fldCircular">
|
|
This value is used for <a href="../symbols/CircularLayout.html#nodeDiameterFormula" class="linkProperty">CircularLayout.nodeDiameterFormula</a>.</span>
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="Clockwise">
|
|
<td class="name">
|
|
<div class="name">
|
|
Clockwise
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>Rings are filled clockwise;
|
|
This value is used for <a href="../symbols/CircularLayout.html#direction" class="linkProperty">CircularLayout.direction</a>.
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="ConstantAngle">
|
|
<td class="name">
|
|
<div class="name">
|
|
ConstantAngle
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>The angular distance between the nodes is constant;
|
|
This value is used for <a href="../symbols/CircularLayout.html#arrangement" class="linkProperty">CircularLayout.arrangement</a>.
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="ConstantDistance">
|
|
<td class="name">
|
|
<div class="name">
|
|
ConstantDistance
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>The distance between the centers of the nodes is constant;
|
|
This value is used for <a href="../symbols/CircularLayout.html#arrangement" class="linkProperty">CircularLayout.arrangement</a>.
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="ConstantSpacing">
|
|
<td class="name">
|
|
<div class="name">
|
|
ConstantSpacing
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>The spacing between the idealized boundaries of the nodes is constant;
|
|
This value is used for <a href="../symbols/CircularLayout.html#arrangement" class="linkProperty">CircularLayout.arrangement</a>.
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="Counterclockwise">
|
|
<td class="name">
|
|
<div class="name">
|
|
Counterclockwise
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>Rings are filled counterclockwise;
|
|
This value is used for <a href="../symbols/CircularLayout.html#direction" class="linkProperty">CircularLayout.direction</a>.
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="Descending">
|
|
<td class="name">
|
|
<div class="name">
|
|
Descending
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>Nodes are sorted using the <a href="../symbols/CircularLayout.html#comparer" class="linkProperty">comparer</a>, in reverse ascending (descending) order;
|
|
This value is used for <a href="../symbols/CircularLayout.html#sorting" class="linkProperty">CircularLayout.sorting</a>.
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="Forwards">
|
|
<td class="name">
|
|
<div class="name">
|
|
Forwards
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>Nodes are arranged in the order given;
|
|
This value is used for <a href="../symbols/CircularLayout.html#sorting" class="linkProperty">CircularLayout.sorting</a>.
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="Optimized">
|
|
<td class="name">
|
|
<div class="name">
|
|
Optimized
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>Nodes are ordered to reduce link crossings;
|
|
This value is used for <a href="../symbols/CircularLayout.html#sorting" class="linkProperty">CircularLayout.sorting</a>.
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="Packed">
|
|
<td class="name">
|
|
<div class="name">
|
|
Packed
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>The vertices are arranged as close together as possible considering the <a href="../symbols/CircularLayout.html#spacing" class="linkProperty">CircularLayout.spacing</a>,
|
|
assuming the nodes are rectangular;
|
|
This value is used for <a href="../symbols/CircularLayout.html#arrangement" class="linkProperty">CircularLayout.arrangement</a>.
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="Pythagorean">
|
|
<td class="name">
|
|
<div class="name">
|
|
Pythagorean
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>The effective diameter is sqrt(width^2+height^2);
|
|
The corners of square nodes will touch at 45 degrees when <a href="../symbols/CircularLayout.html#spacing" class="linkProperty">CircularLayout.spacing</a> is 0;
|
|
This value is used for <a href="../symbols/CircularLayout.html#nodeDiameterFormula" class="linkProperty">CircularLayout.nodeDiameterFormula</a>.
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr id="Reverse">
|
|
<td class="name">
|
|
<div class="name">
|
|
Reverse
|
|
|
|
|
|
<span class="light">{EnumValue}</span>
|
|
|
|
</div>
|
|
</td>
|
|
<td class="description">
|
|
<div class="description">
|
|
<!--newp--><p><p>Nodes are arranged in the reverse of the order given;
|
|
This value is used for <a href="../symbols/CircularLayout.html#sorting" class="linkProperty">CircularLayout.sorting</a>.
|
|
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
|
|
</tbody>
|
|
</table>
|
|
</div><!-- class="table-responsive">-->
|
|
|
|
|
|
|
|
|
|
<!-- ============================== constructor details ==================== -->
|
|
|
|
</div> <!-- end contentBody -->
|
|
</div> <!-- end container-fluid -->
|
|
|
|
<!-- ============================== footer ================================= -->
|
|
<div id="footer" class="fineprint" style="clear:both">
|
|
Copyright © 1998-2017 by <a href="https://www.nwoods.com/">Northwoods Software Corporation.</a>
|
|
</div>
|
|
</body>
|
|
</html>
|