全部產品
Search

搜尋本產品

    ApsaraVideo Live：API說明

    文件中心

    ApsaraVideo Live：API說明

    更新時間：Oct 15, 2024

    美顏特效渲染

    基於imageData對象渲染

    /**
 * 圖片渲染 
 * 返回ImageData對象
 * @param imageData 圖片ImageData
 * @param imageWidth 寬
 * @param imageHeight 高
 * @param renderCallback 圖片渲染回調
 */
render = function(imageData, imageWidth, imageHeight, renderCallback);

    開啟網路攝影機並美顏

     /**
 * 啟用網路攝影機美顏
 * 需要Chrome 94+版本瀏覽器支援
 * @param constraints 網路攝影機參數
 * @returns 美顏視頻流
 */
openCameraAndRender(constraints?: MediaStreamConstraints): Promise<MediaStream>

    直接渲染到Canvas

     /**
 * 美顏渲染媒體對象到RenderCanvas
 * RenderCanvas為初始化時指定的Canvas
 * @param mediaObject 媒體對象 TexImageSourceWebCodecs(ImageData | ImageBitmap | HTMLImageElement | HTMLVideoElement | HTMLCanvasElement | VideoFrame | OffscreenCanvas) | Uint8Array
 */
renderMediaObjectToRenderCanvas(mediaObject: TexImageSourceWebCodecs | Uint8Array, width?: number, height?: number): void

    基於媒體對象渲染

    /**
 * 媒體對象渲染
 * 返回渲染後ImageData對象
 * @param mediaElement 媒體對象 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

    基於紋理渲染

    /**
 * 基於紋理渲染
 * 輸入媒體對象返回紋理對象
 * @param mediaElement 媒體對象 imageElement、videoElement、canvasElement、videoframe、imagebitmap
 * @param width 媒體對像寬度
 * @param height 媒體對像高度
 * @returns 
 */
renderMediaObjectToTexture = function(mediaElement, width, height);

    紋理渲染

    **
 * 基於紋理ID渲染
 * 輸入紋理ID 返回紋理ID
 * @param inTextureId 輸入紋理ID
 * @param width 媒體對像寬度
 * @param height 媒體對像高度
 * @returns 
 */
renderTextureId = function(inTextureId, width, height);

    基於流渲染

    /**
 * 視頻流渲染 返回渲染視頻流
 * 需要Chrome 94+版本瀏覽器支援
 * @param inputMediaStream 輸入媒體流
 */
renderMediaStream(inputMediaStream: MediaStream): MediaStream 
renderMediaStreamTrack(videoMediaStreamTrack: MediaStreamVideoTrack, width?: number, height?: number): MediaStreamVideoTrack
getTransformStream(): TransformStream;//返回美顏轉換流處理器

    美顏引擎登出

    **
 * 美顏引擎登出
 */
engineDestory = function();

    Animoji表情

    Animoji初始化

    /**
 * Animoji初始化
 * @param animojiUrl animoji資源地址
 * @param width 寬
 * @param height 高
 * @param scale 放大尺寸
 * @returns 
 */
 animojiInit = function (animojiUrl: string, width: number, height: number, scale: number)

    Animoji 圖片渲染

    /**
 * Animoji 圖片渲染
 * @param imageData 圖片imageData
 * @param imageWidth 寬
 * @param imageHeight 高
 * @param renderCallBack 渲染回調 
 */
 animojiRender = function (imageData: Uint8Array, imageWidth: number, imageHeight: number, renderCallBack: any)

    媒體對象Animoji渲染

    /**
 * Animoji渲染
 * @param mediaSource 媒體對象 TexImageSourceWebCodecs(ImageData | ImageBitmap | HTMLImageElement | HTMLVideoElement | HTMLCanvasElement | VideoFrame | OffscreenCanvas) | Uint8Array
 * @param imageWidth 寬
 * @param imageHeight 高
 * @param renderCallBack 渲染回調
 */
animojiRenderWithMediaObject(mediaObject: TexImageSourceWebCodecs | Uint8Array, width: number, height: number, renderCallback: (outImageData: Uint8Array, imageWidth: number, imageHeight: number) => void): void

    媒體對象Animoji渲染紋理輸出

    /**
 * Animoji渲染
 * @param mediaObject 媒體對象 TexImageSourceWebCodecs(ImageData | ImageBitmap | HTMLImageElement | HTMLVideoElement | HTMLCanvasElement | VideoFrame | OffscreenCanvas) | Uint8Array
 * @param width 寬
 * @param height 高
 * @returns 渲染後紋理對象
 */
animojiRenderMediaObjectToTexture(mediaObject: TexImageSourceWebCodecs | Uint8Array, width?: number, height?: number): WebGLTexture | null

    基於紋理IdAnimoji渲染

    /**
 * Animoji渲染
 * @param inTextureId 紋理ID
 * @param width 寬
 * @param height 高
 * @returns 渲染後紋理對象
 */
animojiRenderTextureId(inTextureId: number, width: number, height: number): WebGLTexture | null

    Animoji紋理渲染

    /**
 * Animoji紋理渲染
 * 返回渲染後紋理
 * @param imageSource 媒體對象 image、video、canvas、videoframe、imagebitmap
 * @param imageWidth 寬
 * @param imageHeight 高
 */
animojirenderMediaObjectToTexture = function (mediaSource: any, imageWidth: number, imageHeight: number)

    Animoji大小調整

    /**
 * Animoji大小調整
 * @param scale 推薦：0.8~1.5
 */
animojiResize = function (scale: number)

    設定Animoji背景模式

    /**
* 設定Animoji背景模式
* @param mode 背景模式：0：無，1：網路攝影機背景 2：指定背景圖片
* @param backgroundImgUrl 背景圖片，如果mode=2時需要指定
*/
setAnimojiBackgroundWithMode = function (mode, backgroundImgUrl)

    Animoji引擎登出

     /**
 * Animoji引擎登出
 */
animojiDestroy = function ()

    背景摳圖

    啟用摳圖模組需要增加以下依賴：

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

    綠幕/藍幕摳圖

    /**
 * 綠幕/藍幕摳圖
 * 開啟此摳圖功能，純色背景摳圖（setPureColorToBackground）會關閉。
 * @param isBlue 綠幕:false，藍幕:true
 * @param backgroundImgUrl 背景圖片Url
	*/
setGreenScreenWithUrl = function (isBlue, backgroundImgUrl)

    實景摳圖

    /**
 * 實景AI摳圖
 * @param backgroundImgUrl 背景圖片Url
 */
setSegmentBackgroundUrl = function (backgroundImgUrl)

    純色摳圖

    /**
 * 純色背景摳圖。
 * @param backgroundImgUrl 背景圖片Url
 */
setPureColorBackgroundUrl = function (backgroundImgUrl)

    參數配置

    配置美顏類型

     /**
 * 配置美顏類型
 * @param type kQueenBeautyType枚舉
 * @param enable 是否啟用
 */
 setQueenBeautyType = function (type: number, enable: boolean)

    配置美顏參數值

    /**
 * 參數類型
 * @param param kQueenBeautyParams檢舉
 * @param value 參數值
 */
setQueenBeautyParams = function (param: number, value: number);

    配置LUT濾鏡

     /**
 * 使用內建Lut濾鏡
 * @param lutType Assets.kResLut枚舉
 * @returns 
 */
setLutByType(lutType: Assets.kResLut): Promise<void>
 
/**
 * 設定Lut濾鏡
 * @param imageUrl 所要設定的濾鏡圖片Url
 * @returns 
 */
setLutImageUrl(imageUrl: string): Promise<void>

    設定美型類型

    /**
* @brief 設定美型類型,設定前需要將kQueenBeautyType.FaceShape開啟
* @param faceShapeType 需要設定美型的類型，參考QueenBeautyFaceShapeType
* @param value 需要設定的值
*/
setFaceShape = function (faceShapeType: number, value: number)

    美妝API

    使用內建資源進行美妝。

    /**
 * 設定美妝眉毛
 * @param eyeBrowType 眉毛類型,kResMakeupEyeBrow枚舉
 * @alpha 妝容透明度
 * @param blend 混合類型,kQueenBeautyBlend枚舉
 * @returns 
 */
setMakeupEyeBrow(eyeBrowType: Assets.kResMakeupEyeBrow, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * 設定美妝睫毛
 * @param eyelashType 睫毛類型,kResMakeupEyeLash枚舉
 * @alpha 妝容透明度
 * @param blend 混合類型,kQueenBeautyBlend枚舉
 * @returns 
 */
setMackupEyeLash(eyelashType: Assets.kResMakeupEyeLash, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * 設定美妝眼影
 * @param eyeShadowType 眼影類型,kResMakeupEyeShadow
 * @alpha 妝容透明度
 * @param blend 混合類型,kQueenBeautyBlend枚舉
 * @returns 
 */
setMakeupEyeShadow(eyeShadowType: Assets.kResMakeupEyeShadow, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * 設定美妝眼線
 * @param eyeLinerType 眼線類型,kResMakeupEyeLiner檢舉
 * @alpha 妝容透明度
 * @param blend 混合類型,kQueenBeautyBlend枚舉
 * @returns 
 */
setMakeupEyeLiner(eyeLinerType: Assets.kResMakeupEyeLiner, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * 設定美妝美瞳
 * @param eyeballType 美瞳類型,kResMakeupEyeBall枚舉
 * @alpha 妝容透明度
 * @param blend 混合類型,kQueenBeautyBlend枚舉
 * @returns 
 */
setMakeupEyeBall(eyeballType: Assets.kResMakeupEyeBall, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * 設定美妝口紅
 * @param mouthType 口紅類型,kResMakeupMouth枚舉
 * @alpha 妝容透明度
 * @param blend 混合類型,kQueenBeautyBlend枚舉
 * @returns 
 */
setMakeupMouth(mouthType: Assets.kResMakeupMouth, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * 設定美妝整妝
 * @param wholeType 美妝整妝類型 Assets.kResMakeupWhole枚舉
 * @alpha 妝容透明度
 * @param blend 混合類型,kQueenBeautyBlend枚舉
 * @returns 
 */
setMakeupWhole(wholeType: Assets.kResMakeupWhole, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * 設定美妝腮紅
 * @param blushType 腮紅類型,kResMakeupBlush檢舉
 * @alpha 妝容透明度
 * @param blend 混合類型,kQueenBeautyBlend枚舉 
 * @returns 
 */
setMakeupBlush(blushType: Assets.kResMakeupBlush, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

/**
 * 設定美妝高光
 * @param highlightType 高光類型kResMakeupHighLight枚舉
 * @alpha 妝容透明度
 * @param blend 混合類型,kQueenBeautyBlend枚舉 
 * @returns 
 */
setMakeupHighlight(highlightType: Assets.kResMakeupHighLight, alpha: number, blend: kQueenBeautyBlend = kQueenBeautyBlend.LabMix): Promise<void>

    設定美妝類型和圖片素材路徑

    /**
* @brief 設定美妝類型和圖片素材路徑，設定美妝需要將kQueenBeautyType.Makeup 開啟
* @param makeupType 美妝類型
* @param imageUrl 美妝素材地址，一般為zip包
* @param blend 混合類型
*/
setMakeupWithUrl = function (makeupType: number, imageUrl: string, blend: number)

    設定美妝類型和圖片素材路徑

    /**
* @brief 設定美妝類型和圖片素材路徑，設定美妝需要將kQueenBeautyType.Makeup 開啟
* @param makeupType 美妝類型
* @param packageUrl 資源壓縮包url
* @param imageName 包內圖片名稱
* @param blend 混合類型
*/
setMakeupWithPackage = function (makeupType: number, packageUrl: string, imageName: string, blend: number);

/**
* @brief 設定美妝類型和圖片素材路徑，設定美妝需要將kQueenBeautyType.Makeup 開啟
* @param makeupType 美妝類型
* @param imagePaths 美妝素材地址集合
* @param blend 混合類型
*/
setMakeupWithType = function (makeupType: number, imagePaths: string, blend: number)

/**
* @brief 設定美妝類型和圖片素材路徑
* @param makeupType 美妝類型
* @param imagePaths 美妝素材地址集合（多個資源則,號分開）
* @param blend 混合類型
* @param fps 對應的幀率
*/
setMakeupWithTypeFps = function (makeupType: number, imagePaths: string, blend: number, fps: number)

    設定美妝透明度

     /**
* @brief 設定女性美妝透明度，可指定性別
* @param makeupType 美妝類型
* @param alpha 妝容透明度
*/
setMakeupFemaleAlpha = function (makeupType: number, alpha: number)

/**
* @brief 設定男性美妝透明度，可指定性別
* @param makeupType 美妝類型
* @param alpha 妝容透明度
*/
setMakeupMaleAlpha = function (makeupType: number, alpha: number)

/**
* @brief 設定美妝透明度，可指定性別
* @param makeupType 美妝類型
* @param isFeMale 是否是女性，女性:true，男性:false，（男性為介面預留，這裡均傳女性即true即可）
* @param alpha 妝容透明度
*/
setMakeupAlphaWithType = function (makeupType: number, isFeMale: boolean, alpha: number)

    設定美妝類型的混合類型

     /**
 * @brief 設定美妝類型的混合類型
 * @param makeupType 美妝類型
 * @param blend 混合類型
 */
 setMakeupBlendWithType = function (makeupType: number, blend: number)

    清除所有美妝

     /**
 * @brief 清除所有美妝
 */
 resetAllMakeupType = function ()

    貼紙API

    增加貼紙

    /**
* @brief 增加貼紙/貼圖/實景摳圖需要替換的背景，素材統一介面，支援GLTF,TAOPAI,MEDIAAI 類型
* @param materialZipUrl 要添加的素材的Url
*/
addMaterialWithUrl = function (materialZipUrl: string)

    移除貼紙

     /**
 * @brief 刪除貼紙/貼圖/實景摳圖需要替換的背景
 * @param materialZipUrl 要刪除的素材的URL
 */
removeMaterialWithUrl = function (materialZipUrl: string)

    AR隔空寫字

    裝載AR隔空寫字模組

     /**
 * 初始化AR寫字模組
 * @returns 
 */
initArWriteResource(): Promise<boolean>

    開啟Ar寫字

     /**
 * 開啟Ar寫字
 * @param enable true： 開啟
 * @param mode 1: 寫字, 2: 畫畫。
 */
setArWriting(enable: boolean, mode: number): void

    清除AR寫字痕迹

    /**
 * 清除AR寫字痕迹
 */
cleanScreenArWriting(): void

    Face Service功能調試

    展示Face Service點位

     /**
 * @brief 展示Face Service點位
 * @param show 是否展示
 */
 showFaceDetectPoint = function (show: boolean)

    展示人臉地區三角剖分線

    /**
 * @brief 展示人臉地區三角剖分線
 * @param show 是否展示
 */
 showMakeupLine = function (show: boolean)

    資源載入

    參數配置中所有的URL均需要轉成PATH才能正常使用，需要通過下面的API將URL資源檔載入到Queen引擎中產生PATH。

    通過URL載入資源

     /** 
 * 載入URL資源到引擎
 * @param url URL連結
 * @param needUnZip 是否需要解壓
 * @returns 
 */
loadResourceFileWithUrl = function (url: string, needUnZip: boolean)

 /** 
 * 載入URL資源到引擎
 * @param url URL連結
 * @param saveFileName 儲存檔案名稱
 * @param needUnZip 是否需要解壓
 * @returns 
 */
loadResourceFileWithUrlSaveAs = function (url: string, saveFileName:string, needUnZip: boolean) {

    通過buffer寫入

    /**
 * 通過buffer寫入資源
 * @param buffer arrayBuffer資料
 * @param saveFileName 儲存檔案名稱
 * @param needUnZip 是否需要解壓
 * @param loadCallback 成功回調
 * @returns 
 */
loadResourceFileWithData = function(buffer: ArrayBuffer, saveFileName: string, needUnZip: boolean);

    檔案檢查

    /**
* 驗證資源檔是否存在
* @param fullFileName 完整的路徑檔案名稱
* @returns 
*/
checkResourceFile(fullFileName: string)