human/typedoc/modules/draw.html

60 lines
40 KiB
HTML

<!DOCTYPE html><html class="default"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>draw | @vladmandic/human - v2.6.4</title><meta name="description" content="Documentation for @vladmandic/human - v2.6.4"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.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><div class="tsd-page-toolbar"><div class="container"><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">@vladmandic/human - v2.6.4</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" checked/><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 class="tsd-page-title"><div class="container"><ul class="tsd-breadcrumb"><li><a href="../index.html">@vladmandic/human - v2.6.4</a></li><li><a href="draw.html">draw</a></li></ul><h1>Namespace draw</h1></div></div></header><div class="container container-main"><div class="row"><div class="col-8 col-content"><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography"><div class="lead">
<p>Class Human as default export</p>
</div></div></section><section class="tsd-panel-group tsd-index-group"><h2>Index</h2><section class="tsd-panel tsd-index-panel"><div class="tsd-index-content"><section class="tsd-index-section "><h3>Type aliases</h3><ul class="tsd-index-list"><li class="tsd-kind-type-alias tsd-parent-kind-namespace"><a href="draw.html#DrawOptions" class="tsd-kind-icon">Draw<wbr/>Options</a></li></ul></section><section class="tsd-index-section "><h3>Variables</h3><ul class="tsd-index-list"><li class="tsd-kind-variable tsd-parent-kind-namespace"><a href="draw.html#options" class="tsd-kind-icon">options</a></li></ul></section><section class="tsd-index-section "><h3>Functions</h3><ul class="tsd-index-list"><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#all" class="tsd-kind-icon">all</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#body" class="tsd-kind-icon">body</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#canvas" class="tsd-kind-icon">canvas</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#face" class="tsd-kind-icon">face</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#gesture" class="tsd-kind-icon">gesture</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#hand" class="tsd-kind-icon">hand</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#object" class="tsd-kind-icon">object</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#person" class="tsd-kind-icon">person</a></li></ul></section></div></section></section><section class="tsd-panel-group tsd-member-group "><h2>Type aliases</h2><section class="tsd-panel tsd-member tsd-kind-type-alias tsd-parent-kind-namespace"><a id="DrawOptions" class="tsd-anchor"></a><h3 class="tsd-anchor-link">Draw<wbr/>Options<a href="#DrawOptions" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><div class="tsd-signature tsd-kind-icon">Draw<wbr/>Options<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-symbol">{ </span>color<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span>drawBoxes<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">; </span>drawGaze<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">; </span>drawGestures<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">; </span>drawLabels<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">; </span>drawPoints<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">; </span>drawPolygons<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">; </span>fillPolygons<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">; </span>font<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span>labelColor<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span>lineHeight<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">; </span>lineWidth<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">; </span>pointSize<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">; </span>roundRect<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">; </span>shadowColor<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span>useCurves<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">; </span>useDepth<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol"> }</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://github.com/vladmandic/human/blob/main/src/util/draw.ts#L14">src/util/draw.ts:14</a></li></ul></aside><div class="tsd-comment tsd-typography"><div class="lead">
<p>Draw Options</p>
<ul>
<li>Accessed via <code>human.draw.options</code> or provided per each draw method as the drawOptions optional parameter</li>
</ul>
</div></div><div class="tsd-type-declaration"><h4>Type declaration</h4><ul class="tsd-parameters"><li class="tsd-parameter"><h5>color<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>draw line color</p>
</div></div></li><li class="tsd-parameter"><h5>draw<wbr/>Boxes<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>should draw boxes around detection results?</p>
</div></div></li><li class="tsd-parameter"><h5>draw<wbr/>Gaze<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>should draw gaze arrows?</p>
</div></div></li><li class="tsd-parameter"><h5>draw<wbr/>Gestures<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>should detected gestures be drawn?</p>
</div></div></li><li class="tsd-parameter"><h5>draw<wbr/>Labels<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>should labels be drawn?</p>
</div></div></li><li class="tsd-parameter"><h5>draw<wbr/>Points<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>should points be drawn?</p>
</div></div></li><li class="tsd-parameter"><h5>draw<wbr/>Polygons<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>should draw polygons from detection points?</p>
</div></div></li><li class="tsd-parameter"><h5>fill<wbr/>Polygons<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>should fill polygons?</p>
</div></div></li><li class="tsd-parameter"><h5>font<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>label font</p>
</div></div></li><li class="tsd-parameter"><h5>label<wbr/>Color<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>label color</p>
</div></div></li><li class="tsd-parameter"><h5>line<wbr/>Height<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>line spacing between labels</p>
</div></div></li><li class="tsd-parameter"><h5>line<wbr/>Width<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>line width for drawn lines</p>
</div></div></li><li class="tsd-parameter"><h5>point<wbr/>Size<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>size of drawn points</p>
</div></div></li><li class="tsd-parameter"><h5>round<wbr/>Rect<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>draw rounded boxes by n pixels</p>
</div></div></li><li class="tsd-parameter"><h5>shadow<wbr/>Color<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>label shadow color</p>
</div></div></li><li class="tsd-parameter"><h5>use<wbr/>Curves<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>should lines be curved?</p>
</div></div></li><li class="tsd-parameter"><h5>use<wbr/>Depth<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span></h5><div class="tsd-comment tsd-typography"><div class="lead">
<p>use z-coordinate when available</p>
</div></div></li></ul></div></section></section><section class="tsd-panel-group tsd-member-group "><h2>Variables</h2><section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-namespace"><a id="options" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span class="tsd-flag ts-flagConst">Const</span> options<a href="#options" aria-label="Permalink" class="tsd-anchor-icon"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5"></path></svg></a></h3><div class="tsd-signature tsd-kind-icon">options<span class="tsd-signature-symbol">:</span> <a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol"> = ...</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://github.com/vladmandic/human/blob/main/src/util/draw.ts#L52">src/util/draw.ts:52</a></li></ul></aside><div class="tsd-comment tsd-typography"><div class="lead">
<p>currently set draw options <a href="draw.html#DrawOptions">DrawOptions</a></p>
</div></div></section></section><section class="tsd-panel-group tsd-member-group "><h2>Functions</h2><section class="tsd-panel tsd-member tsd-kind-function tsd-parent-kind-namespace"><a id="all" class="tsd-anchor"></a><h3 class="tsd-anchor-link">all<a href="#all" 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-function tsd-parent-kind-namespace"><li class="tsd-signature tsd-kind-icon">all<span class="tsd-signature-symbol">(</span>inCanvas<span class="tsd-signature-symbol">: </span><a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a>, result<span class="tsd-signature-symbol">: </span><a href="../interfaces/Result.html" class="tsd-signature-type" data-tsd-kind="Interface">Result</a>, drawOptions<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol">&gt;</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">null</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-symbol">[</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">, </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">, </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">, </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">, </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">]</span><span class="tsd-signature-symbol">&gt;</span></li></ul><ul class="tsd-descriptions"><li class="tsd-description"><aside class="tsd-sources"><ul><li>Defined in <a href="https://github.com/vladmandic/human/blob/main/src/util/draw.ts#L511">src/util/draw.ts:511</a></li></ul></aside><div class="tsd-comment tsd-typography"><div class="lead">
<p>meta-function that performs draw for: canvas, face, body, hand</p>
</div></div><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameters"><li><h5>inCanvas: <a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a></h5></li><li><h5>result: <a href="../interfaces/Result.html" class="tsd-signature-type" data-tsd-kind="Interface">Result</a></h5></li><li><h5><span class="tsd-flag ts-flagOptional">Optional</span> drawOptions: <span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol">&gt;</span></h5></li></ul><h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">null</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-symbol">[</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">, </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">, </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">, </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">, </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">]</span><span class="tsd-signature-symbol">&gt;</span></h4></li></ul></section><section class="tsd-panel tsd-member tsd-kind-function tsd-parent-kind-namespace"><a id="body" class="tsd-anchor"></a><h3 class="tsd-anchor-link">body<a href="#body" 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-function tsd-parent-kind-namespace"><li class="tsd-signature tsd-kind-icon">body<span class="tsd-signature-symbol">(</span>inCanvas<span class="tsd-signature-symbol">: </span><a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a>, result<span class="tsd-signature-symbol">: </span><a href="../interfaces/BodyResult.html" class="tsd-signature-type" data-tsd-kind="Interface">BodyResult</a><span class="tsd-signature-symbol">[]</span>, drawOptions<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol">&gt;</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></li></ul><ul class="tsd-descriptions"><li class="tsd-description"><aside class="tsd-sources"><ul><li>Defined in <a href="https://github.com/vladmandic/human/blob/main/src/util/draw.ts#L333">src/util/draw.ts:333</a></li></ul></aside><div class="tsd-comment tsd-typography"><div class="lead">
<p>draw detected bodies</p>
</div></div><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameters"><li><h5>inCanvas: <a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a></h5></li><li><h5>result: <a href="../interfaces/BodyResult.html" class="tsd-signature-type" data-tsd-kind="Interface">BodyResult</a><span class="tsd-signature-symbol">[]</span></h5></li><li><h5><span class="tsd-flag ts-flagOptional">Optional</span> drawOptions: <span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol">&gt;</span></h5></li></ul><h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></h4></li></ul></section><section class="tsd-panel tsd-member tsd-kind-function tsd-parent-kind-namespace"><a id="canvas" class="tsd-anchor"></a><h3 class="tsd-anchor-link">canvas<a href="#canvas" 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-function tsd-parent-kind-namespace"><li class="tsd-signature tsd-kind-icon">canvas<span class="tsd-signature-symbol">(</span>input<span class="tsd-signature-symbol">: </span><a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">HTMLImageElement</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">HTMLVideoElement</span>, output<span class="tsd-signature-symbol">: </span><a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></li></ul><ul class="tsd-descriptions"><li class="tsd-description"><aside class="tsd-sources"><ul><li>Defined in <a href="https://github.com/vladmandic/human/blob/main/src/util/draw.ts#L503">src/util/draw.ts:503</a></li></ul></aside><div class="tsd-comment tsd-typography"><div class="lead">
<p>draw processed canvas</p>
</div></div><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameters"><li><h5>input: <a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">HTMLImageElement</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">HTMLVideoElement</span></h5></li><li><h5>output: <a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a></h5></li></ul><h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></h4></li></ul></section><section class="tsd-panel tsd-member tsd-kind-function tsd-parent-kind-namespace"><a id="face" class="tsd-anchor"></a><h3 class="tsd-anchor-link">face<a href="#face" 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-function tsd-parent-kind-namespace"><li class="tsd-signature tsd-kind-icon">face<span class="tsd-signature-symbol">(</span>inCanvas<span class="tsd-signature-symbol">: </span><a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a>, result<span class="tsd-signature-symbol">: </span><a href="../interfaces/FaceResult.html" class="tsd-signature-type" data-tsd-kind="Interface">FaceResult</a><span class="tsd-signature-symbol">[]</span>, drawOptions<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol">&gt;</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></li></ul><ul class="tsd-descriptions"><li class="tsd-description"><aside class="tsd-sources"><ul><li>Defined in <a href="https://github.com/vladmandic/human/blob/main/src/util/draw.ts#L209">src/util/draw.ts:209</a></li></ul></aside><div class="tsd-comment tsd-typography"><div class="lead">
<p>draw detected faces</p>
</div></div><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameters"><li><h5>inCanvas: <a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a></h5></li><li><h5>result: <a href="../interfaces/FaceResult.html" class="tsd-signature-type" data-tsd-kind="Interface">FaceResult</a><span class="tsd-signature-symbol">[]</span></h5></li><li><h5><span class="tsd-flag ts-flagOptional">Optional</span> drawOptions: <span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol">&gt;</span></h5></li></ul><h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></h4></li></ul></section><section class="tsd-panel tsd-member tsd-kind-function tsd-parent-kind-namespace"><a id="gesture" class="tsd-anchor"></a><h3 class="tsd-anchor-link">gesture<a href="#gesture" 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-function tsd-parent-kind-namespace"><li class="tsd-signature tsd-kind-icon">gesture<span class="tsd-signature-symbol">(</span>inCanvas<span class="tsd-signature-symbol">: </span><a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a>, result<span class="tsd-signature-symbol">: </span><a href="../index.html#GestureResult" class="tsd-signature-type" data-tsd-kind="Type alias">GestureResult</a><span class="tsd-signature-symbol">[]</span>, drawOptions<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol">&gt;</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></li></ul><ul class="tsd-descriptions"><li class="tsd-description"><aside class="tsd-sources"><ul><li>Defined in <a href="https://github.com/vladmandic/human/blob/main/src/util/draw.ts#L180">src/util/draw.ts:180</a></li></ul></aside><div class="tsd-comment tsd-typography"><div class="lead">
<p>draw detected gestures</p>
</div></div><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameters"><li><h5>inCanvas: <a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a></h5></li><li><h5>result: <a href="../index.html#GestureResult" class="tsd-signature-type" data-tsd-kind="Type alias">GestureResult</a><span class="tsd-signature-symbol">[]</span></h5></li><li><h5><span class="tsd-flag ts-flagOptional">Optional</span> drawOptions: <span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol">&gt;</span></h5></li></ul><h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></h4></li></ul></section><section class="tsd-panel tsd-member tsd-kind-function tsd-parent-kind-namespace"><a id="hand" class="tsd-anchor"></a><h3 class="tsd-anchor-link">hand<a href="#hand" 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-function tsd-parent-kind-namespace"><li class="tsd-signature tsd-kind-icon">hand<span class="tsd-signature-symbol">(</span>inCanvas<span class="tsd-signature-symbol">: </span><a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a>, result<span class="tsd-signature-symbol">: </span><a href="../interfaces/HandResult.html" class="tsd-signature-type" data-tsd-kind="Interface">HandResult</a><span class="tsd-signature-symbol">[]</span>, drawOptions<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol">&gt;</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></li></ul><ul class="tsd-descriptions"><li class="tsd-description"><aside class="tsd-sources"><ul><li>Defined in <a href="https://github.com/vladmandic/human/blob/main/src/util/draw.ts#L379">src/util/draw.ts:379</a></li></ul></aside><div class="tsd-comment tsd-typography"><div class="lead">
<p>draw detected hands</p>
</div></div><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameters"><li><h5>inCanvas: <a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a></h5></li><li><h5>result: <a href="../interfaces/HandResult.html" class="tsd-signature-type" data-tsd-kind="Interface">HandResult</a><span class="tsd-signature-symbol">[]</span></h5></li><li><h5><span class="tsd-flag ts-flagOptional">Optional</span> drawOptions: <span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol">&gt;</span></h5></li></ul><h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></h4></li></ul></section><section class="tsd-panel tsd-member tsd-kind-function tsd-parent-kind-namespace"><a id="object" class="tsd-anchor"></a><h3 class="tsd-anchor-link">object<a href="#object" 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-function tsd-parent-kind-namespace"><li class="tsd-signature tsd-kind-icon">object<span class="tsd-signature-symbol">(</span>inCanvas<span class="tsd-signature-symbol">: </span><a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a>, result<span class="tsd-signature-symbol">: </span><a href="../interfaces/ObjectResult.html" class="tsd-signature-type" data-tsd-kind="Interface">ObjectResult</a><span class="tsd-signature-symbol">[]</span>, drawOptions<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol">&gt;</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></li></ul><ul class="tsd-descriptions"><li class="tsd-description"><aside class="tsd-sources"><ul><li>Defined in <a href="https://github.com/vladmandic/human/blob/main/src/util/draw.ts#L448">src/util/draw.ts:448</a></li></ul></aside><div class="tsd-comment tsd-typography"><div class="lead">
<p>draw detected objects</p>
</div></div><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameters"><li><h5>inCanvas: <a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a></h5></li><li><h5>result: <a href="../interfaces/ObjectResult.html" class="tsd-signature-type" data-tsd-kind="Interface">ObjectResult</a><span class="tsd-signature-symbol">[]</span></h5></li><li><h5><span class="tsd-flag ts-flagOptional">Optional</span> drawOptions: <span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol">&gt;</span></h5></li></ul><h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></h4></li></ul></section><section class="tsd-panel tsd-member tsd-kind-function tsd-parent-kind-namespace"><a id="person" class="tsd-anchor"></a><h3 class="tsd-anchor-link">person<a href="#person" 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-function tsd-parent-kind-namespace"><li class="tsd-signature tsd-kind-icon">person<span class="tsd-signature-symbol">(</span>inCanvas<span class="tsd-signature-symbol">: </span><a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a>, result<span class="tsd-signature-symbol">: </span><a href="../interfaces/PersonResult.html" class="tsd-signature-type" data-tsd-kind="Interface">PersonResult</a><span class="tsd-signature-symbol">[]</span>, drawOptions<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol">&gt;</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></li></ul><ul class="tsd-descriptions"><li class="tsd-description"><aside class="tsd-sources"><ul><li>Defined in <a href="https://github.com/vladmandic/human/blob/main/src/util/draw.ts#L475">src/util/draw.ts:475</a></li></ul></aside><div class="tsd-comment tsd-typography"><div class="lead">
<p>draw combined person results instead of individual detection result objects</p>
</div></div><h4 class="tsd-parameters-title">Parameters</h4><ul class="tsd-parameters"><li><h5>inCanvas: <a href="../index.html#AnyCanvas" class="tsd-signature-type" data-tsd-kind="Type alias">AnyCanvas</a></h5></li><li><h5>result: <a href="../interfaces/PersonResult.html" class="tsd-signature-type" data-tsd-kind="Interface">PersonResult</a><span class="tsd-signature-symbol">[]</span></h5></li><li><h5><span class="tsd-flag ts-flagOptional">Optional</span> drawOptions: <span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol">&lt;</span><a href="draw.html#DrawOptions" class="tsd-signature-type" data-tsd-kind="Type alias">DrawOptions</a><span class="tsd-signature-symbol">&gt;</span></h5></li></ul><h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></h4></li></ul></section></section></div><div class="col-4 col-menu menu-sticky-wrap menu-highlight"><nav class="tsd-navigation primary"><ul><li class=""><a href="../index.html">Exports</a></li><li class=" tsd-kind-namespace"><a href="Tensor.html">Tensor</a></li><li class="current tsd-kind-namespace"><a href="draw.html">draw</a></li><li class=" tsd-kind-namespace"><a href="match.html">match</a></li><li class=" tsd-kind-namespace"><a href="models.html">models</a></li></ul></nav><nav class="tsd-navigation secondary menu-sticky"><ul><li class="tsd-kind-type-alias tsd-parent-kind-namespace"><a href="draw.html#DrawOptions" class="tsd-kind-icon">Draw<wbr/>Options</a></li><li class="tsd-kind-variable tsd-parent-kind-namespace"><a href="draw.html#options" class="tsd-kind-icon">options</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#all" class="tsd-kind-icon">all</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#body" class="tsd-kind-icon">body</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#canvas" class="tsd-kind-icon">canvas</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#face" class="tsd-kind-icon">face</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#gesture" class="tsd-kind-icon">gesture</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#hand" class="tsd-kind-icon">hand</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#object" class="tsd-kind-icon">object</a></li><li class="tsd-kind-function tsd-parent-kind-namespace"><a href="draw.html#person" class="tsd-kind-icon">person</a></li></ul></nav></div></div></div><footer class=""><div class="container"><h2>Legend</h2><div class="tsd-legend-group"><ul class="tsd-legend"><li class="tsd-kind-constructor tsd-parent-kind-class"><span class="tsd-kind-icon">Constructor</span></li><li class="tsd-kind-property tsd-parent-kind-class"><span class="tsd-kind-icon">Property</span></li><li class="tsd-kind-method tsd-parent-kind-class"><span class="tsd-kind-icon">Method</span></li></ul><ul class="tsd-legend"><li class="tsd-kind-property tsd-parent-kind-interface"><span class="tsd-kind-icon">Property</span></li><li class="tsd-kind-method tsd-parent-kind-interface"><span class="tsd-kind-icon">Method</span></li></ul></div><h2>Settings</h2><p>Theme <select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></p></div></footer><div class="overlay"></div><script src="../assets/main.js"></script></body></html>