search

akhil-rana / virtual-bg

Easily add virtual background effects to your video/camera input inside any web browser
MIT License
18 stars 7 forks source link

while calling segmentBackground method i am facing issue #6

Closed ChirappaVishnupriya closed 1 year ago

ChirappaVishnupriya commented 2 years ago

I am trying to blur or applying background image for that i am using this lib.But when i am calling segmentBackground(this.inputVideoElement, this.outputCanvasElement);
i am facing below issue.Can you check and please suggest solution to resolve this issue

ERROR Error: Uncaught (in promise): ReferenceError: SelfieSegmentation is not defined ReferenceError: SelfieSegmentation is not defined at virtual-bg.js:31:28 at Generator.next () at asyncGeneratorStep (asyncToGenerator.js:3:1) at _next (asyncToGenerator.js:25:1) at asyncToGenerator.js:32:1 at new ZoneAwarePromise (zone.js:1429:1) at asyncToGenerator.js:21:1 at _segmentBackground (virtual-bg.js:54:2) at segmentBackground (virtual-bg.js:20:1) at AppComponent.ngAfterViewInit (app.component.ts:34:22) at resolvePromise (zone.js:1211:1) at zone.js:1118:1 at zone.js:1134:1 at asyncGeneratorStep (asyncToGenerator.js:6:1) at _next (asyncToGenerator.js:25:1) at asyncToGenerator.js:32:1 at new ZoneAwarePromise (zone.js:1429:1) at asyncToGenerator.js:21:1 at _segmentBackground (virtual-bg.js:54:2) at segmentBackground (virtual-bg.js:20:1)

steps:

import { segmentBackground, applyBlur, applyImageBackground } from'virtual-bg';

this.inputVideoElement = this.document.getElementById("inputVideoElement") this.outputCanvasElement = this.document.getElementById('output_canvas'); console.log(this.inputVideoElement,this.outputCanvasElement); segmentBackground(this.inputVideoElement, this.outputCanvasElement);

Thanks in advance

akhil-rana commented 2 years ago

Hey Thanks for reporting. Can you please report back with your OS, browser, and what kind of JS project you're using it with (react, vite vanilla etc)