ApsaraVideo Live:Methods

Perform image rendering

/**
 * Perform image rendering. 
 * The imageData object is returned.
 * @param imageData The image data.
 * @param imageWidth The width of the image.
 * @param imageHeight The height of the image.
 * @param renderCallback The callback for image rendering.
 */
render = function(imageData, imageWidth, imageHeight, renderCallback);

Turn on the camera and perform retouching

 /**
 * Enable retouching for the camera stream.
 * Chrome 94 or later is required.
 * @param constraints The camera parameters.
 * @returns The retouched camera stream.
 */
openCameraAndRender(constraints?: MediaStreamConstraints): Promise<MediaStream>

Render the media to the canvas

 /**
 * Render the retouched media object to renderCanvas.
 * RenderCanvas is the canvas that was specified during initialization.
 * @param mediaObject Media object TexImageSourceWebCodecs(ImageData | ImageBitmap | HTMLImageElement | HTMLVideoElement | HTMLCanvasElement | VideoFrame | OffscreenCanvas) | Uint8Array
 */
renderMediaObjectToRenderCanvas(mediaObject: TexImageSourceWebCodecs | Uint8Array, width?: number, height?: number): void

Perform rendering based on the media object

/**
 * Render the media object.
 * Return the rendered ImageData object.
 * @param mediaElement Media object TexImageSourceWebCodecs(ImageData | ImageBitmap | HTMLImageElement | HTMLVideoElement | HTMLCanvasElement | VideoFrame | OffscreenCanvas) | Uint8Array
 * @param width 
 * @param height 
 * @param renderCallback 
 */
renderWithMediaObject(mediaObject: TexImageSourceWebCodecs | Uint8Array, width: number, height: number, renderCallback: (outImageData: Uint8Array, imageWidth: number, imageHeight: number) => void): void

Perform texture rendering

/**
 * Perform texture rendering.
 * Import the media object. The texture object is returned.
 * @param mediaElement The media object, such as imageElement, videoElement, canvasElement, videoframe, or imagebitmap.
 * @param width The width of the media object.
 * @param height The height of the media object.
 * @returns 
 */
renderMediaObjectToTexture = function(mediaElement, width, height);

Render textures

**
 * Render a texture based on the texture ID.
 * Enter a texture ID. The texture ID is returned.
 * @param inTextureId The texture ID.
 * @param width The width of the media object.
 * @param height The height of the media object.
 * @returns 
 */
renderTextureId = function(inTextureId, width, height);

Perform rendering based on the stream

/**
 * Render the video stream. The rendered video stream is returned.
 * Chrome 94 or later is required.
 * @param inputMediaStream The input media stream.
 */
renderMediaStream(inputMediaStream: MediaStream): MediaStream 
renderMediaStreamTrack(videoMediaStreamTrack: MediaStreamVideoTrack, width?: number, height?: number): MediaStreamVideoTrack
getTransformStream(): TransformStream;// Return the stream retouching processor.

Destroy the engine

**
 * Destroy the engine.
 */
engineDestory = function();

Initialize an animoji

/**
 * Initialize an animoji.
 * @param animojiUrl The URL of the animoji resources.
 * @param width The width.
 * @param height The height.
 * @param scale The scaled size.
 * @returns 
 */
 animojiInit = function (animojiUrl: string, width: number, height: number, scale: number)

Perform image rendering for an animoji

/**
 * Perform image rendering for an animoji.
 * @param imageData The image data.
 * @param imageWidth The width of the media object.
 * @param imageHeight The height of the media object.
 * @param renderCallBack The callback for rendering. 
 */
 animojiRender = function (imageData: Uint8Array, imageWidth: number, imageHeight: number, renderCallBack: any)

Render an Animoji media object

/**
 * Render the Animoji.
 * @param mediaSource Media object TexImageSourceWebCodecs(ImageData | ImageBitmap | HTMLImageElement | HTMLVideoElement | HTMLCanvasElement | VideoFrame | OffscreenCanvas) | Uint8Array
 * @param imageWidth The width of the media object.
 * @param imageHeight The height of the media object.
 * @param renderCallBack The callback for rendering.
 */
animojiRenderWithMediaObject(mediaObject: TexImageSourceWebCodecs | Uint8Array, width: number, height: number, renderCallback: (outImageData: Uint8Array, imageWidth: number, imageHeight: number) => void): void 

Render an Animoji media object and return the texture output

/**
 * Render the Animoji.
 * @param mediaObject Media object TexImageSourceWebCodecs(ImageData | ImageBitmap | HTMLImageElement | HTMLVideoElement | HTMLCanvasElement | VideoFrame | OffscreenCanvas) | Uint8Array
 * @param width The width.
 * @param height The height.
 * @returns The rendered texture object.
 */
animojiRenderMediaObjectToTexture(mediaObject: TexImageSourceWebCodecs | Uint8Array, width?: number, height?: number): WebGLTexture | null

Render an Animoji based on the texture ID

/**
 * Render the Animoji.
 * @param inTextureId The texture ID.
 * @param width The width.
 * @param height The height.
 * @returns The rendered texture object.
 */
animojiRenderTextureId(inTextureId: number, width: number, height: number): WebGLTexture | null

Perform texture rendering for an animoji

/**
 * Perform texture rendering for an animoji.
 * The rendered textures are returned.
 * @param imageSource The media object, such as image, video, canvas, videoframe, or imagebitmap.
 * @param imageWidth The width of the media object.
 * @param imageHeight The height of the media object.
 */
animojirenderMediaObjectToTexture = function (mediaSource: any, imageWidth: number, imageHeight: number)

Resize an animoji

/**
 * Resize an animoji.
 * @param scale The scaled size. Recommended values: 0.8 to 1.5.
 */
animojiResize = function (scale: number)

Set the background mode for an animoji

/**
* Set the background mode for an animoji.
* @param mode The background mode. A value of 0 specifies no background. A value of 1 specifies that the video captured from the camera is used as the background. A value of 2 specifies that an image is used as the background.
* @param backgroundImgUrl The URL of the background image. This parameter is required if the mode parameter is set to 2.
*/
setAnimojiBackgroundWithMode = function (mode, backgroundImgUrl)

Destroy the animoji engine

 /**
 * Destroy the animoji engine.
 */
animojiDestroy = function ()

To enable the chroma key module, you need to add the following dependencies:

$ npm add @tensorflow/tfjs
$ npm add @tensorflow/tfjs-backend-webgl
$ npm add @tensorflow/tfjs-backend-webgpu

Configure green-screen or blue-screen image matting

/**
 * Configure green-screen or blue-screen image matting.
 * If you enable green-screen or blue-screen image matting, pure-color image matting is disabled. 
 * @param isBlue Specifies whether to use the blue screen. A value of true specifies that the blue screen is used. A value of false specifies that the green screen is used.
 * @param backgroundImgUrl The URL of the background image.
	*/
setGreenScreenWithUrl = function (isBlue, backgroundImgUrl)

Configure background replacement

/**
 * Configure AI-based background replacement.
 * @param backgroundImgUrl The URL of the background image.
 */
setSegmentBackgroundUrl = function (backgroundImgUrl)

Configure pure-color image matting

/**
 * Configure pure-color image matting. 
 * @param backgroundImgUrl The URL of the background image.
 */
setPureColorBackgroundUrl = function (backgroundImgUrl)

Configure retouching effects

 /**
 * Configure retouching effects.
 * @param type The retouching effect, which is a value of the kQueenBeautyType parameter.
 * @param enable Specifies whether to enable the retouching effect.
 */
 setQueenBeautyType = function (type: number, enable: boolean)

Specify retouching parameters

/**
 * Specify retouching parameters.
 * @param param The retouching parameter, which is a value of the kQueenBeautyParams parameter.
 * @param value The parameter value.
 */
setQueenBeautyParams = function (param: number, value: number);

Configure LUT filters

 /**
 * Use a built-in LUT filter.
 * @param lutType The LUT filter, which is enumerated by Assets.kResLut.
 * @returns 
 */
setLutByType(lutType: Assets.kResLut): Promise<void>
 
/**
 * Specify a LUT filter.
 * @param imageUrl The URL of the filter that you want to specify.
 * @returns 
 */
setLutImageUrl(imageUrl: string): Promise<void>

/**
* @brief Specify a face shaping effect. Before you specify the face shaping effect, specify the kQueenBeautyType.FaceShape parameter to enable face shaping.
* @param faceShapeType The face shaping effect. This parameter is similar to the QueenBeautyFaceShapeType parameter.
* @param value The parameter value.
*/
setFaceShape = function (faceShapeType: number, value: number)

Use the built-in makeup resources

/**
 * Set the eyebrow effect.
 * @param eyeBrowType The eyebrow type, which is enumerated by kResMakeupEyeBrow.
 * @alpha The transparency.
 * @param blend The mixed type, which is enumerated by kQueenBeautyBlend.
 * @returns 
 */
setMakeupEyeBrow(eyeBrowType: Assets.kResMakeupEyeBrow, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * Set the eyelash effect.
 * @param eyelashType The eyelash type, which is enumerated by kResMakeupEyeLash.
 * @alpha The transparency.
 * @param blend The mixed type, which is enumerated by kQueenBeautyBlend.
 * @returns 
 */
setMackupEyeLash(eyelashType: Assets.kResMakeupEyeLash, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * Set the eye shadow effect.
 * @param eyeShadowType The eye shadow type, which is enumerated by kResMakeupEyeShadow.
 * @alpha The transparency.
 * @param blend The mixed type, which is enumerated by kQueenBeautyBlend.
 * @returns 
 */
setMakeupEyeShadow(eyeShadowType: Assets.kResMakeupEyeShadow, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * Set the eyeliner effect.
 * @param eyeLinerType The eyeliner type, which is enumerated by kResMakeupEyeLiner.
 * @alpha The transparency.
 * @param blend The mixed type, which is enumerated by kQueenBeautyBlend.
 * @returns 
 */
setMakeupEyeLiner(eyeLinerType: Assets.kResMakeupEyeLiner, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * Set the colored eye contacts effect.
 * @param eyeballType The colored eye contacts type, which is enumerated by kResMakeupEyeBall.
 * @alpha The transparency.
 * @param blend The mixed type, which is enumerated by kQueenBeautyBlend.
 * @returns 
 */
setMakeupEyeBall(eyeballType: Assets.kResMakeupEyeBall, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * Set the lipstick effect.
 * @param mouthType The lipstick type, which is enumerated by kResMakeupMouth.
 * @alpha The transparency.
 * @param blend The mixed type, which is enumerated by kQueenBeautyBlend.
 * @returns 
 */
setMakeupMouth(mouthType: Assets.kResMakeupMouth, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * Set full face makeup.
 * @param wholeType The full face makeup type, which is enumerated by Assets.kResMakeupWhole.
 * @alpha The transparency.
 * @param blend The mixed type, which is enumerated by kQueenBeautyBlend.
 * @returns 
 */
setMakeupWhole(wholeType: Assets.kResMakeupWhole, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * Set the blush effect.
 * @param blushType The blush type, which is enumerated by kResMakeupBlush.
 * @alpha The transparency.
 * @param blend The mixed type, which is enumerated by kQueenBeautyBlend. 
 * @returns 
 */
setMakeupBlush(blushType: Assets.kResMakeupBlush, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * Set the highlight effect.
 * @param highlightType The highlight type, which is enumerated by kResMakeupHighLight.
 * @alpha The transparency.
 * @param blend The mixed type, which is enumerated by kQueenBeautyBlend. 
 * @returns 
 */
setMakeupHighlight(highlightType: Assets.kResMakeupHighLight, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

Specify makeup types and the paths of makeup materials

/**
* @brief Specify a makeup type and the paths of makeup materials. Before you specify the makeup type, specify the kQueenBeautyType.Makeup parameter to enable makeup.
* @param makeupType The makeup type.
* @param imageUrl The URL of makeup materials, which points to a ZIP package.
* @param blend The type of mixed makeup.
*/
setMakeupWithUrl = function (makeupType: number, imageUrl: string, blend: number)

Specify makeup types and the paths of makeup materials

/**
* @brief Specify a makeup type and the paths of makeup materials. Before you specify the makeup type, specify the kQueenBeautyType.Makeup parameter to enable makeup.
* @param makeupType The makeup type.
* @param packageUrl The URL of the resource package.
* @param imageName The name of the image in the package.
* @param blend The type of mixed makeup.
*/
setMakeupWithPackage = function (makeupType: number, packageUrl: string, imageName: string, blend: number);

/**
* @brief Specify a makeup type and the paths of makeup materials. Before you specify the makeup type, specify the kQueenBeautyType.Makeup parameter to enable makeup.
* @param makeupType The makeup type.
* @param imagePaths The paths of makeup materials.
* @param blend The type of mixed makeup.
*/
setMakeupWithType = function (makeupType: number, imagePaths: string, blend: number)

/**
* @brief Specify a makeup type and the paths of makeup materials.
* @param makeupType The makeup type.
* @param imagePaths The paths of makeup materials. Separate multiple paths with commas (,).
* @param blend The type of mixed makeup.
* @param fps The frame rate.
*/
setMakeupWithTypeFps = function (makeupType: number, imagePaths: string, blend: number, fps: number)

Configure makeup transparency

 /**
* @brief Set the transparency for a makeup type for female.
* @param makeupType The makeup type.
* @param alpha The transparency for the makeup type.
*/
setMakeupFemaleAlpha = function (makeupType: number, alpha: number)

/**
* @brief Set the transparency for a makeup type for male.
* @param makeupType The makeup type.
* @param alpha The transparency for the makeup type.
*/
setMakeupMaleAlpha = function (makeupType: number, alpha: number)

/**
* @brief Set the transparency for a makeup type. You can specify the gender.
* @param makeupType The makeup type.
* @param isFeMale Specifies whether the gender is female. A value of true specifies female. A value of false specifies male. Male makeup is reserved for future use. Set the value to true.
* @param alpha The transparency for the makeup type.
*/
setMakeupAlphaWithType = function (makeupType: number, isFeMale: boolean, alpha: number)

Configure mixed makeup

 /**
 * @brief Specify the type of mixed makeup.
 * @param makeupType The makeup type.
 * @param blend The type of mixed makeup.
 */
 setMakeupBlendWithType = function (makeupType: number, blend: number)

Clear makeup

 /**
 * @brief Clear all makeup effects.
 */
 resetAllMakeupType = function ()

Add a sticker

/**
* @brief Add a material, such as a sticker, texture, or background image. Supported formats include glTF, TAOPAI, and mediaAI.
* @param materialZipUrl The URL of the material that you want to add.
*/
addMaterialWithUrl = function (materialZipUrl: string)

Remove a sticker

 /**
 * @brief Remove a material, such as a sticker, texture, or background image.
 * @param materialZipUrl The URL of the material that you want to remove.
 */
removeMaterialWithUrl = function (materialZipUrl: string)

Show facial keypoints

 /**
 * @brief Show facial keypoints.
 * @param show Specifies whether to show face triangulation.
 */
 showFaceDetectPoint = function (show: boolean)

Show face triangulation

/**
 * @brief Show face triangulation.
 * @param show Specifies whether to show face triangulation.
 */
 showMakeupLine = function (show: boolean) 

Load resources from URLs

 /** 
 * Load resource URLs to the engine.
 * @param url The URL.
 * @param needUnZip Specifies whether decompression is required.
 * @returns 
 */
loadResourceFileWithUrl = function (url: string, needUnZip: boolean)

 /** 
 * Load resource URLs to the engine.
 * @param url The URL.
 * @param saveFileName The name of the saved file.
 * @param needUnZip Specifies whether decompression is required.
 * @returns 
 */
loadResourceFileWithUrlSaveAs = function (url: string, saveFileName:string, needUnZip: boolean) {
 

Load resources by using the buffer

/**
 * Load resources by using the buffer.
 * @param buffer The arrayBuffer data.
 * @param saveFileName The name of the saved file.
 * @param needUnZip Specifies whether decompression is required.
 * @param loadCallback The callback for success.
 * @returns 
 */
loadResourceFileWithData = function(buffer: ArrayBuffer, saveFileName: string, needUnZip: boolean);

Check files

/**
* Check whether the resource file exists.
* @param fullFileName The file name that includes the full path.
* @returns 
*/
checkResourceFile(fullFileName: string)