Skip to content

PoseOutfitPlugin

Plugin implementing virtual try-on of avatar’s outfit

PoseOutfitPlugin is an extension of PoseAlignPlugin that allows to specify body meshes of the avatar’s node as occluders and optionally hide some child meshes (parts). It’s a good starting point for virtual try-on applications. OutfitParams defines available options of outfit. You can download any Ready Player Me avatar which outfit similar to final result, edit its outfit, re-skin model if necessary. Then simply use this plugin to build try-on app. Armature bones must follow Mixamo / RPM naming convention.

Extends

Constructors

new PoseOutfitPlugin()

new PoseOutfitPlugin(node?, outfit?, tune?): PoseOutfitPlugin

Constructor

Parameters

node?: Object3D<Object3DEventMap>

Scene node to attach

outfit?: OutfitParams

Occluder and hidden parts

tune?: PoseTuneParams = ...

Fine-tuning parameters

Returns

PoseOutfitPlugin

Overrides

PoseAlignPlugin.constructor

Properties

alignScore

readonly alignScore: 0.9 = 0.90

Pose score threshold

Inherited from

PoseAlignPlugin.alignScore


alignVisibility

readonly alignVisibility: 0.9 = 0.90

Keypoint visibility threshold

Inherited from

PoseAlignPlugin.alignVisibility


avatarLength

protected avatarLength: number = 1

Reference length of the model

Inherited from

PoseAlignPlugin.avatarLength


loaded

loaded: boolean

Loaded state

Inherited from

PoseAlignPlugin.loaded


node?

protected optional node: Object3D<Object3DEventMap>

Scene node to attach

Inherited from

PoseAlignPlugin.node


ordinal

ordinal: number

Ordinal number

Inherited from

PoseAlignPlugin.ordinal


outfit?

protected optional outfit: OutfitParams

Occluder and hidden parts


renderer?

protected optional renderer: Renderer<PoseResult>

Renderer loaded the plugin

Inherited from

PoseAlignPlugin.renderer


scene?

protected optional scene: Scene

Reference to a scene instance

Inherited from

PoseAlignPlugin.scene


skeleton?

protected optional skeleton: Skeleton

Reference to model’s skeleton

Inherited from

PoseAlignPlugin.skeleton


skeletonNodes?

protected optional skeletonNodes: SkeletonNodes

Bones of the model’s rig

Inherited from

PoseAlignPlugin.skeletonNodes


spineCurve?

protected optional spineCurve: SpineCurve

Shape of spine

Inherited from

PoseAlignPlugin.spineCurve


tune

protected tune: PoseTuneParams

Fine-tuning parameters

Inherited from

PoseAlignPlugin.tune

Methods

alignBone()

protected alignBone(transform, bone, scale): void

Set bone transformation

Transformation is in the world coordinate frame. If bone has parent we find relative transformation to follow the skeleton hierarchy. Optionally scale of parent bone can be adjusted to align head and reference (rest) position of parent’s tail (they have to be the same 3D point).

Parameters

transform: BoneTransform

Global bone position and rotation

bone: Bone<Object3DEventMap>

Reference to bone instance

scale: boolean = true

Whether to scale parent bone

Returns

void

Inherited from

PoseAlignPlugin.alignBone


dispose()

dispose(): void

Dispose video plugin

Returns

void

Inherited from

PoseAlignPlugin.dispose


estimateBones()

protected estimateBones(points, spineCurve): SkeletonTransforms

Estimate bone positions and axes

Based on detected keypoints estimates bone transformations. Position of bone if defined by 3D point itself, bone length is the distance between keypoints connected by bone. Bone’s rotation is defined by its axes that are evaluated from relative positions of adjacent keypoints. Method returns only bone position and orientation axis, final transformation of any bone can be found using the next bone in hierarchy.

Parameters

points: PosePoints

Pose keypoints

spineCurve: SpineCurve

Shape of spine

Returns

SkeletonTransforms

Bone transformations

Inherited from

PoseAlignPlugin.estimateBones


load()

load(renderer): Promise<void>

Initialize plugin

Parses and caches the rig/armature of the attached scene node (one provided to plugin’s constructor). Precalculates geometrical parameters of skeleton.

Parameters

renderer: Renderer<PoseResult>

Renderer this plugin is attached to

Returns

Promise<void>

Promise resolving when initialization is finished

Inherited from

PoseAlignPlugin.load


setNode()

setNode(object?): void

Set/attach a scene node

Method setNode() is extended to make occluders from specified body meshes and optionally hide some child meshes according to parameters. Occluders are made the same way OccluderPlugin does via overriding mesh materials.

Parameters

object?: Object3D<Object3DEventMap>

Scene node to attach

Returns

void

Promise resolving when initialization is finished

Overrides

PoseAlignPlugin.setNode


setOutfit()

setOutfit(node?, outfit?): void

Set outfit parameters

Parameters

node?: Object3D<Object3DEventMap>

Scene node to attach

outfit?: OutfitParams

Occluder and hidden parts

Returns

void

Promise resolving when initialization is finished


setupCamera()

setupCamera(ratio, angle): void

Set camera parameters

Could be overridden to adjust plugin’s pipeline.

Parameters

ratio: number

Aspect ration of input video

angle: number

Vertical field of view in radians

Returns

void

Inherited from

PoseAlignPlugin.setupCamera


setupVideo()

setupVideo(size): void

Set video size

Could be overridden to adjust plugin’s pipeline.

Parameters

size: Size

Resolution of input video

Returns

void

Inherited from

PoseAlignPlugin.setupVideo


unload()

unload(): void

Reset plugin

Removes the attached node.

Returns

void

Inherited from

PoseAlignPlugin.unload


update()

update(result, stream): Promise<void>

Update skeleton of the scene node

Evaluates positions, rotations and scales of node bones based on estimation of 3D keypoints, then applies these transformations to bones following hierarchy of armature. Optionally fine-tunes the basic alignment to improve model fitting or make it more natural. You can override this method to further tune model’s rig using provided estimations of bones as starting point. Simply call await super.update(result, stream); and use PoseAlignPlugin#skeletonNodes member storing refs to all bones of the skeleton to access transformations.

Parameters

result: PoseResult

Pose estimation results

stream: HTMLCanvasElement

Captured video frame

Returns

Promise<void>

Promise resolving when update is finished

Inherited from

PoseAlignPlugin.update


updateHandL()

protected updateHandL(anchors, points): void

Update left hand skeleton

Parameters

anchors: SkeletonTransforms

Positions and axes of bones

points: PosePoints

Pose keypoints

Returns

void

Inherited from

PoseAlignPlugin.updateHandL


updateHandR()

protected updateHandR(anchors, points): void

Update right hand skeleton

Parameters

anchors: SkeletonTransforms

Positions and axes of bones

points: PosePoints

Pose keypoints

Returns

void

Inherited from

PoseAlignPlugin.updateHandR


updateLegL()

protected updateLegL(anchors, points): void

Update left leg skeleton

Parameters

anchors: SkeletonTransforms

Positions and axes of bones

points: PosePoints

Pose keypoints

Returns

void

Inherited from

PoseAlignPlugin.updateLegL


updateLegR()

protected updateLegR(anchors, points): void

Update right leg skeleton

Parameters

anchors: SkeletonTransforms

Positions and axes of bones

points: PosePoints

Pose keypoints

Returns

void

Inherited from

PoseAlignPlugin.updateLegR


updateSpine()

protected updateSpine(anchors): void

Update spine skeleton

Parameters

anchors: SkeletonTransforms

Positions and axes of bones

Returns

void

Inherited from

PoseAlignPlugin.updateSpine