Development Guideline

1.Initiate TryOn instance

At first , initiate tryon instance with below 4 parameters.

@parameter1 : set canvas object

@parameter2 : set pixelRatio like windows.devicePixelRatio

@parameter3 : set sdkpath in the project directory

@parameter4 : callback method:(type,detailInfo)=>void .

type could be 1 or 2. 1 means initiation completed and 2 means asset is set up.

detailInfo is the error message.

const renderCanvas = document.querySelector('#glcanvas');
var tryonInstance = new stARTryOn
(
     renderCanvas, 
      window.devicePixelRatio, 
      '/sdk/',
       (type, detailInfo) {console.log(type, "result: ", detailInfo.result, "info: ", detailInfo.info);
});

2.Initiate HumanAction handle

Then, initiate HumanAction handle for feet , face or wrist detection with below 4 parameters.

@parameter1 : open log

@parameter2 : license type. 1 means using license file and 2 means transfer license content.

@parameter3 : license content. Input license content if choose 2 in parameter2

@parameter4 : security key from server when choose 2 in paramter2

tryonInstance.initHumanActionHandle(true, 1, "", "");

3.Set Assets

There are 3 patterns for setting. Shoes , wrist watch or eyewear use the same interface.

3.1 setTryOn

@parameter1 : resource path

var materialPath = 'resources/shoes0.json';
tryonInstance.setTryOn(materialPath);

3.2 setTryOnJson

@parameter1 : json object

tryonInstance.setTryOnJson(jsonObject);

3.3 setTryOnPackage

@parameter1 : asset package path

var zipPath = 'resources/shoes0.zip';
tryonInstance.setTryOnPackage(zipPath);

4.Process Assets rendering

After asset set, use processFrame method for rendering.

@parameter1 : imagedata (need to be the same size with canvas and object type is ImageData)

@parameter2 : orientation ( Currently only 0 is available)

tryonInstance.processFrame(imageData, 0);

5.Remove Assets

Use removeTryOn method if need to delete asset

@parameter1 : type of TryOn

tryonInstance.removeTryOn(tryonInstance.tryon_shoes);

6.Stop detection

Stop for feet , face or wrist detection

@parameter1 : boolean

tryonInstance.pause = !tryonInstance.pause;

7. Capture screenshot

tryonInstance.saveImage();

8.Set tryon mode

Use setMode method to change the display mode. Currently , shoes only have TryOn mode.

tryonInstance.setMode(tryonInstance.mode_tryon);

9.Destroy instance

Destroy instance created for Tryon

tryonInstance.destroyStARTryOn();

Specification

Support the latest version safari , firefox and Chrome.

Last updated