2025-02-05 15:15:34 +01:00
<!DOCTYPE html> < html class = "default" lang = "en" data-base = ".." > < head > < meta charset = "utf-8" / > < meta http-equiv = "x-ua-compatible" content = "IE=edge" / > < title > fromPixelsAsync | @vladmandic/face-api - v1.7.15< / title > < meta name = "description" content = "Documentation for @vladmandic/face-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" / > < 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 async src = "../assets/hierarchy.js" id = "tsd-hierarchy-script" > < / 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 class = "tsd-page-toolbar" > < div class = "tsd-toolbar-contents container" > < div class = "table-cell" id = "tsd-search" > < div class = "field" > < 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" > @vladmandic/face-api - v1.7.15< / 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 > < / header > < div class = "container container-main" > < div class = "col-content" > < div class = "tsd-page-title" > < ul class = "tsd-breadcrumb" > < li > < a href = "../index.html" > @vladmandic/face-api< / a > < / li > < li > < a href = "../modules/tf.html" > tf< / a > < / li > < li > < a href = "../modules/tf.browser.html" > browser< / a > < / li > < li > < a href = "tf.browser.fromPixelsAsync.html" > fromPixelsAsync< / a > < / li > < / ul > < h1 > Function fromPixelsAsync< / h1 > < / div > < section class = "tsd-panel" > < ul class = "tsd-signatures" > < li class = "tsd-signature tsd-anchor-link" > < a id = "frompixelsasync" class = "tsd-anchor" > < / a > < span class = "tsd-kind-call-signature" > fromPixelsAsync< / span > < span class = "tsd-signature-symbol" > (< / span > < br / > < span class = "tsd-kind-parameter" > pixels< / span > < span class = "tsd-signature-symbol" > :< / span > < br / > < span class = "tsd-signature-symbol" > |< / span > < span class = "tsd-signature-type" > HTMLCanvasElement< / span > < br / > < span class = "tsd-signature-symbol" > |< / span > < span class = "tsd-signature-type" > HTMLImageElement< / span > < br / > < span class = "tsd-signature-symbol" > |< / span > < span class = "tsd-signature-type" > HTMLVideoElement< / span > < br / > < span class = "tsd-signature-symbol" > |< / span > < span class = "tsd-signature-type" > ImageData< / span > < br / > < span class = "tsd-signature-symbol" > |< / span > < span class = "tsd-signature-type" > ImageBitmap< / span > < br / > < span class = "tsd-signature-symbol" > |< / span > < span class = "tsd-signature-type" > PixelData< / span > < span class = "tsd-signature-symbol" > ,< / span > < br / > < span class = "tsd-kind-parameter" > numChannels< / span > < span class = "tsd-signature-symbol" > ?:< / span > < span class = "tsd-signature-type" > number< / span > < span class = "tsd-signature-symbol" > ,< / span > < br / > < span class = "tsd-signature-symbol" > )< / span > < span class = "tsd-signature-symbol" > :< / span > < span class = "tsd-signature-type" > Promise< / span > < span class = "tsd-signature-symbol" > < < / span > < a href = "../types/tf.Tensor3D.html" class = "tsd-signature-type tsd-kind-type-alias" > Tensor3D< / a > < span class = "tsd-signature-symbol" > > < / span > < a href = "#frompixelsasync" aria-label = "Permalink" class = "tsd-anchor-icon" > <
2024-09-10 17:30:23 +02:00
< pre > < code class = "js" > < span class = "hl-0" > const< / span > < span class = "hl-1" > < / span > < span class = "hl-2" > image< / span > < span class = "hl-1" > = < / span > < span class = "hl-0" > new< / span > < span class = "hl-1" > < / span > < span class = "hl-3" > ImageData< / span > < span class = "hl-1" > (< / span > < span class = "hl-4" > 1< / span > < span class = "hl-1" > , < / span > < span class = "hl-4" > 1< / span > < span class = "hl-1" > );< / span > < br / > < span class = "hl-5" > image< / span > < span class = "hl-1" > .< / span > < span class = "hl-5" > data< / span > < span class = "hl-1" > [< / span > < span class = "hl-4" > 0< / span > < span class = "hl-1" > ] = < / span > < span class = "hl-4" > 100< / span > < span class = "hl-1" > ;< / span > < br / > < span class = "hl-5" > image< / span > < span class = "hl-1" > .< / span > < span class = "hl-5" > data< / span > < span class = "hl-1" > [< / span > < span class = "hl-4" > 1< / span > < span class = "hl-1" > ] = < / span > < span class = "hl-4" > 150< / span > < span class = "hl-1" > ;< / span > < br / > < span class = "hl-5" > image< / span > < span class = "hl-1" > .< / span > < span class = "hl-5" > data< / span > < span class = "hl-1" > [< / span > < span class = "hl-4" > 2< / span > < span class = "hl-1" > ] = < / span > < span class = "hl-4" > 200< / span > < span class = "hl-1" > ;< / span > < br / > < span class = "hl-5" > image< / span > < span class = "hl-1" > .< / span > < span class = "hl-5" > data< / span > < span class = "hl-1" > [< / span > < span class = "hl-4" > 3< / span > < span class = "hl-1" > ] = < / span > < span class = "hl-4" > 255< / span > < span class = "hl-1" > ;< / span > < br / > < br / > < span class = "hl-1" > (< / span > < span class = "hl-6" > await< / span > < span class = "hl-1" > < / span > < span class = "hl-5" > tf< / span > < span class = "hl-1" > .< / span > < span class = "hl-5" > browser< / span > < span class = "hl-1" > .< / span > < span class = "hl-3" > fromPixelsAsync< / span > < span class = "hl-1" > (< / span > < span class = "hl-5" > image< / span > < span class = "hl-1" > )).< / span > < span class = "hl-3" > print< / span > < span class = "hl-1" > ();< / span >
< / code > < button type = "button" > Copy< / button > < / pre >
2024-01-17 22:56:53 +01:00
< p > This API is the async version of fromPixels. The API will first
check |WRAP_TO_IMAGEBITMAP| flag, and try to wrap the input to
imageBitmap if the flag is set to true.< / p >
2025-02-05 15:02:06 +01:00
< / div > < div class = "tsd-parameters" > < h4 class = "tsd-parameters-title" > Parameters< / h4 > < ul class = "tsd-parameter-list" > < li > < span > < span class = "tsd-kind-parameter" > pixels< / span > : < br / > < span class = "tsd-signature-symbol" > |< / span > < span class = "tsd-signature-type" > HTMLCanvasElement< / span > < br / > < span class = "tsd-signature-symbol" > |< / span > < span class = "tsd-signature-type" > HTMLImageElement< / span > < br / > < span class = "tsd-signature-symbol" > |< / span > < span class = "tsd-signature-type" > HTMLVideoElement< / span > < br / > < span class = "tsd-signature-symbol" > |< / span > < span class = "tsd-signature-type" > ImageData< / span > < br / > < span class = "tsd-signature-symbol" > |< / span > < span class = "tsd-signature-type" > ImageBitmap< / span > < br / > < span class = "tsd-signature-symbol" > |< / span > < span class = "tsd-signature-type" > PixelData< / span > < / span > < div class = "tsd-comment tsd-typography" > < p > The input image to construct the tensor from. The
2024-01-17 22:56:53 +01:00
supported image types are all 4-channel. You can also pass in an image
object with following attributes:
< code > {data: Uint8Array; width: number; height: number}< / code > < / p >
2024-09-10 17:30:23 +02:00
< / div > < div class = "tsd-comment tsd-typography" > < / div > < / li > < li > < span > < code class = "tsd-tag" > Optional< / code > < span class = "tsd-kind-parameter" > numChannels< / span > : < span class = "tsd-signature-type" > number< / span > < / span > < div class = "tsd-comment tsd-typography" > < p > The number of channels of the output tensor. A
2024-01-17 22:56:53 +01:00
numChannels value less than 4 allows you to ignore channels. Defaults to
3 (ignores alpha channel of input image).< / p >
2025-02-05 15:15:34 +01:00
< / div > < div class = "tsd-comment tsd-typography" > < / div > < / li > < / ul > < / div > < h4 class = "tsd-returns-title" > Returns < span class = "tsd-signature-type" > Promise< / span > < span class = "tsd-signature-symbol" > < < / span > < a href = "../types/tf.Tensor3D.html" class = "tsd-signature-type tsd-kind-type-alias" > Tensor3D< / a > < span class = "tsd-signature-symbol" > > < / span > < / h4 > < div class = "tsd-comment tsd-typography" > < div class = "tsd-tag-doc" > < h4 class = "tsd-anchor-link" > < a id = "doc" class = "tsd-anchor" > < / a > Doc< a href = "#doc" aria-label = "Permalink" class = "tsd-anchor-icon" > < svg viewBox = "0 0 24 24" > < use href = "../assets/icons.svg#icon-anchor" > < / use > < / svg > < / a > < / h4 > < / div > < / div > < aside class = "tsd-sources" > < ul > < li > Defined in node_modules/.pnpm/@tensorflow+tfjs-core@4.22.0/node_modules/@tensorflow/tfjs-core/dist/ops/browser.d.ts:79< / li > < / ul > < / aside > < / li > < / ul > < / section > < / div > < div class = "col-sidebar" > < div class = "page-menu" > < div class = "tsd-navigation settings" > < details class = "tsd-accordion" > < 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 > Settings< / h3 > < / summary > < div class = "tsd-accordion-details" > < div class = "tsd-filter-visibility" > < span class = "settings-label" > Member Visibility< / span > < ul id = "tsd-filter-options" > < li class = "tsd-filter-item" > < label class = "tsd-filter-input" > < input type = "checkbox" id = "tsd-filter-inherited" name = "inherited" checked / > < svg width = "32" height = "32" viewBox = "0 0 32 32" aria-hidden = "true" > < rect class = "tsd-checkbox-background" width = "30" height = "30" x = "1" y = "1" rx = "6" fill = "none" > < / rect > < path class = "tsd-checkbox-checkmark" d = "M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke = "none" stroke-width = "3.5" stroke-linejoin = "round" fill = "none" > < / path > < / svg > < span > Inherited< / span > < / label > < / li > < / ul > < / div > < div class = "tsd-theme-toggle" > < label class = "settings-label" for = "tsd-theme" > Theme< / label > < select id = "tsd-theme" > < option value = "os" > OS< / option > < option value = "light" > Light< / option > < option value = "dark" > Dark< / option > < / select > < / div > < / div > < / details > < / div > < / div > < div class = "site-menu" > < nav class = "tsd-navigation" > < a href = "../index.html" > @vladmandic/face-api - v1.7.15< / a > < ul class = "tsd-small-nested-navigation" id = "tsd-nav-container" > < li > Loading...< / li > < / ul > < / nav > < / div > < / div > < / div > < footer > < / footer > < div class = "overlay" > < / div > < / body > < / html >