UNPKG

create-gojs-kit

Version:

A CLI for downloading GoJS samples, extensions, and docs

gojs.net

NorthwoodsSoftware/GoJS

212 lines • 52.9 kB
<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><link rel="stylesheet" href="../../assets/css/style.css"/><link rel="preconnect" href="https://rsms.me/"/><link rel="stylesheet" href="https://rsms.me/inter/inter.css"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>TreeModel | 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/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><link rel="stylesheet" href="../assets/custom.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script><script type="text/javascript">// formerly in api.js
  var hash = null;
  function changeHash() {
      var panels = document.getElementsByClassName("tsd-panel");
      for (let i = 0; i < panels.length; i++) {
          var p = panels[i];
          p.classList.remove("targeted");
      }
      hash = window.location.hash.slice(1);
      if (hash) {
          var elt = document.getElementById(hash);
          if (elt) elt.parentNode.classList.add("targeted");
      }
  }
  document.addEventListener("DOMContentLoaded", changeHash);
  window.addEventListener("hashchange", changeHash);</script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header><nav id="navTop" class="w-full h-[var(--topnav-h)] z-30 bg-[var(--color-background-secondary)] border-b border-b-[var(--color-accent)]"><div class="max-w-screen-xl mx-auto flex flex-wrap items-start justify-between px-4"><a class="!text-white bg-nwoods-primary font-bold !leading-[calc(var(--topnav-h)_-_1px)] my-0 px-2 text-4xl lg:text-5xl logo" href="../../index.html">GoJS</a><div class="relative"><button id="topnavButton" class="h-[calc(var(--topnav-h)_-_1px)] px-2 m-0 text-[var(--color-text)] bg-inherit shadow-none md:hidden hover:!bg-inherit hover:!text-nwoods-accent hover:!shadow-none" aria-label="Navigation"><svg class="h-7 w-7 block" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><div id="topnavList" class="hidden md:block"><div class="absolute right-0 z-30 flex flex-col items-end rounded border border-[var(--color-accent)] p-4 pl-12 shadow bg-[var(--color-background-secondary)] text-[var(--color-text)] font-semibold
                        md:flex-row md:space-x-4 md:items-start md:border-0 md:p-0 md:shadow-none md:!bg-inherit"><a href="../../learn/index.html">Learn</a><a href="../../samples/index.html">Samples</a><a href="../../intro/index.html">Intro</a><a class="active" href="../../api/index.html">API</a><a href="../../download.html">Download</a><a href="https://forum.nwoods.com/c/gojs/11" target="_blank" rel="noopener">Forum</a><a href="https://nwoods.com/contact.html" target="_blank" rel="noopener" id="contactBtn">Contact</a><a href="https://nwoods.com/sales/index.html" target="_blank" rel="noopener" id="buyBtn">Buy</a></div></div></div></div></nav><script>window.addEventListener("DOMContentLoaded", function () {
    // topnav
    var topButton = document.getElementById("topnavButton");
    var topnavList = document.getElementById("topnavList");
    if (topButton && topnavList) {
      topButton.addEventListener("click", function (e) {
        topnavList
          .classList
          .toggle("hidden");
        e.stopPropagation();
      });
      document.addEventListener("click", function (e) {
        // if the clicked element isn't the list, close the list
        if (!topnavList.classList.contains("hidden") && !e.target.closest("#topnavList")) {
          topButton.click();
        }
      });

      // set active <a> element
      // done via active tag below, always API
    }
  });</script><div class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><div id="tsd-search-help"><code class="!text-lg">/</code> to search</div><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></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"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><div class="flex w-full max-w-screen-xl mx-auto px-2 items-center justify-between"><div><ul class="tsd-breadcrumb"><li><a href="../index.html">GoJS API</a></li><li><a href="TreeModel.html">TreeModel</a></li></ul><h1 class="flex items-center">Class TreeModel</h1></div><div class="text-xs"><b>GoJS</b>® Diagramming Components<br/>version 3.1.0<br/>by <a href="https://nwoods.com/">Northwoods Software®</a></div></div></div><section class="tsd-panel tsd-hierarchy"><h4>Hierarchy (<a class="link" href="../hierarchy.html#TreeModel">view full</a>)</h4><ul class="tsd-hierarchy"><li><a href="Model.html" class="tsd-signature-type tsd-kind-class">Model</a><ul class="tsd-hierarchy"><li><span class="target">TreeModel</span></li></ul></li></ul></section><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography"><p>TreeModels support tree-structured graphs of nodes and links.
Each node can have at most one &quot;tree parent&quot;; cycles are not permitted.
The reference to the parent node&#39;s key is a property of the child node data.</p>
<p>TreeModels, unlike <a href="GraphLinksModel.html" class="tsd-kind-class">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>
<p>The <a href="TreeModel.html#nodeParentKeyProperty" class="tsd-kind-accessor">nodeParentKeyProperty</a> property names the property on the node data whose value
is the key of the &quot;tree parent&quot; node.
The default value for this property is &quot;parent&quot;.</p>
<p>For example, one can define a graph consisting of one parent node with two child nodes:</p>
<pre><code class="language-js"><span class="hl-2"> </span><span class="hl-4">model</span><span class="hl-2">.</span><span class="hl-4">nodeDataArray</span><span class="hl-2"> = [</span><br/><span class="hl-2">   { </span><span class="hl-4">key:</span><span class="hl-2"> </span><span class="hl-6">&quot;Alpha&quot;</span><span class="hl-2"> },</span><br/><span class="hl-2">   { </span><span class="hl-4">key:</span><span class="hl-2"> </span><span class="hl-6">&quot;Beta&quot;</span><span class="hl-2">, </span><span class="hl-4">parent:</span><span class="hl-2"> </span><span class="hl-6">&quot;Alpha&quot;</span><span class="hl-2"> },</span><br/><span class="hl-2">   { </span><span class="hl-4">key:</span><span class="hl-2"> </span><span class="hl-6">&quot;Gamma&quot;</span><span class="hl-2">, </span><span class="hl-4">parent:</span><span class="hl-2"> </span><span class="hl-6">&quot;Alpha&quot;</span><span class="hl-2"> }</span><br/><span class="hl-2"> ];</span>
</code><button>Copy</button></pre>
<p>If you need to show a more complicated graph structure than a tree, use a <a href="GraphLinksModel.html" class="tsd-kind-class">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="GraphLinksModel.html" class="tsd-kind-class">GraphLinksModel</a>.</p>
</div></section><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><details class="tsd-index-content tsd-index-accordion" open><summary class="tsd-accordion-summary tsd-index-summary"><h5 class="tsd-index-heading uppercase" role="button" aria-expanded="true" tabIndex="0"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-chevronSmall"></use></svg> Index</h5></summary><div class="tsd-accordion-details"><section class="tsd-index-section"><h3 class="tsd-index-heading">Constructors</h3><div class="tsd-index-list"><a href="TreeModel.html#constructor" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-512"></use></svg><span>constructor</span></a>
</div></section><section class="tsd-index-section"><h3 class="tsd-index-heading">Accessors</h3><div class="tsd-index-list"><a href="TreeModel.html#nodeParentKeyProperty" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>node<wbr/>Parent<wbr/>Key<wbr/>Property</span></a>
<a href="TreeModel.html#parentLinkCategoryProperty" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>parent<wbr/>Link<wbr/>Category<wbr/>Property</span></a>
</div></section><section class="tsd-index-section"><h3 class="tsd-index-heading">Methods</h3><div class="tsd-index-list"><a href="TreeModel.html#copyNodeData" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>copy<wbr/>Node<wbr/>Data</span></a>
<a href="TreeModel.html#getParentKeyForNodeData" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>get<wbr/>Parent<wbr/>Key<wbr/>For<wbr/>Node<wbr/>Data</span></a>
<a href="TreeModel.html#getParentLinkCategoryForNodeData" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>get<wbr/>Parent<wbr/>Link<wbr/>Category<wbr/>For<wbr/>Node<wbr/>Data</span></a>
<a href="TreeModel.html#setDataProperty" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>set<wbr/>Data<wbr/>Property</span></a>
<a href="TreeModel.html#setParentKeyForNodeData" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>set<wbr/>Parent<wbr/>Key<wbr/>For<wbr/>Node<wbr/>Data</span></a>
<a href="TreeModel.html#setParentLinkCategoryForNodeData" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>set<wbr/>Parent<wbr/>Link<wbr/>Category<wbr/>For<wbr/>Node<wbr/>Data</span></a>
</div></section></div></details></section></section><section class="tsd-panel-group tsd-index-group tsd-is-inherited"><section class="tsd-panel tsd-index-panel"><details class="tsd-index-content tsd-index-accordion"><summary class="tsd-accordion-summary tsd-index-summary"><h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex="0"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-chevronSmall"></use></svg> Inherited Index</h5></summary><div class="tsd-accordion-details"><div class="tsd-index-content"><section class="tsd-index-section"><h3 class="tsd-index-heading">Accessors</h3><div class="tsd-index-list"><a href="Model.html#copiesArrayObjects" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.copies<wbr/>Array<wbr/>Objects</span></a>
<a href="Model.html#copiesArrays" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.copies<wbr/>Arrays</span></a>
<a href="Model.html#copiesKey" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.copies<wbr/>Key</span></a>
<a href="Model.html#copyNodeDataFunction" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.copy<wbr/>Node<wbr/>Data<wbr/>Function</span></a>
<a href="Model.html#dataFormat" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.data<wbr/>Format</span></a>
<a href="Model.html#isReadOnly" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.is<wbr/>Read<wbr/>Only</span></a>
<a href="Model.html#makeUniqueKeyFunction" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.make<wbr/>Unique<wbr/>Key<wbr/>Function</span></a>
<a href="Model.html#modelData" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.model<wbr/>Data</span></a>
<a href="Model.html#name" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.name</span></a>
<a href="Model.html#nodeCategoryProperty" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.node<wbr/>Category<wbr/>Property</span></a>
<a href="Model.html#nodeDataArray" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.node<wbr/>Data<wbr/>Array</span></a>
<a href="Model.html#nodeKeyProperty" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.node<wbr/>Key<wbr/>Property</span></a>
<a href="Model.html#pointsDigits" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.points<wbr/>Digits</span></a>
<a href="Model.html#skipsUndoManager" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.skips<wbr/>Undo<wbr/>Manager</span></a>
<a href="Model.html#undoManager" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>Model.undo<wbr/>Manager</span></a>
</div></section><section class="tsd-index-section"><h3 class="tsd-index-heading">Methods</h3><div class="tsd-index-list"><a href="Model.html#addArrayItem" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.add<wbr/>Array<wbr/>Item</span></a>
<a href="Model.html#addChangedListener" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.add<wbr/>Changed<wbr/>Listener</span></a>
<a href="Model.html#addNodeData" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.add<wbr/>Node<wbr/>Data</span></a>
<a href="Model.html#addNodeDataCollection" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.add<wbr/>Node<wbr/>Data<wbr/>Collection</span></a>
<a href="Model.html#applyIncrementalJson" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.apply<wbr/>Incremental<wbr/>Json</span></a>
<a href="Model.html#assignAllDataProperties" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.assign<wbr/>All<wbr/>Data<wbr/>Properties</span></a>
<a href="Model.html#clear" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.clear</span></a>
<a href="Model.html#cloneDeep" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.clone<wbr/>Deep</span></a>
<a href="Model.html#commit" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.commit</span></a>
<a href="Model.html#commitTransaction" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.commit<wbr/>Transaction</span></a>
<a href="Model.html#containsNodeData" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.contains<wbr/>Node<wbr/>Data</span></a>
<a href="Model.html#copy" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.copy</span></a>
<a href="Model.html#findNodeDataForKey" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.find<wbr/>Node<wbr/>Data<wbr/>For<wbr/>Key</span></a>
<a href="Model.html#getCategoryForNodeData" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.get<wbr/>Category<wbr/>For<wbr/>Node<wbr/>Data</span></a>
<a href="Model.html#getKeyForNodeData" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.get<wbr/>Key<wbr/>For<wbr/>Node<wbr/>Data</span></a>
<a href="Model.html#insertArrayItem" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.insert<wbr/>Array<wbr/>Item</span></a>
<a href="Model.html#makeNodeDataKeyUnique" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.make<wbr/>Node<wbr/>Data<wbr/>Key<wbr/>Unique</span></a>
<a href="Model.html#mergeNodeDataArray" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.merge<wbr/>Node<wbr/>Data<wbr/>Array</span></a>
<a href="Model.html#raiseChangedEvent" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.raise<wbr/>Changed<wbr/>Event</span></a>
<a href="Model.html#raiseDataChanged" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.raise<wbr/>Data<wbr/>Changed</span></a>
<a href="Model.html#removeArrayItem" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.remove<wbr/>Array<wbr/>Item</span></a>
<a href="Model.html#removeChangedListener" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.remove<wbr/>Changed<wbr/>Listener</span></a>
<a href="Model.html#removeNodeData" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.remove<wbr/>Node<wbr/>Data</span></a>
<a href="Model.html#removeNodeDataCollection" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.remove<wbr/>Node<wbr/>Data<wbr/>Collection</span></a>
<a href="Model.html#rollbackTransaction" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.rollback<wbr/>Transaction</span></a>
<a href="Model.html#set" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.set</span></a>
<a href="Model.html#setCategoryForNodeData" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.set<wbr/>Category<wbr/>For<wbr/>Node<wbr/>Data</span></a>
<a href="Model.html#setKeyForNodeData" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.set<wbr/>Key<wbr/>For<wbr/>Node<wbr/>Data</span></a>
<a href="Model.html#startTransaction" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.start<wbr/>Transaction</span></a>
<a href="Model.html#toIncrementalData" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.to<wbr/>Incremental<wbr/>Data</span></a>
<a href="Model.html#toIncrementalJson" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.to<wbr/>Incremental<wbr/>Json</span></a>
<a href="Model.html#toJson" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.to<wbr/>Json</span></a>
<a href="Model.html#updateTargetBindings" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>Model.update<wbr/>Target<wbr/>Bindings</span></a>
</div></section></div></div></details></section></section><section class="tsd-panel-group tsd-member-group"><h2>Constructors</h2><section class="tsd-panel tsd-member"><a id="constructor" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>constructor</span><a href="#constructor" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><ul class="tsd-signatures"><li class="tsd-signature tsd-anchor-link"><a id="constructor.new_TreeModel" class="tsd-anchor"></a><span class="tsd-kind-constructor-signature">new <wbr/>Tree<wbr/>Model</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">nodedataarray</span><span class="tsd-signature-symbol">?: </span><a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a><span class="tsd-signature-symbol">[]</span>, <span class="tsd-kind-parameter">init</span><span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="TreeModel.html" class="tsd-signature-type tsd-kind-class">TreeModel</a><span class="tsd-signature-symbol">&gt;</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="TreeModel.html" class="tsd-signature-type tsd-kind-class">TreeModel</a><a href="#constructor.new_TreeModel" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></li><li class="tsd-description"><div class="tsd-comment tsd-typography"><p>This constructs an empty TreeModel unless one provides arguments as the initial data array values</p>
</div><div class="tsd-parameters"><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameter-list"><li><h5><code class="tsd-tag ts-flagOptional">Optional</code> <span class="tsd-kind-parameter">nodedataarray</span>: <a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a><span class="tsd-signature-symbol">[]</span></h5><div class="tsd-comment tsd-typography"><p>an optional Array containing JavaScript objects to be represented by <a href="Part.html" class="tsd-kind-class">Part</a>s.</p>
</div></li><li><h5><code class="tsd-tag ts-flagOptional">Optional</code> <span class="tsd-kind-parameter">init</span>: <span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="TreeModel.html" class="tsd-signature-type tsd-kind-class">TreeModel</a><span class="tsd-signature-symbol">&gt;</span></h5><div class="tsd-comment tsd-typography"><p>Optional initialization properties.</p>
</div></li></ul></div><h4 class="tsd-returns-title">Returns <a href="TreeModel.html" class="tsd-signature-type tsd-kind-class">TreeModel</a></h4></li><li class="tsd-signature tsd-anchor-link"><a id="constructor.new_TreeModel-1" class="tsd-anchor"></a><span class="tsd-kind-constructor-signature">new <wbr/>Tree<wbr/>Model</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">init</span><span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="TreeModel.html" class="tsd-signature-type tsd-kind-class">TreeModel</a><span class="tsd-signature-symbol">&gt;</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="TreeModel.html" class="tsd-signature-type tsd-kind-class">TreeModel</a><a href="#constructor.new_TreeModel-1" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></li><li class="tsd-description"><div class="tsd-comment tsd-typography"><p>for the <a href="Model.html#nodeDataArray" class="tsd-kind-accessor">Model.nodeDataArray</a> property.</p>
</div><div class="tsd-parameters"><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameter-list"><li><h5><code class="tsd-tag ts-flagOptional">Optional</code> <span class="tsd-kind-parameter">init</span>: <span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="TreeModel.html" class="tsd-signature-type tsd-kind-class">TreeModel</a><span class="tsd-signature-symbol">&gt;</span></h5><div class="tsd-comment tsd-typography"><p>Optional initialization properties.</p>
</div></li></ul></div><h4 class="tsd-returns-title">Returns <a href="TreeModel.html" class="tsd-signature-type tsd-kind-class">TreeModel</a></h4></li></ul></section></section><section class="tsd-panel-group tsd-member-group"><h2>Accessors</h2><section class="tsd-panel tsd-member"><a id="nodeParentKeyProperty" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>node<wbr/>Parent<wbr/>Key<wbr/>Property</span><div class="membertype"><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">a</span><span class="tsd-signature-symbol">: </span><a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a>, <span class="tsd-kind-parameter">b</span><span class="tsd-signature-symbol">?: </span><a href="Key.html" class="tsd-signature-type tsd-kind-type-alias">Key</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> =&gt; </span><a href="Key.html" class="tsd-signature-type tsd-kind-type-alias">Key</a><span class="tsd-signature-symbol">)</span></div><a href="#nodeParentKeyProperty" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><ul class="tsd-signatures"><li class="tsd-description"><div class="tsd-comment tsd-typography"><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 &quot;parent&quot; for this &quot;child&quot; node data.
The value may also be a function taking two arguments, where the first argument will be a node data object.
If the second argument is not supplied, the function should return the string or number key for the parent node data object of which the given data object is a child;
if the second argument is supplied, the function should modify the node data object so that it has that new key
(which may be undefined to refer to no node) as the parent key for that node..
The default value is the name &#39;parent&#39;, meaning that it expects the data to have a property named &#39;parent&#39; if the node wants to refer to the parent node by its key.
The value must not be null nor an empty string.</p>
<p>If you want to set this property you must do so before using the model, and especially before you assign <a href="Diagram.html#model" class="tsd-kind-accessor">Diagram.model</a>.
Note that functions cannot be serialized into JSON-formatted text, so if you are using <a href="Model.html#toJson" class="tsd-kind-method">toJson</a> and <a href="Model.html#fromJson" class="tsd-kind-method">Model.fromJson</a>,
and if you want this property to be a function, you will need to assign this property to your desired function
immediately after creating the model, including when it is created by <a href="Model.html#fromJson" class="tsd-kind-method">Model.fromJson</a>.</p>
</div><div class="tsd-comment-tags tsd-typography"><div class="flex items-center"><code class="tsd-tag">see</code><ul>
<li><a href="TreeModel.html#getParentKeyForNodeData" class="tsd-kind-method">getParentKeyForNodeData</a></li>
<li><a href="TreeModel.html#setParentKeyForNodeData" class="tsd-kind-method">setParentKeyForNodeData</a></li>
</ul>
</div></div></li></ul></section><section class="tsd-panel tsd-member"><a id="parentLinkCategoryProperty" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>parent<wbr/>Link<wbr/>Category<wbr/>Property</span><div class="membertype"><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">a</span><span class="tsd-signature-symbol">: </span><a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a>, <span class="tsd-kind-parameter">b</span><span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> =&gt; </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">)</span></div><a href="#parentLinkCategoryProperty" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><ul class="tsd-signatures"><li class="tsd-description"><div class="tsd-comment tsd-typography"><p>Gets or sets the name of the data property that returns a string describing that node data&#39;s parent link&#39;s category.
The value may also be a function taking two arguments, where the first argument will be a node data object.
If the second argument is not supplied, the function should return the category name for any parent link;
if the second argument is supplied, the function should modify the node data object so that its parent link has that new category name.
The default value is the name &#39;parentLinkCategory&#39;.
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="TreeModel.html#getParentLinkCategoryForNodeData" class="tsd-kind-method">getParentLinkCategoryForNodeData</a> will return an empty string for all node data objects.</p>
<p>If you want to set this property you must do so before using the model, and especially before you assign <a href="Diagram.html#model" class="tsd-kind-accessor">Diagram.model</a>.
Note that functions cannot be serialized into JSON-formatted text, so if you are using <a href="Model.html#toJson" class="tsd-kind-method">toJson</a> and <a href="Model.html#fromJson" class="tsd-kind-method">Model.fromJson</a>,
and if you want this property to be a function, you will need to assign this property to your desired function
immediately after creating the model, including when it is created by <a href="Model.html#fromJson" class="tsd-kind-method">Model.fromJson</a>.</p>
</div><div class="tsd-comment-tags tsd-typography"><div class="flex items-center"><code class="tsd-tag">see</code><ul>
<li><a href="TreeModel.html#getParentLinkCategoryForNodeData" class="tsd-kind-method">getParentLinkCategoryForNodeData</a></li>
<li><a href="TreeModel.html#setParentLinkCategoryForNodeData" class="tsd-kind-method">setParentLinkCategoryForNodeData</a></li>
</ul>
</div></div></li></ul></section></section><section class="tsd-panel-group tsd-member-group"><h2>Methods</h2><section class="tsd-panel tsd-member"><a id="copyNodeData" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagVirtual">Virtual</code><code class="tsd-tag ts-flagOverride">Override</code><span>copy<wbr/>Node<wbr/>Data</span><a href="#copyNodeData" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><ul class="tsd-signatures"><li class="tsd-signature tsd-anchor-link"><a id="copyNodeData.copyNodeData-1" class="tsd-anchor"></a><span class="tsd-kind-call-signature">copy<wbr/>Node<wbr/>Data</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">nodedata</span><span class="tsd-signature-symbol">: </span><a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a><a href="#copyNodeData.copyNodeData-1" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></li><li class="tsd-description"><div class="tsd-comment tsd-typography"><p>This override also makes sure any copied node data does not have a reference to a parent node.</p>
</div><div class="tsd-parameters"><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameter-list"><li><h5><span class="tsd-kind-parameter">nodedata</span>: <a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a></h5><div class="tsd-comment tsd-typography"><p>a JavaScript object represented by a node, group, or non-link.</p>
</div></li></ul></div><h4 class="tsd-returns-title">Returns <a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a></h4></li></ul></section><section class="tsd-panel tsd-member"><a id="getParentKeyForNodeData" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>get<wbr/>Parent<wbr/>Key<wbr/>For<wbr/>Node<wbr/>Data</span><a href="#getParentKeyForNodeData" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><ul class="tsd-signatures"><li class="tsd-signature tsd-anchor-link"><a id="getParentKeyForNodeData.getParentKeyForNodeData-1" class="tsd-anchor"></a><span class="tsd-kind-call-signature">get<wbr/>Parent<wbr/>Key<wbr/>For<wbr/>Node<wbr/>Data</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">nodedata</span><span class="tsd-signature-symbol">: </span><a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="Key.html" class="tsd-signature-type tsd-kind-type-alias">Key</a><a href="#getParentKeyForNodeData.getParentKeyForNodeData-1" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></li><li class="tsd-description"><div class="tsd-comment tsd-typography"><p>If there is a parent node for the given node data, return the parent&#39;s key.</p>
</div><div class="tsd-parameters"><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameter-list"><li><h5><span class="tsd-kind-parameter">nodedata</span>: <a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a></h5><div class="tsd-comment tsd-typography"><p>a JavaScript object represented by a node.</p>
</div></li></ul></div><h4 class="tsd-returns-title">Returns <a href="Key.html" class="tsd-signature-type tsd-kind-type-alias">Key</a></h4><p>This returns undefined if there is no parent node data object.</p>
<div class="tsd-comment-tags tsd-typography"><div class="flex items-center"><code class="tsd-tag">see</code><ul>
<li><a href="TreeModel.html#nodeParentKeyProperty" class="tsd-kind-accessor">nodeParentKeyProperty</a></li>
<li><a href="TreeModel.html#setParentKeyForNodeData" class="tsd-kind-method">setParentKeyForNodeData</a></li>
</ul>
</div></div></li></ul></section><section class="tsd-panel tsd-member"><a id="getParentLinkCategoryForNodeData" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>get<wbr/>Parent<wbr/>Link<wbr/>Category<wbr/>For<wbr/>Node<wbr/>Data</span><a href="#getParentLinkCategoryForNodeData" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><ul class="tsd-signatures"><li class="tsd-signature tsd-anchor-link"><a id="getParentLinkCategoryForNodeData.getParentLinkCategoryForNodeData-1" class="tsd-anchor"></a><span class="tsd-kind-call-signature">get<wbr/>Parent<wbr/>Link<wbr/>Category<wbr/>For<wbr/>Node<wbr/>Data</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">childdata</span><span class="tsd-signature-symbol">: </span><a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><a href="#getParentLinkCategoryForNodeData.getParentLinkCategoryForNodeData-1" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></li><li class="tsd-description"><div class="tsd-comment tsd-typography"><p>Find the category for the parent link of a given child node data, a string naming the link template
that the <a href="Diagram.html" class="tsd-kind-class">Diagram</a> should use to represent the link.</p>
</div><div class="tsd-parameters"><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameter-list"><li><h5><span class="tsd-kind-parameter">childdata</span>: <a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a></h5><div class="tsd-comment tsd-typography"><p>a JavaScript object represented by a node data.</p>
</div></li></ul></div><h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">string</span></h4><div class="tsd-comment-tags tsd-typography"><div class="flex items-center"><code class="tsd-tag">see</code><ul>
<li><a href="TreeModel.html#parentLinkCategoryProperty" class="tsd-kind-accessor">parentLinkCategoryProperty</a></li>
<li><a href="TreeModel.html#setParentLinkCategoryForNodeData" class="tsd-kind-method">setParentLinkCategoryForNodeData</a></li>
</ul>
</div></div></li></ul></section><section class="tsd-panel tsd-member"><a id="setDataProperty" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagVirtual">Virtual</code><code class="tsd-tag ts-flagOverride">Override</code><span>set<wbr/>Data<wbr/>Property</span><a href="#setDataProperty" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><ul class="tsd-signatures"><li class="tsd-signature tsd-anchor-link"><a id="setDataProperty.setDataProperty-1" class="tsd-anchor"></a><span class="tsd-kind-call-signature">set<wbr/>Data<wbr/>Property</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">data</span><span class="tsd-signature-symbol">: </span><a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a>, <span class="tsd-kind-parameter">propname</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span>, <span class="tsd-kind-parameter">val</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#setDataProperty.setDataProperty-1" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></li><li class="tsd-description"><div class="tsd-comment tsd-typography"><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.</p>
<p>This gets the old value of the property; if the value is the same as the new value, no side-effects occur.</p>
</div><div class="tsd-parameters"><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameter-list"><li><h5><span class="tsd-kind-parameter">data</span>: <a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a></h5><div class="tsd-comment tsd-typography"><p>a JavaScript object typically the value of a <a href="Panel.html#data" class="tsd-kind-accessor">Panel.data</a> and represented by a Node, Link, Group, simple Part,
                     or item in a <a href="Panel.html#itemArray" class="tsd-kind-accessor">Panel.itemArray</a>; or this model&#39;s modelData.</p>
</div></li><li><h5><span class="tsd-kind-parameter">propname</span>: <span class="tsd-signature-type">string</span></h5><div class="tsd-comment tsd-typography"><p>a string that is not null or the empty string.</p>
</div></li><li><h5><span class="tsd-kind-parameter">val</span>: <span class="tsd-signature-type">any</span></h5><div class="tsd-comment tsd-typography"><p>the new value for the property.</p>
</div></li></ul></div><h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><div class="tsd-comment-tags tsd-typography"><div class="flex items-center"><code class="tsd-tag">see</code><p><a href="Model.html#setDataProperty" class="tsd-kind-method">Model.setDataProperty</a></p>
</div></div></li></ul></section><section class="tsd-panel tsd-member"><a id="setParentKeyForNodeData" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>set<wbr/>Parent<wbr/>Key<wbr/>For<wbr/>Node<wbr/>Data</span><a href="#setParentKeyForNodeData" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><ul class="tsd-signatures"><li class="tsd-signature tsd-anchor-link"><a id="setParentKeyForNodeData.setParentKeyForNodeData-1" class="tsd-anchor"></a><span class="tsd-kind-call-signature">set<wbr/>Parent<wbr/>Key<wbr/>For<wbr/>Node<wbr/>Data</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">nodedata</span><span class="tsd-signature-symbol">: </span><a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a>, <span class="tsd-kind-parameter">key</span><span class="tsd-signature-symbol">: </span><a href="Key.html" class="tsd-signature-type tsd-kind-type-alias">Key</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#setParentKeyForNodeData.setParentKeyForNodeData-1" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></li><li class="tsd-description"><div class="tsd-comment tsd-typography"><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.</p>
</div><div class="tsd-parameters"><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameter-list"><li><h5><span class="tsd-kind-parameter">nodedata</span>: <a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a></h5><div class="tsd-comment tsd-typography"><p>a JavaScript object represented by a node.</p>
</div></li><li><h5><span class="tsd-kind-parameter">key</span>: <a href="Key.html" class="tsd-signature-type tsd-kind-type-alias">Key</a></h5><div class="tsd-comment tsd-typography"><p>This may be undefined if there should be no parent node data.</p>
</div></li></ul></div><h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><div class="tsd-comment-tags tsd-typography"><div class="flex items-center"><code class="tsd-tag">see</code><ul>
<li><a href="TreeModel.html#nodeParentKeyProperty" class="tsd-kind-accessor">nodeParentKeyProperty</a></li>
<li><a href="TreeModel.html#getParentKeyForNodeData" class="tsd-kind-method">getParentKeyForNodeData</a></li>
</ul>
</div></div></li></ul></section><section class="tsd-panel tsd-member"><a id="setParentLinkCategoryForNodeData" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>set<wbr/>Parent<wbr/>Link<wbr/>Category<wbr/>For<wbr/>Node<wbr/>Data</span><a href="#setParentLinkCategoryForNodeData" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><ul class="tsd-signatures"><li class="tsd-signature tsd-anchor-link"><a id="setParentLinkCategoryForNodeData.setParentLinkCategoryForNodeData-1" class="tsd-anchor"></a><span class="tsd-kind-call-signature">set<wbr/>Parent<wbr/>Link<wbr/>Category<wbr/>For<wbr/>Node<wbr/>Data</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">childdata</span><span class="tsd-signature-symbol">: </span><a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a>, <span class="tsd-kind-parameter">cat</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#setParentLinkCategoryForNodeData.setParentLinkCategoryForNodeData-1" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></li><li class="tsd-description"><div class="tsd-comment tsd-typography"><p>Change the category for the parent link of a given child node data, a string naming the link template
that the <a href="Diagram.html" class="tsd-kind-class">Diagram</a> should use to represent the link.</p>
<p>Changing the link template will cause any existing <a href="Link.html" class="tsd-kind-class">Link</a>
to be removed from the <a href="Diagram.html" class="tsd-kind-class">Diagram</a> and replaced with a new <a href="Link.html" class="tsd-kind-class">Link</a>
created by copying the new link template and applying any data-bindings.
Note that the new template must be an instance of the same class as the original link.
Thus one cannot change the category of a link from an instance of <a href="Link.html" class="tsd-kind-class">Link</a>
to an instance of a subclass of Link, nor vice-versa.</p>
</div><div class="tsd-parameters"><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameter-list"><li><h5><span class="tsd-kind-parameter">childdata</span>: <a href="ObjectData.html" class="tsd-signature-type tsd-kind-interface">ObjectData</a></h5><div class="tsd-comment tsd-typography"><p>a JavaScript object represented by a node data.</p>
</div></li><li><h5><span class="tsd-kind-parameter">cat</span>: <span class="tsd-signature-type">string</span></h5><div class="tsd-comment tsd-typography"><p>Must not be null.</p>
</div></li></ul></div><h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><div class="tsd-comment-tags tsd-typography"><div class="flex items-center"><code class="tsd-tag">see</code><ul>
<li><a href="TreeModel.html#parentLinkCategoryProperty" class="tsd-kind-accessor">parentLinkCategoryProperty</a></li>
<li><a href="TreeModel.html#getParentLinkCategoryForNodeData" class="tsd-kind-method">getParentLinkCategoryForNodeData</a></li>
</ul>
</div></div></li></ul></section></section></div><div class="col-sidebar"><div class="page-menu"><details open class="tsd-index-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>On This Page</h3></summary><div class="tsd-accordion-details"><ul><li><a href="#constructor"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-512"></use></svg><span>constructor</span></a></li><li><a href="#nodeParentKeyProperty"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>node<wbr/>Parent<wbr/>Key<wbr/>Property</span></a></li><li><a href="#parentLinkCategoryProperty"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-262144"></use></svg><span>parent<wbr/>Link<wbr/>Category<wbr/>Property</span></a></li><li><a href="#copyNodeData"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>copy<wbr/>Node<wbr/>Data</span></a></li><li><a href="#getParentKeyForNodeData"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>get<wbr/>Parent<wbr/>Key<wbr/>For<wbr/>Node<wbr/>Data</span></a></li><li><a href="#getParentLinkCategoryForNodeData"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>get<wbr/>Parent<wbr/>Link<wbr/>Category<wbr/>For<wbr/>Node<wbr/>Data</span></a></li><li><a href="#setDataProperty"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>set<wbr/>Data<wbr/>Property</span></a></li><li><a href="#setParentKeyForNodeData"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>set<wbr/>Parent<wbr/>Key<wbr/>For<wbr/>Node<wbr/>Data</span></a></li><li><a href="#setParentLinkCategoryForNodeData"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2048"></use></svg><span>set<wbr/>Parent<wbr/>Link<wbr/>Category<wbr/>For<wbr/>Node<wbr/>Data</span></a></li></ul></div></details><div class="tsd-navigation settings"><div class="tsd-theme-toggle"><h4 class="uppercase">Theme</h4><select id="tsd-theme"><option value="os">System</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../index.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>GoJS API</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><div class="tsd w-full max-w-screen-xl mx-auto px-2"><div class="bottom-copyright">Copyright © 1998-2025 by Northwoods Software Corporation.</div></div><div class="overlay"></div><script async src="https://www.googletagmanager.com/gtag/js?id=G-S5QK8VSK84"></script><script>window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-S5QK8VSK84');
var getOutboundLink = function(url, label) {
  gtag('event', 'click', {
  'event_category': 'outbound',
  'event_label': label,
  'transport_type': 'beacon'
  });
}

document.getElementById("contactBtn").addEventListener("click", function() {
  getOutboundLink('https://nwoods.com/contact.html', 'contact');
});
document.getElementById("buyBtn").addEventListener("click", function() {
  getOutboundLink('https://nwoods.com/sales/index.html', 'buy');
});</script></body></html>