gojs
Version:
Interactive diagrams, charts, and graphs, such as trees, flowcharts, orgcharts, UML, BPMN, or business diagrams
1,567 lines (544 loc) • 52.5 kB
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>GoJS® TreeModel Class</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/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>
<!--
<div id="topbar">
<div id="topbar-inner">
<ul>
<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="../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/support/query.htm">Contact</a></li>
<li class="buy"><a href="https://www.nwoods.com/sales/ordering.htm">Buy</a></li>
<li class="activate"><a href="https://www.nwoods.com/app/activate.aspx?sku=gojs">Activate</a></li>
</ul>
</div>
</div>
-->
<!-- non-fixed navbar -->
<nav id="api-nav" class="navbar navbar-inverse navbar-top">
<div class="container">
<div class="navbar-header" data-toggle="collapse" data-target="#navbar">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!--<a class="navbar-brand" href="#">GoJS</a>-->
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li class="active"><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/support/query.htm">Contact</a></li>
<li class="buy"><a href="https://www.nwoods.com/sales/ordering.htm">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" id="api-container">
<div class="row">
<!-- ============================== 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" 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>
<span class="navbar-brand">Diagram Classes</span>
</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" 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>
<span class="navbar-brand">Geometry Classes</span>
</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" 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>
<span class="navbar-brand">Model Classes</span>
</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" 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>
<span class="navbar-brand">Layout Classes</span>
</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" 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>
<span class="navbar-brand">Tool Classes</span>
</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/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" 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>
<span class="navbar-brand">Collection Classes</span>
</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.6.10 for JavaScript/HTML<br/>by <a href="https://www.nwoods.com/">Northwoods Software®</a>
</div>
<!-- ============================== class title ============================ -->
<h2 class="classTitle mt30">
Class TreeModel
</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/Model.html" class="linkConstructor">Model</a>.</span>
TreeModels support tree-structured graphs of nodes and links.
Each node can have at most one "tree parent"; cycles are not permitted.
The reference to the parent node's key is a property of the child node data.
<p>
TreeModels, unlike <a href="../symbols/GraphLinksModel.html" class="linkConstructor">GraphLinksModel</a>s, do not support arbitrary link relationships between nodes,
nor is there a separate link data object for each parent-child relationship.
Furthermore there is no support for grouping or label nodes.
<p>
The <a href="../symbols/TreeModel.html#nodeParentKeyProperty" class="linkProperty">nodeParentKeyProperty</a> property names the property on the node data whose value
is the key of the "tree parent" node.
The default value for this property is "parent".
<p>
For example, one can define a graph consisting of one parent node with two child nodes:
<pre class="javascript">
model.nodeDataArray = [
{ key: "Alpha" },
{ key: "Beta", parent: "Alpha" },
{ key: "Gamma", parent: "Alpha" }
];
</pre>
<p>
If you need to show a more complicated graph structure than a tree, use a <a href="../symbols/GraphLinksModel.html" class="linkConstructor">GraphLinksModel</a>.
If you want to have multiple links between the same pair of nodes,
or if you want to associate more information with each link and cannot put the information on the child node,
you will need to have a separate link data object for each link,
and that would require the use of <a href="../symbols/GraphLinksModel.html" class="linkConstructor">GraphLinksModel</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 TreeModel.">
<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">
TreeModel(nodedataarray)
</div>
</td>
<td class="description">
<div class="description">
<!--newp--><p><p>This constructs an empty TreeModel unless one provides arguments as the initial data array values
for the <a href="../symbols/Model.html#nodeDataArray" class="linkProperty">Model.nodeDataArray</a> property.<span class="nodetails" id="xconTreeModel"><a class="morelink" onclick="hst('conTreeModel')">More...</a></span> <span class="details" id="conTreeModel"></span>
<dl class="detailList">
<dt class="heading">Parameters:</dt>
<dt>
<span class="light fixedFont">{Array=}</span> <b>nodedataarray</b>
</dt>
<dd>an optional Array containing JavaScript objects to be represented by Nodes.</dd>
</dl>
</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 TreeModel.">
<thead>
<tr>
<th scope="col" class="name">Name, Value Type</th>
<th scope="col" class="description">Description</th>
</tr>
</thead>
<tbody>
<tr id="nodeParentKeyProperty" >
<td class="name">
<div class="name">
nodeParentKeyProperty
</div>
<div class="attributes">
<span class="light">{string|function(Object,(string|number)=):(string|number)}</span>
</div>
</td>
<td class="description">
<div class="description">
<!--newp <p> -->
<p>Gets or sets the name of the property on node data that specifies
the string or number key of the node data that acts as the "parent" for this "child" node data,
or a function that takes a node data object and returns that parent key;
the default value is the name 'parent'.<span class="nodetails" id="xpropnodeParentKeyProperty"><a class="morelink" onclick="hst('propnodeParentKeyProperty')">More...</a></span> <span class="details" id="propnodeParentKeyProperty">
The value must not be null nor an empty string.</span>
<div class="seealso">See also:
<ul class="seealsolist">
<li><a href="../symbols/TreeModel.html#getParentKeyForNodeData" class="linkMethod">getParentKeyForNodeData</a></li>
<li><a href="../symbols/TreeModel.html#setParentKeyForNodeData" class="linkMethod">setParentKeyForNodeData</a></li>
</ul>
</div>
</div>
</td>
</tr>
<tr id="parentLinkCategoryProperty" >
<td class="name">
<div class="name">
parentLinkCategoryProperty
</div>
<div class="attributes">
<span class="light">{string|function(Object,string=):string}</span>
</div>
</td>
<td class="description">
<div class="description">
<!--newp <p> -->
<p>Gets or sets the name of the data property that returns a string describing that node data's parent link's category,
or a function that takes a node data object and returns its parent link's category string;
the default value is the name 'parentLinkCategory'.<span class="nodetails" id="xpropparentLinkCategoryProperty"><a class="morelink" onclick="hst('propparentLinkCategoryProperty')">More...</a></span> <span class="details" id="propparentLinkCategoryProperty">
This is used by the diagram to distinguish between different kinds of links.
The name must not be null.
If the value is an empty string,
<a href="../symbols/TreeModel.html#getParentLinkCategoryForNodeData" class="linkMethod">getParentLinkCategoryForNodeData</a> will return an empty string for all node data objects.</span>
<div class="seealso">See also:
<ul class="seealsolist">
<li><a href="../symbols/TreeModel.html#getParentLinkCategoryForNodeData" class="linkMethod">getParentLinkCategoryForNodeData</a></li>
<li><a href="../symbols/TreeModel.html#setParentLinkCategoryForNodeData" class="linkMethod">setParentLinkCategoryForNodeData</a></li>
</ul>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div><!-- class="table-responsive">-->
<dl class="inheritsList">
<dt>Properties borrowed from class <a href="../symbols/Model.html" class="linkConstructor">Model</a>: </dt><dd><a href="../symbols/Model.html#copiesArrayObjects" class="linkProperty">copiesArrayObjects</a>, <a href="../symbols/Model.html#copiesArrays" class="linkProperty">copiesArrays</a>, <a href="../symbols/Model.html#copyNodeDataFunction" class="linkProperty">copyNodeDataFunction</a>, <a href="../symbols/Model.html#dataFormat" class="linkProperty">dataFormat</a>, <a href="../symbols/Model.html#isReadOnly" class="linkProperty">isReadOnly</a>, <a href="../symbols/Model.html#makeUniqueKeyFunction" class="linkProperty">makeUniqueKeyFunction</a>, <a href="../symbols/Model.html#modelData" class="linkProperty">modelData</a>, <a href="../symbols/Model.html#name" class="linkProperty">name</a>, <a href="../symbols/Model.html#nodeCategoryProperty" class="linkProperty">nodeCategoryProperty</a>, <a href="../symbols/Model.html#nodeDataArray" class="linkProperty">nodeDataArray</a>, <a href="../symbols/Model.html#nodeKeyProperty" class="linkProperty">nodeKeyProperty</a>, <a href="../symbols/Model.html#skipsUndoManager" class="linkProperty">skipsUndoManager</a>, <a href="../symbols/Model.html#undoManager" class="linkProperty">undoManager</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 TreeModel.">
<thead>
<tr>
<th scope="col" class="name">Name, Return Type</th>
<th scope="col" class="description">Description</th>
</tr>
</thead>
<tbody>
<tr id="copyNodeData">
<td class="name">
<div class="name">
copyNodeData(nodedata)
</div>
<div class="attributes">
<span class="light">{Object}</span>
</div>
</td>
<td class="description">
<div class="description">
<!--newp--><p><p>This override also makes sure any copied node data does not have a reference to a parent node.<span class="nodetails" id="xmethcopyNodeData"><a class="morelink" onclick="hst('methcopyNodeData')">More...</a></span> <span class="details" id="methcopyNodeData"></span>
</p><div class="seealso">See also:
<ul class="seealsolist">
<li><a href="../symbols/Model.html#copyNodeData" class="linkMethod">Model.copyNodeData</a></li>
</ul></div>
<dl class="detailList">
<dt class="heading">Parameters:</dt>
<dt>
<span class="light fixedFont">{Object}</span> <b>nodedata</b>
</dt>
<dd>a JavaScript object represented by a node, group, or non-link.</dd>
</dl>
<dl class="detailList">
<dt class="heading">Returns:</dt>
<dt><span class="light fixedFont">{Object}</span> </dt>
</dl>
</div>
</td>
</tr>
<tr id="getParentKeyForNodeData">
<td class="name">
<div class="name">
getParentKeyForNodeData(nodedata)
</div>
<div class="attributes">
<span class="light">{string|number|undefined}</span>
</div>
</td>
<td class="description">
<div class="description">
<!--newp--><p><p>If there is a parent node for the given node data, return the parent's key.<span class="nodetails" id="xmethgetParentKeyForNodeData"><a class="morelink" onclick="hst('methgetParentKeyForNodeData')">More...</a></span> <span class="details" id="methgetParentKeyForNodeData"></span>
</p><div class="seealso">See also:
<ul class="seealsolist">
<li><a href="../symbols/TreeModel.html#nodeParentKeyProperty" class="linkProperty">nodeParentKeyProperty</a></li>
<li><a href="../symbols/TreeModel.html#setParentKeyForNodeData" class="linkMethod">setParentKeyForNodeData</a></li>
</ul></div>
<dl class="detailList">
<dt class="heading">Parameters:</dt>
<dt>
<span class="light fixedFont">{Object}</span> <b>nodedata</b>
</dt>
<dd>a JavaScript object represented by a node.</dd>
</dl>
<dl class="detailList">
<dt class="heading">Returns:</dt>
<dt><span class="light fixedFont">{string|number|undefined}</span> This returns undefined if there is no parent node data object.</dt>
</dl>
</div>
</td>
</tr>
<tr id="getParentLinkCategoryForNodeData">
<td class="name">
<div class="name">
getParentLinkCategoryForNodeData(childdata)
</div>
<div class="attributes">
<span class="light">{string}</span>
</div>
</td>
<td class="description">
<div class="description">
<!--newp--><p><p>Find the category for the parent link of a given child node data, a string naming the link template
that the <a href="../symbols/Diagram.html" class="linkConstructor">Diagram</a> should use to represent the link.<span class="nodetails" id="xmethgetParentLinkCategoryForNodeData"><a class="morelink" onclick="hst('methgetParentLinkCategoryForNodeData')">More...</a></span> <span class="details" id="methgetParentLinkCategoryForNodeData"></span>
</p><div class="seealso">See also:
<ul class="seealsolist">
<li><a href="../symbols/TreeModel.html#parentLinkCategoryProperty" class="linkProperty">parentLinkCategoryProperty</a></li>
<li><a href="../symbols/TreeModel.html#setParentLinkCategoryForNodeData" class="linkMethod">setParentLinkCategoryForNodeData</a></li>
</ul></div>
<dl class="detailList">
<dt class="heading">Parameters:</dt>
<dt>
<span class="light fixedFont">{Object}</span> <b>childdata</b>
</dt>
<dd>a JavaScript object represented by a node data.</dd>
</dl>
<dl class="detailList">
<dt class="heading">Returns:</dt>
<dt><span class="light fixedFont">{string}</span> </dt>
</dl>
</div>
</td>
</tr>
<tr id="setDataProperty">
<td class="name">
<div class="name">
setDataProperty(data, propname, val)
</div>
<div class="attributes">
</div>
</td>
<td class="description">
<div class="description">
<!--newp--><p><p>This override changes the value of some property of a node data or an item data, given a string naming the property
and the new value, in a manner that can be undone/redone and that automatically updates any bindings.<span class="nodetails" id="xmethsetDataProperty"><a class="morelink" onclick="hst('methsetDataProperty')">More...</a></span> <span class="details" id="methsetDataProperty">
</span><div class="details" id="dmethsetDataProperty"><p>
This gets the old value of the property; if the value is the same as the new value, no side-effects occur.</div>
</p><div class="seealso">See also:
<ul class="seealsolist">
<li><a href="../symbols/Model.html#setDataProperty" class="linkMethod">Model.setDataProperty</a></li>
</ul></div>
<dl class="detailList">
<dt class="heading">Parameters:</dt>
<dt>
<span class="light fixedFont">{Object}</span> <b>data</b>
</dt>
<dd>a JavaScript object typically the value of a <a href="../symbols/Panel.html#data" class="linkProperty">Panel.data</a> and represented by a Node, Link, Group, simple Part,
or item in a <a href="../symbols/Panel.html#itemArray" class="linkProperty">Panel.itemArray</a>; or this model's <a href="../symbols/Model.html#modelData" class="linkProperty">modelData</a>.</dd>
<dt>
<span class="light fixedFont">{string}</span> <b>propname</b>
</dt>
<dd>a string that is not null or the empty string.</dd>
<dt>
<span class="light fixedFont">{*}</span> <b>val</b>
</dt>
<dd>the new value for the property.</dd>
</dl>
</div>
</td>
</tr>
<tr id="setParentKeyForNodeData">
<td class="name">
<div class="name">
setParentKeyForNodeData(nodedata, key)
</div>
<div class="attributes">
</div>
</td>
<td class="description">
<div class="description">
<!--newp--><p><p>Change the parent node for the given node data, given a key for the new parent, or undefined if there should be no parent.<span class="nodetails" id="xmethsetParentKeyForNodeData"><a class="morelink" onclick="hst('methsetParentKeyForNodeData')">More...</a></span> <span class="details" id="methsetParentKeyForNodeData"></span>
</p><div class="seealso">See also:
<ul class="seealsolist">
<li><a href="../symbols/TreeModel.html#nodeParentKeyProperty" class="linkProperty">nodeParentKeyProperty</a></li>
<li><a href="../symbols/TreeModel.html#getParentKeyForNodeData" class="linkMethod">getParentKeyForNodeData</a></li>
</ul></div>
<dl class="detailList">
<dt class="heading">Parameters:</dt>
<dt>
<span class="light fixedFont">{Object}</span> <b>nodedata</b>
</dt>
<dd>a JavaScript object represented by a node.</dd>
<dt>
<span class="light fixedFont">{string|number|undefined}</span> <b>key</b>
</dt>
<dd>This may be undefined if there should be no parent node data.</dd>
</dl>
</div>
</td>
</tr>
<tr id="setParentLinkCategoryForNodeData">
<td class="name">
<div class="name">
setParentLinkCategoryForNodeData(childdata, cat)
</div>
<div class="attributes">
</div>
</td>
<td class="description">
<div class="description">
<!--newp--><p><p>Change the category for the parent link of a given child node data, a string naming the link template
that the <a href="../symbols/Diagram.html" class="linkConstructor">Diagram</a> should use to represent the link.<span class="nodetails" id="xmethsetParentLinkCategoryForNodeData"><a class="morelink" onclick="hst('methsetParentLinkCategoryForNodeData')">More...</a></span> <span class="details" id="methsetParentLinkCategoryForNodeData">
</span><div class="details" id="dmethsetParentLinkCategoryForNodeData"><p>
Changing the link template will cause any existing <a href="../symbols/Link.html" class="linkConstructor">Link</a>
to be removed from the <a href="../symbols/Diagram.html" class="linkConstructor">Diagram</a> and replaced with a new <a href="../symbols/Link.html" class="linkConstructor">Link</a>
created by copying the new link template and applying any data-bindings.</div>
</p><div class="seealso">See also:
<ul class="seealsolist">
<li><a href="../symbols/TreeModel.html#parentLinkCategoryProperty" class="linkProperty">parentLinkCategoryProperty</a></li>
<li><a href="../symbols/TreeModel.html#getParentLinkCategoryForNodeData" class="linkMethod">getParentLinkCategoryForNodeData</a></li>
</ul></div>
<dl class="detailList">
<dt class="heading">Parameters:</dt>
<dt>
<span class="light fixedFont">{Object}</span> <b>childdata</b>
</dt>
<dd>a JavaScript object represented by a node data.</dd>
<dt>
<span class="light fixedFont">{string}</span> <b>cat</b>
</dt>
<dd>Must not be null.</dd>
</dl>
</div>
</td>
</tr>
</tbody>
</table>
</div><!-- class="table-responsive">-->
<dl class="inheritsList">
<dt>Methods borrowed from class <a href="../symbols/Model.html" class="linkConstructor">Model</a>: </dt><dd><a href="../symbols/Model.html#addArrayItem" class="linkMethod">addArrayItem</a>, <a href="../symbols/Model.html#addChangedListener" class="linkMethod">addChangedListener</a>, <a href="../symbols/Model.html#addNodeData" class="linkMethod">addNodeData</a>, <a href="../symbols/Model.html#addNodeDataCollection" class="linkMethod">addNodeDataCollection</a>, <a href="../symbols/Model.html#applyIncrementalJson" class="linkMethod">applyIncrementalJson</a>, <a href="../symbols/Model.html#clear" class="linkMethod">clear</a>, <a href="../symbols/Model.html#cloneProtected" class="linkMethod">cloneProtected</a>, <a href="../symbols/Model.html#commitTransaction" class="linkMethod">commitTransaction</a>, <a href="../symbols/Model.html#containsNodeData" class="linkM