Hi, i want to use wrist tracking to build a try on watches, the problem is it wont show the watches on my hand, plus there’s no preview for onWristTracked?
Here’s my code, thank you for the help
import * as deepar from 'deepar';
// Log the version. Just in case.
console.log("Deepar version: " + deepar.version);
// Top-level await is not supported.
// So we wrap the whole code in an async function that is called immediatly.
(async function() {
const watch1 = document.getElementById("watch1");
watch1.addEventListener('click', function(){
deepAR.switchEffect('effects/Watch1.deepar', {slot: 'DEFAULT_SLOT'});
});
const watch2 = document.getElementById("watch2");
watch2.addEventListener('click', function(){
deepAR.switchEffect('effects/Watch2.deepar', {slot: 'DEFAULT_SLOT'});
});
const watch3 = document.getElementById("watch3");
watch3.addEventListener('click', function(){
});
const watch4 = document.getElementById("watch4");
watch4.addEventListener('click', function(){
});
const watch5 = document.getElementById("watch5");
watch5.addEventListener('click', function(){
});
const watch6 = document.getElementById("watch6");
watch6.addEventListener('click', function(){
});
// Resize the canvas according to screen size.
const canvas = document.getElementById('deepar-canvas');
// this is to make the canvas look good on high-res screens
const scale = window.devicePixelRatio || 1;
const width = window.innerWidth > window.innerHeight ? Math.floor(window.innerHeight * 0.66) : window.innerWidth
canvas.width = Math.floor(width * scale);
canvas.height = Math.floor(window.innerHeight * scale);
// constrain the actual size of the canvas
canvas.style.maxHeight = window.innerHeight + "px";
canvas.style.maxWidth = width + "px";;
// Initialize DeepAR.
const deepAR = await deepar.initialize({
licenseKey: 'Key',
canvas: canvas,
effect: 'effects/Watch1.deepar',
additionalOptions: {
// Use the front camera.
cameraConfig: {
facingMode: "environment",
},
}
});
deepAR.callbacks.onWristTracked = (wristData) => {
if(wristData.detected) {
console.log("Detected");
deepAR.callbacks.onWristTracked = undefined;
}
};
})();
