gojs
Version:
Interactive diagrams, charts, and graphs, such as trees, flowcharts, orgcharts, UML, BPMN, or business diagrams
104 lines • 111 kB
HTML
<!DOCTYPE html><html class="default"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>TextBlock | GoJS API</title><meta name="description" content="Documentation for GoJS API"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../../assets/css/style.css"/><link rel="stylesheet" href="../assets/style-tsd.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.body.classList.add(localStorage.getItem("tsd-theme") || "os")</script><header><nav id="navTop" class="w-full z-30 top-0 text-white bg-nwoods-primary"><div class="w-full container max-w-screen-lg mx-auto flex flex-wrap sm:flex-nowrap items-center justify-between mt-0 py-2"><div class="md:pl-4"><a class="text-white hover:text-white no-underline hover:no-underline\n font-bold text-2xl lg:text-4xl rounded-lg hover:bg-nwoods-secondary" href="../../index.html"><h1 class="my-0 p-1 leading-none">GoJS</h1></a></div><button id="topnavButton" class="rounded-lg sm:hidden focus:outline-none focus:ring" aria-label="Navigation"><svg fill="currentColor" viewBox="0 0 20 20" class="w-6 h-6"><path id="topnavOpen" fill-rule="evenodd" d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM9 15a1 1 0 011-1h6a1 1 0 110 2h-6a1 1 0 01-1-1z" clip-rule="evenodd"></path><path id="topnavClosed" class="hidden" fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></button><div id="topnavList" class="hidden sm:block items-center w-auto mt-0 text-white p-0 z-20"><ul class="list-reset list-none font-semibold flex justify-end flex-wrap sm:flex-nowrap items-center px-0 pb-0"><li class="p-1 sm:p-0"><a class="topnav-link" href="../../learn/index.html">Learn</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="../../samples/index.html">Samples</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="../../intro/index.html">Intro</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="../../api/index.html">API</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="https://www.nwoods.com/products/register.html">Register</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="../../download.html">Download</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="https://forum.nwoods.com/c/gojs/11">Forum</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="https://www.nwoods.com/contact.html" target="_blank" rel="noopener" id="contactBtn">Contact</a></li><li class="p-1 sm:p-0"><a class="topnav-link" href="https://www.nwoods.com/sales/index.html" target="_blank" rel="noopener" id="buyBtn">Buy</a></li></ul></div></div><hr class="border-b border-gray-600 opacity-50 my-0 py-0"/></nav><div class="tsd-page-header"><div class="tsd-page-toolbar"><div class="w-full max-w-screen-xl mx-auto px-2"><div class="table-wrap"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget search no-caption">Search</label><input type="text" id="tsd-search-field"/></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">GoJS API</a></div><div class="table-cell" id="tsd-widgets"><div id="tsd-filter"><a href="#" class="tsd-widget options no-caption" data-toggle="options">Options</a><div class="tsd-filter-group"><div class="tsd-select" id="tsd-filter-visibility"><span class="tsd-select-label">All</span><ul class="tsd-select-list"><li data-value="public">Public</li><li data-value="protected">Public/Protected</li><li data-value="private" class="selected">All</li></ul></div> <input type="checkbox" id="tsd-filter-inherited"/><label class="tsd-widget" for="tsd-filter-inherited">Inherited</label></div></div><a href="#" class="tsd-widget menu no-caption" data-toggle="menu">Menu</a></div></div></div></div></div><div class="tsd-page-title"><div class="w-full max-w-screen-xl mx-auto px-2"><div class="top-copyright"><b>GoJS</b>® Diagramming Components<br/>version 2.3.8<br/>by <a href="https://www.nwoods.com/">Northwoods Software®</a></div><div><h1>Class TextBlock </h1></div></div></div></header><div class="tsd w-full max-w-screen-xl mx-auto pb-4"><div class="row px-2 w-full"><div class="col-8 col-content"><section class="tsd-panel tsd-hierarchy"><h3>Hierarchy</h3><ul class="tsd-hierarchy"><li><a href="GraphObject.html" class="tsd-signature-type" data-tsd-kind="Class">GraphObject</a><ul class="tsd-hierarchy"><li><span class="target">TextBlock</span></li></ul></li></ul></section><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography">
<p>A TextBlock is a <a href="GraphObject.html">GraphObject</a> that displays a <a href="TextBlock.html#text">text</a> string in a given <a href="TextBlock.html#font">font</a>.</p>
<div><p>The size and appearance of the text is specified by <a href="TextBlock.html#font">font</a>,
which takes a well-formed CSS string as its value.
The order of the CSS properties given is important for cross-browser compatibility,
and should be given in this order:</p>
<p><em>"font-style font-variant font-weight font-size font-family"</em></p>
<p>For example, "Italic small-caps bold 32px Georgia, Serif" is a valid font string
using every CSS font property. Note that not all browsers may support every property.</p>
<p>Text is drawn using the <a href="TextBlock.html#stroke">stroke</a> brush, which may be any CSS color string or a <a href="Brush.html">Brush</a>.</p>
<p>Some created TextBlocks:</p>
<pre><code class="language-js"><span class="hl-0">// A TextBlock with text and stroke properties set:</span><br/><span class="hl-1">new</span><span class="hl-2"> </span><span class="hl-4">go</span><span class="hl-2">.</span><span class="hl-5">TextBlock</span><span class="hl-2">({ </span><span class="hl-4">text:</span><span class="hl-2"> </span><span class="hl-6">"Hello World"</span><span class="hl-2">, </span><span class="hl-4">stroke:</span><span class="hl-2"> </span><span class="hl-6">"gray"</span><span class="hl-2"> })</span><br/><span class="hl-0">// Alternatively:</span><br/><span class="hl-1">new</span><span class="hl-2"> </span><span class="hl-4">go</span><span class="hl-2">.</span><span class="hl-5">TextBlock</span><span class="hl-2">(</span><span class="hl-6">"Hello World"</span><span class="hl-2">, { </span><span class="hl-4">stroke:</span><span class="hl-2"> </span><span class="hl-6">"gray"</span><span class="hl-2"> })</span>
</code></pre>
<p>TextBlocks typically receive a natural size based on their text and font strings,
but often a width is given in order to cause the text to wrap at a certain place.
In order for wrapping to occur, the <a href="TextBlock.html#wrap">wrap</a> property must not be <a href="TextBlock.html#static-None">TextBlock.None</a>.</p>
<p>TextBlocks can be edited by users using the <a href="TextEditingTool.html">TextEditingTool</a>.
The <a href="HTMLInfo.html">HTMLInfo</a> that a given TextBlock uses as its text editor can be customized
by setting the <a href="TextBlock.html#textEditor">textEditor</a> property. For an example of custom text editing tool use,
see the <a href="../../samples/customTextEditingTool.html">Custom TextEditingTool Sample</a>.</p>
<p class="boxread">
For examples of TextBlock possibilities and functionality,
see the <a href="../../intro/textBlocks.html">Introduction page on TextBlocks</a>.</div></div></section><section class="tsd-panel-group tsd-index-group"><h2>Index</h2><section class="tsd-panel tsd-index-panel"><div class="tsd-index-content"><section class="tsd-index-section "><h3>Constructors</h3><ul class="tsd-index-list"><li class="tsd-kind-constructor tsd-parent-kind-class tsd-is-overwrite"><a href="TextBlock.html#constructor" class="tsd-kind-icon">constructor</a></li></ul></section><section class="tsd-index-section "><h3>Properties</h3><ul class="tsd-index-list"><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#choices" class="tsd-kind-icon">choices</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#editable" class="tsd-kind-icon">editable</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#errorFunction" class="tsd-kind-icon">error<wbr/>Function</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#flip" class="tsd-kind-icon">flip</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#font" class="tsd-kind-icon">font</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#formatting" class="tsd-kind-icon">formatting</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#graduatedEnd" class="tsd-kind-icon">graduated<wbr/>End</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#graduatedFunction" class="tsd-kind-icon">graduated<wbr/>Function</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#graduatedSkip" class="tsd-kind-icon">graduated<wbr/>Skip</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#graduatedStart" class="tsd-kind-icon">graduated<wbr/>Start</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#interval" class="tsd-kind-icon">interval</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#isMultiline" class="tsd-kind-icon">is<wbr/>Multiline</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#isStrikethrough" class="tsd-kind-icon">is<wbr/>Strikethrough</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#isUnderline" class="tsd-kind-icon">is<wbr/>Underline</a></li><li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="TextBlock.html#lineCount" class="tsd-kind-icon">line<wbr/>Count</a></li><li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="TextBlock.html#lineHeight" class="tsd-kind-icon">line<wbr/>Height</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#maxLines" class="tsd-kind-icon">max<wbr/>Lines</a></li><li class="tsd-kind-get-signature tsd-parent-kind-class tsd-is-overwrite"><a href="TextBlock.html#naturalBounds" class="tsd-kind-icon">natural<wbr/>Bounds</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#overflow" class="tsd-kind-icon">overflow</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#spacingAbove" class="tsd-kind-icon">spacing<wbr/>Above</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#spacingBelow" class="tsd-kind-icon">spacing<wbr/>Below</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#stroke" class="tsd-kind-icon">stroke</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#text" class="tsd-kind-icon">text</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#textAlign" class="tsd-kind-icon">text<wbr/>Align</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#textEdited" class="tsd-kind-icon">text<wbr/>Edited</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#textEditor" class="tsd-kind-icon">text<wbr/>Editor</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#textValidation" class="tsd-kind-icon">text<wbr/>Validation</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#verticalAlignment" class="tsd-kind-icon">vertical<wbr/>Alignment</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="TextBlock.html#wrap" class="tsd-kind-icon">wrap</a></li></ul></section><section class="tsd-index-section "><h3>Methods</h3><ul class="tsd-index-list"><li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="TextBlock.html#static-getBaseline" class="tsd-kind-icon">get<wbr/>Baseline</a></li><li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="TextBlock.html#static-getUnderline" class="tsd-kind-icon">get<wbr/>Underline</a></li><li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="TextBlock.html#static-setBaseline" class="tsd-kind-icon">set<wbr/>Baseline</a></li><li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="TextBlock.html#static-setUnderline" class="tsd-kind-icon">set<wbr/>Underline</a></li></ul></section><section class="tsd-index-section "><h3>Constants</h3><ul class="tsd-index-list"><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="TextBlock.html#static-FormatNone" class="tsd-kind-icon">Format<wbr/>None</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="TextBlock.html#static-FormatTrim" class="tsd-kind-icon">Format<wbr/>Trim</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-overwrite tsd-is-static"><a href="TextBlock.html#static-None" class="tsd-kind-icon">None</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="TextBlock.html#static-OverflowClip" class="tsd-kind-icon">Overflow<wbr/>Clip</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="TextBlock.html#static-OverflowEllipsis" class="tsd-kind-icon">Overflow<wbr/>Ellipsis</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="TextBlock.html#static-WrapBreakAll" class="tsd-kind-icon">Wrap<wbr/>Break<wbr/>All</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="TextBlock.html#static-WrapDesiredSize" class="tsd-kind-icon">Wrap<wbr/>Desired<wbr/>Size</a></li><li class="tsd-kind-constant tsd-parent-kind-class tsd-is-static"><a href="TextBlock.html#static-WrapFit" class="tsd-kind-icon">Wrap<wbr/>Fit</a></li></ul></section></div></section></section><section class="tsd-panel-group tsd-index-group tsd-is-inherited"><h2>Inherited Members</h2><section class="tsd-panel tsd-index-panel"><div class="tsd-index-content"><section class="tsd-index-section undefined"><h3>Properties</h3><ul class="tsd-index-list"><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#actionCancel" class="tsd-kind-icon">Graph<wbr/>Object.action<wbr/>Cancel</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#actionDown" class="tsd-kind-icon">Graph<wbr/>Object.action<wbr/>Down</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#actionMove" class="tsd-kind-icon">Graph<wbr/>Object.action<wbr/>Move</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#actionUp" class="tsd-kind-icon">Graph<wbr/>Object.action<wbr/>Up</a></li><li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="GraphObject.html#actualBounds" class="tsd-kind-icon">Graph<wbr/>Object.actual<wbr/>Bounds</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#alignment" class="tsd-kind-icon">Graph<wbr/>Object.alignment</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#alignmentFocus" class="tsd-kind-icon">Graph<wbr/>Object.alignment<wbr/>Focus</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#angle" class="tsd-kind-icon">Graph<wbr/>Object.angle</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#background" class="tsd-kind-icon">Graph<wbr/>Object.background</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#click" class="tsd-kind-icon">Graph<wbr/>Object.click</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#column" class="tsd-kind-icon">Graph<wbr/>Object.column</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#columnSpan" class="tsd-kind-icon">Graph<wbr/>Object.column<wbr/>Span</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#contextClick" class="tsd-kind-icon">Graph<wbr/>Object.context<wbr/>Click</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#contextMenu" class="tsd-kind-icon">Graph<wbr/>Object.context<wbr/>Menu</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#cursor" class="tsd-kind-icon">Graph<wbr/>Object.cursor</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#desiredSize" class="tsd-kind-icon">Graph<wbr/>Object.desired<wbr/>Size</a></li><li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="GraphObject.html#diagram" class="tsd-kind-icon">Graph<wbr/>Object.diagram</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#doubleClick" class="tsd-kind-icon">Graph<wbr/>Object.double<wbr/>Click</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#enabledChanged" class="tsd-kind-icon">Graph<wbr/>Object.enabled<wbr/>Changed</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#fromEndSegmentLength" class="tsd-kind-icon">Graph<wbr/>Object.from<wbr/>End<wbr/>Segment<wbr/>Length</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#fromLinkable" class="tsd-kind-icon">Graph<wbr/>Object.from<wbr/>Linkable</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#fromLinkableDuplicates" class="tsd-kind-icon">Graph<wbr/>Object.from<wbr/>Linkable<wbr/>Duplicates</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#fromLinkableSelfNode" class="tsd-kind-icon">Graph<wbr/>Object.from<wbr/>Linkable<wbr/>Self<wbr/>Node</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#fromMaxLinks" class="tsd-kind-icon">Graph<wbr/>Object.from<wbr/>Max<wbr/>Links</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#fromShortLength" class="tsd-kind-icon">Graph<wbr/>Object.from<wbr/>Short<wbr/>Length</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#fromSpot" class="tsd-kind-icon">Graph<wbr/>Object.from<wbr/>Spot</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#height" class="tsd-kind-icon">Graph<wbr/>Object.height</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#isActionable" class="tsd-kind-icon">Graph<wbr/>Object.is<wbr/>Actionable</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#isPanelMain" class="tsd-kind-icon">Graph<wbr/>Object.is<wbr/>Panel<wbr/>Main</a></li><li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="GraphObject.html#layer" class="tsd-kind-icon">Graph<wbr/>Object.layer</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#margin" class="tsd-kind-icon">Graph<wbr/>Object.margin</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#maxSize" class="tsd-kind-icon">Graph<wbr/>Object.max<wbr/>Size</a></li><li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="GraphObject.html#measuredBounds" class="tsd-kind-icon">Graph<wbr/>Object.measured<wbr/>Bounds</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#minSize" class="tsd-kind-icon">Graph<wbr/>Object.min<wbr/>Size</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseDragEnter" class="tsd-kind-icon">Graph<wbr/>Object.mouse<wbr/>Drag<wbr/>Enter</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseDragLeave" class="tsd-kind-icon">Graph<wbr/>Object.mouse<wbr/>Drag<wbr/>Leave</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseDrop" class="tsd-kind-icon">Graph<wbr/>Object.mouse<wbr/>Drop</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseEnter" class="tsd-kind-icon">Graph<wbr/>Object.mouse<wbr/>Enter</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseHold" class="tsd-kind-icon">Graph<wbr/>Object.mouse<wbr/>Hold</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseHover" class="tsd-kind-icon">Graph<wbr/>Object.mouse<wbr/>Hover</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseLeave" class="tsd-kind-icon">Graph<wbr/>Object.mouse<wbr/>Leave</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#mouseOver" class="tsd-kind-icon">Graph<wbr/>Object.mouse<wbr/>Over</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#name" class="tsd-kind-icon">Graph<wbr/>Object.name</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#opacity" class="tsd-kind-icon">Graph<wbr/>Object.opacity</a></li><li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="GraphObject.html#panel" class="tsd-kind-icon">Graph<wbr/>Object.panel</a></li><li class="tsd-kind-get-signature tsd-parent-kind-class"><a href="GraphObject.html#part" class="tsd-kind-icon">Graph<wbr/>Object.part</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#pickable" class="tsd-kind-icon">Graph<wbr/>Object.pickable</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#portId" class="tsd-kind-icon">Graph<wbr/>Object.port<wbr/>Id</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#position" class="tsd-kind-icon">Graph<wbr/>Object.position</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#row" class="tsd-kind-icon">Graph<wbr/>Object.row</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#rowSpan" class="tsd-kind-icon">Graph<wbr/>Object.row<wbr/>Span</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#scale" class="tsd-kind-icon">Graph<wbr/>Object.scale</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#segmentFraction" class="tsd-kind-icon">Graph<wbr/>Object.segment<wbr/>Fraction</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#segmentIndex" class="tsd-kind-icon">Graph<wbr/>Object.segment<wbr/>Index</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#segmentOffset" class="tsd-kind-icon">Graph<wbr/>Object.segment<wbr/>Offset</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#segmentOrientation" class="tsd-kind-icon">Graph<wbr/>Object.segment<wbr/>Orientation</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#shadowVisible" class="tsd-kind-icon">Graph<wbr/>Object.shadow<wbr/>Visible</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#stretch" class="tsd-kind-icon">Graph<wbr/>Object.stretch</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toEndSegmentLength" class="tsd-kind-icon">Graph<wbr/>Object.to<wbr/>End<wbr/>Segment<wbr/>Length</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toLinkable" class="tsd-kind-icon">Graph<wbr/>Object.to<wbr/>Linkable</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toLinkableDuplicates" class="tsd-kind-icon">Graph<wbr/>Object.to<wbr/>Linkable<wbr/>Duplicates</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toLinkableSelfNode" class="tsd-kind-icon">Graph<wbr/>Object.to<wbr/>Linkable<wbr/>Self<wbr/>Node</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toMaxLinks" class="tsd-kind-icon">Graph<wbr/>Object.to<wbr/>Max<wbr/>Links</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toShortLength" class="tsd-kind-icon">Graph<wbr/>Object.to<wbr/>Short<wbr/>Length</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toSpot" class="tsd-kind-icon">Graph<wbr/>Object.to<wbr/>Spot</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#toolTip" class="tsd-kind-icon">Graph<wbr/>Object.tool<wbr/>Tip</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#visible" class="tsd-kind-icon">Graph<wbr/>Object.visible</a></li><li class="tsd-kind-accessor tsd-parent-kind-class"><a href="GraphObject.html#width" class="tsd-kind-icon">Graph<wbr/>Object.width</a></li></ul></section><section class="tsd-index-section undefined"><h3>Methods</h3><ul class="tsd-index-list"><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#apply" class="tsd-kind-icon">Graph<wbr/>Object.apply</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#attach" class="tsd-kind-icon">Graph<wbr/>Object.attach</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#bind" class="tsd-kind-icon">Graph<wbr/>Object.bind</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#copy" class="tsd-kind-icon">Graph<wbr/>Object.copy</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#findBindingPanel" class="tsd-kind-icon">Graph<wbr/>Object.find<wbr/>Binding<wbr/>Panel</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#getDocumentAngle" class="tsd-kind-icon">Graph<wbr/>Object.get<wbr/>Document<wbr/>Angle</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#getDocumentBounds" class="tsd-kind-icon">Graph<wbr/>Object.get<wbr/>Document<wbr/>Bounds</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#getDocumentPoint" class="tsd-kind-icon">Graph<wbr/>Object.get<wbr/>Document<wbr/>Point</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#getDocumentScale" class="tsd-kind-icon">Graph<wbr/>Object.get<wbr/>Document<wbr/>Scale</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#getLocalPoint" class="tsd-kind-icon">Graph<wbr/>Object.get<wbr/>Local<wbr/>Point</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#isContainedBy" class="tsd-kind-icon">Graph<wbr/>Object.is<wbr/>Contained<wbr/>By</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#isEnabledObject" class="tsd-kind-icon">Graph<wbr/>Object.is<wbr/>Enabled<wbr/>Object</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#isVisibleObject" class="tsd-kind-icon">Graph<wbr/>Object.is<wbr/>Visible<wbr/>Object</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#set" class="tsd-kind-icon">Graph<wbr/>Object.set</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#setProperties" class="tsd-kind-icon">Graph<wbr/>Object.set<wbr/>Properties</a></li><li class="tsd-kind-method tsd-parent-kind-class"><a href="GraphObject.html#trigger" class="tsd-kind-icon">Graph<wbr/>Object.trigger</a></li></ul></section></div></section></section><section class="tsd-panel-group tsd-member-group "><h2>Constructors</h2><section class="tsd-panel tsd-member tsd-kind-constructor tsd-parent-kind-class tsd-is-overwrite"><a id="constructor" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> constructor<a href="#constructor" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-signatures tsd-kind-constructor tsd-parent-kind-class tsd-is-overwrite"><li class="tsd-signature tsd-kind-icon">new <wbr/>Text<wbr/>Block<span class="tsd-signature-symbol">(</span>text<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">string</span>, init<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="TextBlock.html" class="tsd-signature-type" data-tsd-kind="Class">TextBlock</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="TextBlock.html" class="tsd-signature-type" data-tsd-kind="Class">TextBlock</a></li><li class="tsd-signature tsd-kind-icon">new <wbr/>Text<wbr/>Block<span class="tsd-signature-symbol">(</span>init<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="TextBlock.html" class="tsd-signature-type" data-tsd-kind="Class">TextBlock</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="TextBlock.html" class="tsd-signature-type" data-tsd-kind="Class">TextBlock</a></li></ul><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Constructs a <a href="TextBlock.html">TextBlock</a>, which by default has no string to show; if it did,
it would draw the text, wrapping if needed, in the default font using a black stroke.</p>
<div><p>Typical usage:</p>
<pre><code class="language-js"><span class="hl-1">new</span><span class="hl-2"> </span><span class="hl-4">go</span><span class="hl-2">.</span><span class="hl-5">TextBlock</span><span class="hl-2">(</span><span class="hl-6">"Hello World"</span><span class="hl-2">, { </span><span class="hl-4">font:</span><span class="hl-2"> </span><span class="hl-6">"12px sans-serif"</span><span class="hl-2">, </span><span class="hl-4">stroke:</span><span class="hl-2"> </span><span class="hl-6">"gray"</span><span class="hl-2"> })</span>
</code></pre>
<p>It is common to data-bind the <a href="TextBlock.html#text">text</a>:</p>
<pre><code class="language-js"><span class="hl-0">// A Node used as the node template, holding a single TextBlock</span><br/><span class="hl-4">myDiagram</span><span class="hl-2">.</span><span class="hl-4">nodeTemplate</span><span class="hl-2"> =</span><br/><span class="hl-2"> </span><span class="hl-1">new</span><span class="hl-2"> </span><span class="hl-4">go</span><span class="hl-2">.</span><span class="hl-5">Node</span><span class="hl-2">()</span><br/><span class="hl-2"> .</span><span class="hl-5">add</span><span class="hl-2">(</span><br/><span class="hl-2"> </span><span class="hl-1">new</span><span class="hl-2"> </span><span class="hl-4">go</span><span class="hl-2">.</span><span class="hl-5">TextBlock</span><span class="hl-2">({ </span><span class="hl-4">font:</span><span class="hl-2"> </span><span class="hl-6">"12px sans-serif"</span><span class="hl-2">, </span><span class="hl-4">stroke:</span><span class="hl-2"> </span><span class="hl-6">"darkgray"</span><span class="hl-2"> })</span><br/><span class="hl-2"> .</span><span class="hl-5">bind</span><span class="hl-2">(</span><span class="hl-6">"text"</span><span class="hl-2">));</span><br/><br/><span class="hl-0">// It could be used with model data like this:</span><br/><span class="hl-4">myDiagram</span><span class="hl-2">.</span><span class="hl-4">model</span><span class="hl-2"> = </span><span class="hl-1">new</span><span class="hl-2"> </span><span class="hl-4">go</span><span class="hl-2">.</span><span class="hl-5">GraphLinksModel</span><span class="hl-2">(</span><br/><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">"1"</span><span class="hl-2">, </span><span class="hl-4">text:</span><span class="hl-2"> </span><span class="hl-6">"First TextBlock"</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">"2"</span><span class="hl-2">, </span><span class="hl-4">text:</span><span class="hl-2"> </span><span class="hl-6">"Second TextBlock"</span><span class="hl-2"> }</span><br/><span class="hl-2"> ]);</span>
</code></pre>
</div></div><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameters"><li><h5><span class="tsd-flag ts-flagOptional">Optional</span> text: <span class="tsd-signature-type">string</span></h5><div class="tsd-comment tsd-typography">
<p>The textblock's text.</p>
</div></li><li><h5><span class="tsd-flag ts-flagOptional">Optional</span> init: <span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="TextBlock.html" class="tsd-signature-type" data-tsd-kind="Class">TextBlock</a><span class="tsd-signature-symbol">></span></h5><div class="tsd-comment tsd-typography">
<p>Optional initialization properties.</p>
</div></li></ul><h4 class="tsd-returns-title">Returns <a href="TextBlock.html" class="tsd-signature-type" data-tsd-kind="Class">TextBlock</a></h4></li><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>A newly constructed <a href="TextBlock.html">TextBlock</a> has no string to show; if it did,
it would draw the text, wrapping if needed, in the default font using a black stroke.</p>
</div><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameters"><li><h5><span class="tsd-flag ts-flagOptional">Optional</span> init: <span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><a href="TextBlock.html" class="tsd-signature-type" data-tsd-kind="Class">TextBlock</a><span class="tsd-signature-symbol">></span></h5><div class="tsd-comment tsd-typography">
<p>Optional initialization properties.</p>
</div></li></ul><h4 class="tsd-returns-title">Returns <a href="TextBlock.html" class="tsd-signature-type" data-tsd-kind="Class">TextBlock</a></h4></li></ul></section></section><section class="tsd-panel-group tsd-member-group "><h2>Properties</h2><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="choices" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> choices<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">[]</span><a href="#choices" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets the an array of possible choices for a custom <a href="TextEditingTool.html">TextEditingTool</a>.
The value must be an array of strings.</p>
<div><p>The default value is null.
For example usage, see the <a href="../../samples/customTextEditingTool.html">Custom TextEditingTool Sample</a>.</p>
</div><dl class="tsd-comment-tags"><dt class="">since</dt><dd><p>1.7</p>
</dd></dl></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="editable" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> editable<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><a href="#editable" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets whether or not this TextBlock allows in-place editing of the <a href="TextBlock.html#text">text</a>
string by the user with the help of the <a href="TextEditingTool.html">TextEditingTool</a>.
The default is false.</p>
<div><p>See also <a href="Part.html#textEditable">Part.textEditable</a>.</p>
</div></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="errorFunction" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> error<wbr/>Function<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>tool<span class="tsd-signature-symbol">: </span><a href="TextEditingTool.html" class="tsd-signature-type" data-tsd-kind="Class">TextEditingTool</a>, oldString<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span>, newString<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="#errorFunction" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets the function to call if a text edit made with the <a href="TextEditingTool.html">TextEditingTool</a> is invalid.
The default is null.</p>
</div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="flip" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> flip<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span><a href="#flip" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets how the TextBlock is displayed: Either normally or with a Horizontal or Vertical flip or both.</p>
<div><p>Possible values are <a href="GraphObject.html#static-None">GraphObject.None</a>, <a href="GraphObject.html#static-FlipHorizontal">GraphObject.FlipHorizontal</a>, <a href="GraphObject.html#static-FlipVertical">GraphObject.FlipVertical</a>, or <a href="GraphObject.html#static-FlipBoth">GraphObject.FlipBoth</a>.
The default is <a href="GraphObject.html#static-None">GraphObject.None</a>.</p>
</div><dl class="tsd-comment-tags"><dt class="">since</dt><dd><p>2.0</p>
</dd></dl></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="font" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> font<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><a href="#font" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets the current font settings.
The font property must be a valid CSS string describing a font.
The font string can accept several CSS properties but they must be
in a specific order in order to render correctly across all browsers:</p>
<div><p><code>"font-style font-variant font-weight font-size font-family"</code></p>
<p>For example, <code>"Italic small-caps bold 32px Georgia, Serif"</code> is a valid font string
using every CSS font property. Not every browser can render every font option.
For more information about CSS font syntax, see <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font">CSS fonts (mozilla.org)</a>.</p>
<p>If your Node sizes depend on TextBlocks, it is best to ensure any custom fonts you are using are finished loading before you load your Diagram.
This will ensure nodes are sized appropriately for the initial Diagram layout.</p>
<p>The default font is "13px sans-serif".</p>
</div></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="formatting" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> formatting<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">EnumValue</span><a href="#formatting" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets the policy for trimming whitespace on each line of text.</p>
<div><p>Possible values are <a href="TextBlock.html#static-FormatTrim">TextBlock.FormatTrim</a>, which trims whitespace before and after every line of text,
or <a href="TextBlock.html#static-FormatNone">TextBlock.FormatNone</a>, which will not trim any whitespace and may be useful for preformatted text.
The default is <a href="TextBlock.html#static-FormatTrim">TextBlock.FormatTrim</a>.</p>
</div><dl class="tsd-comment-tags"><dt class="">since</dt><dd><p>2.2</p>
</dd></dl></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="graduatedEnd" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> graduated<wbr/>End<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><a href="#graduatedEnd" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets the fractional distance along the main shape of a "Graduated" <a href="Panel.html">Panel</a> at which this kind of tick text should end.
The default is 1; the value should range from 0 to 1.</p>
<dl class="tsd-comment-tags"><dt class="">since</dt><dd><p>1.7</p>
</dd></dl></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="graduatedFunction" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> graduated<wbr/>Function<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>val<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span>, tb<span class="tsd-signature-symbol">: </span><a href="TextBlock.html" class="tsd-signature-type" data-tsd-kind="Class">TextBlock</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">string</span><a href="#graduatedFunction" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets the function to convert from a value along a "Graduated" <a href="Panel.html">Panel</a> to a string.
The default returns a string representing the value rounded to at most 2 decimals.</p>
<div><p>The function takes a number argument, a value between <a href="Panel.html#graduatedMin">Panel.graduatedMin</a> and <a href="Panel.html#graduatedMax">Panel.graduatedMax</a>,
and this TextBlock.
The function will return a string, the text that will appear at the value of the argument.</p>
<p>Note that the second argument is the TextBlock, <em>not</em> a particular label that would be rendered at the given value.
The function, if supplied, must not have any side-effects.</p>
</div><dl class="tsd-comment-tags"><dt class="">since</dt><dd><p>1.7</p>
</dd></dl></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="graduatedSkip" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> graduated<wbr/>Skip<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>val<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span>, tb<span class="tsd-signature-symbol">: </span><a href="TextBlock.html" class="tsd-signature-type" data-tsd-kind="Class">TextBlock</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">boolean</span><a href="#graduatedSkip" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets the function to determine which values along a "Graduated" <a href="Panel.html">Panel</a> will be skipped.
The default is null and doesn't skip any text labels.</p>
<div><p>The function takes a number argument, a value between <a href="Panel.html#graduatedMin">Panel.graduatedMin</a> and <a href="Panel.html#graduatedMax">Panel.graduatedMax</a>,
and this TextBlock.
The function will return a boolean, whether the text label will be skipped at the value of the argument.</p>
<p>Note that the second argument is the TextBlock, <em>not</em> a particular label that would be rendered at the given value.
The function, if supplied, must not have any side-effects.</p>
</div><dl class="tsd-comment-tags"><dt class="">since</dt><dd><p>2.0</p>
</dd></dl></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="graduatedStart" class="tsd-anchor"></a><h3 class="tsd-anchor-link"> graduated<wbr/>Start<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><a href="#graduatedStart" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><ul class="tsd-descriptions"><li class="tsd-description"><div class="tsd-comment tsd-typography">
<p>Gets or sets the fractional distance along the main shape of a "Graduated" <a href="Panel.html">Panel</a> at which this text should start.
The default is 0; the value should range from 0 to 1.</p>
<dl class="tsd-comment-tags"><dt class="">since</dt><dd><p>1.7</p>
</dd></dl></div></li></ul></section><section class="tsd-panel tsd-member tsd-kind-accesso