update docs and demo

demo/browser.js

@@ -133,7 +133,6 @@ async function drawResults(input) {
   human.draw.body(canvas, result.body);
   human.draw.hand(canvas, result.hand);
   human.draw.gesture(canvas, result.gesture);
-  human.draw.angles(canvas, result.face);
   await calcSimmilariry(result);
 
   // update log

dist/demo-browser-index.json

@@ -1,7 +1,7 @@
 {
   "inputs": {
     "dist/human.esm.js": {
-      "bytes": 1353316,
+      "bytes": 1353240,
       "imports": []
     },
     "demo/menu.js": {
@@ -13,7 +13,7 @@
       "imports": []
     },
     "demo/browser.js": {
-      "bytes": 28008,
+      "bytes": 27966,
       "imports": [
         {
           "path": "dist/human.esm.js",
@@ -35,7 +35,7 @@
       "imports": [],
       "exports": [],
       "inputs": {},
-      "bytes": 2062279
+      "bytes": 2061718
     },
     "dist/demo-browser-index.js": {
       "imports": [],
@@ -43,7 +43,7 @@
       "entryPoint": "demo/browser.js",
       "inputs": {
         "dist/human.esm.js": {
-          "bytesInOutput": 1345820
+          "bytesInOutput": 1345744
         },
         "demo/menu.js": {
           "bytesInOutput": 10696
@@ -52,10 +52,10 @@
           "bytesInOutput": 6759
         },
         "demo/browser.js": {
-          "bytesInOutput": 17496
+          "bytesInOutput": 17471
         }
       },
-      "bytes": 1388156
+      "bytes": 1388055
     }
   }
 }

dist/human.esm.json

@@ -450,7 +450,7 @@
       "imports": []
     },
     "src/draw.ts": {
-      "bytes": 16861,
+      "bytes": 16392,
       "imports": [
         {
           "path": "config.js",
@@ -463,7 +463,7 @@
       ]
     },
     "src/human.ts": {
-      "bytes": 22707,
+      "bytes": 22807,
       "imports": [
         {
           "path": "src/log.ts",
@@ -553,7 +553,7 @@
       "imports": [],
       "exports": [],
       "inputs": {},
-      "bytes": 1980477
+      "bytes": 1980000
     },
     "dist/human.esm.js": {
       "imports": [],
@@ -575,7 +575,7 @@
           "bytesInOutput": 394
         },
         "dist/tfjs.esm.js": {
-          "bytesInOutput": 1056723
+          "bytesInOutput": 1056721
         },
         "src/tfjs/backend.ts": {
           "bytesInOutput": 1053
@@ -686,10 +686,10 @@
           "bytesInOutput": 2583
         },
         "src/draw.ts": {
-          "bytesInOutput": 9814
+          "bytesInOutput": 9740
         }
       },
-      "bytes": 1353316
+      "bytes": 1353240
     }
   }
 }

dist/human.iife.json

@@ -450,7 +450,7 @@
       "imports": []
     },
     "src/draw.ts": {
-      "bytes": 16861,
+      "bytes": 16392,
       "imports": [
         {
           "path": "config.js",
@@ -463,7 +463,7 @@
       ]
     },
     "src/human.ts": {
-      "bytes": 22707,
+      "bytes": 22807,
       "imports": [
         {
           "path": "src/log.ts",
@@ -553,7 +553,7 @@
       "imports": [],
       "exports": [],
       "inputs": {},
-      "bytes": 1980488
+      "bytes": 1980011
     },
     "dist/human.ts": {
       "imports": [],
@@ -576,7 +576,7 @@
           "bytesInOutput": 394
         },
         "dist/tfjs.esm.js": {
-          "bytesInOutput": 1056723
+          "bytesInOutput": 1056721
         },
         "src/tfjs/backend.ts": {
           "bytesInOutput": 1053
@@ -684,10 +684,10 @@
           "bytesInOutput": 2583
         },
         "src/draw.ts": {
-          "bytesInOutput": 9814
+          "bytesInOutput": 9740
         }
       },
-      "bytes": 1353358
+      "bytes": 1353282
     }
   }
 }

dist/human.node.json

@@ -450,7 +450,7 @@
       "imports": []
     },
     "src/draw.ts": {
-      "bytes": 16861,
+      "bytes": 16392,
       "imports": [
         {
           "path": "config.js",
@@ -463,7 +463,7 @@
       ]
     },
     "src/human.ts": {
-      "bytes": 22707,
+      "bytes": 22807,
       "imports": [
         {
           "path": "src/log.ts",
@@ -553,7 +553,7 @@
       "imports": [],
       "exports": [],
       "inputs": {},
-      "bytes": 747228
+      "bytes": 746751
     },
     "dist/human.node-gpu.js": {
       "imports": [],
@@ -684,10 +684,10 @@
           "bytesInOutput": 2580
         },
         "src/draw.ts": {
-          "bytesInOutput": 9699
+          "bytesInOutput": 9629
         }
       },
-      "bytes": 290724
+      "bytes": 290654
     }
   }
 }

package-lock.json

@@ -365,9 +365,9 @@
       "dev": true
     },
     "@types/node": {
-      "version": "14.14.31",
+      "version": "14.14.32",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.31.tgz",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.32.tgz",
-      "integrity": "sha512-vFHy/ezP5qI0rFgJ7aQnjDXwAMrG0KqqIH7tQG5PPv3BWBayOPIQNBjVc/P6hhdZfMx51REc6tfDNXHUio893g==",
+      "integrity": "sha512-/Ctrftx/zp4m8JOujM5ZhwzlWLx22nbQJiVqz8/zE15gOeEW+uly3FSX4fGFpcfEvFzXcMCJwq9lGVWgyARXhg==",
       "dev": true
     },
     "@types/node-fetch": {
@@ -1027,9 +1027,9 @@
       }
     },
     "esbuild": {
-      "version": "0.8.56",
+      "version": "0.8.57",
-      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.8.56.tgz",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.8.57.tgz",
-      "integrity": "sha512-PTMdAWK3JI2MNW811znGssGP5GR44tQPr++VQ1rPP0n8Z1cTKbCPD3S/kXPLr3ZZDIwAaVm08fuFym6Rp8l/0A==",
+      "integrity": "sha512-j02SFrUwFTRUqiY0Kjplwjm1psuzO1d6AjaXKuOR9hrY0HuPsT6sV42B6myW34h1q4CRy+Y3g4RU/cGJeI/nNA==",
       "dev": true
     },
     "escalade": {
@@ -1606,10 +1606,9 @@
       }
     },
     "glob-parent": {
-      "version": "5.1.1",
+      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.1.tgz",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
-      "integrity": "sha512-FnI+VGOpnlGHWZxthPGR+QhR78fuiK0sNLkHQv+bL9fQi57lNNdquIbna/WrfROrolq8GK5Ek6BiMwqL/voRYQ==",
+      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
-      "dev": true,
       "requires": {
         "is-glob": "^4.0.1"
       }
@@ -1822,8 +1821,7 @@
     "is-extglob": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
-      "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=",
+      "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
-      "dev": true
     },
     "is-fullwidth-code-point": {
       "version": "3.0.0",
@@ -1835,7 +1833,6 @@
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.1.tgz",
       "integrity": "sha512-5G0tKtBTFImOqDnLB2hG6Bp2qcKEFduo4tZu9MT/H6NQv/ghhy30o55ufafxJ/LdH79LLs2Kfrn85TLKyA7BUg==",
-      "dev": true,
       "requires": {
         "is-extglob": "^2.1.1"
       }
@@ -2601,9 +2598,9 @@
       "dev": true
     },
     "simple-git": {
-      "version": "2.36.0",
+      "version": "2.36.1",
-      "resolved": "https://registry.npmjs.org/simple-git/-/simple-git-2.36.0.tgz",
+      "resolved": "https://registry.npmjs.org/simple-git/-/simple-git-2.36.1.tgz",
-      "integrity": "sha512-EJNaUgGYzBnQiyEkNZgbQSg76agbEDqlgHDr8DAXqV8xWvcefydbipye7YXtHMGbbEK998dcFezS8qF0sepZ5Q==",
+      "integrity": "sha512-bN18Ea/4IJgqgbZyE9VpVEUkAu9vyP0VWP7acP0CRC1p/N80GGJ0HhIVeFJsm8TdJLBowiJpdLesQuAZ5TFSKw==",
       "dev": true,
       "requires": {
         "@kwsites/file-exists": "^1.1.1",
@@ -2834,10 +2831,9 @@
       "dev": true
     },
     "tsutils": {
-      "version": "3.20.0",
+      "version": "3.21.0",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-3.20.0.tgz",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-3.21.0.tgz",
-      "integrity": "sha512-RYbuQuvkhuqVeXweWT3tJLKOEJ/UUw9GjNEZGWdrLLlM+611o1gwLHBpxoFJKKl25fLprp2eVthtKs5JOrNeXg==",
+      "integrity": "sha512-mHKK3iUXL+3UF6xL5k0PEhKRUBKPBCv/+RkEOpjRWxxx27KKRBmmA60A9pgOUvMi8GKhRMPEmjBRPzs2W7O1OA==",
-      "dev": true,
       "requires": {
         "tslib": "^1.8.1"
       },
@@ -2845,8 +2841,7 @@
         "tslib": {
           "version": "1.14.1",
           "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
-          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
-          "dev": true
         }
       }
     },

package.json

@@ -33,13 +33,13 @@
     "@tensorflow/tfjs-layers": "^3.2.0",
     "@tensorflow/tfjs-node": "^3.2.0",
     "@tensorflow/tfjs-node-gpu": "^3.2.0",
-    "@types/node": "^14.14.31",
+    "@types/node": "^14.14.32",
     "@typescript-eslint/eslint-plugin": "^4.16.1",
     "@typescript-eslint/parser": "^4.16.1",
     "@vladmandic/pilogger": "^0.2.14",
     "chokidar": "^3.5.1",
     "dayjs": "^1.10.4",
-    "esbuild": "^0.8.56",
+    "esbuild": "^0.8.57",
     "eslint": "^7.21.0",
     "eslint-config-airbnb-base": "^14.2.1",
     "eslint-plugin-import": "^2.22.1",
@@ -48,7 +48,7 @@
     "eslint-plugin-promise": "^4.3.1",
     "rimraf": "^3.0.2",
     "seedrandom": "^3.0.5",
-    "simple-git": "^2.36.0",
+    "simple-git": "^2.36.1",
     "tslib": "^2.1.0",
     "typescript": "^4.2.3"
   },

src/draw.ts

@@ -16,7 +16,7 @@ export const options = {
   drawPolygons: true,
   fillPolygons: false,
   useDepth: true,
-  useCurves: true,
+  useCurves: false,
   bufferedOutput: false,
 };
 
@@ -130,6 +130,7 @@ export async function face(inCanvas, result) {
       const emotion = f.emotion.map((a) => `${Math.trunc(100 * a.score)}% ${a.emotion}`);
       labels.push(emotion.join(' '));
     }
+    if (f.angle) labels.push(`roll: ${Math.trunc(100 * f.angle.roll) / 100} yaw:${Math.trunc(100 * f.angle.yaw) / 100} pitch:${Math.trunc(100 * f.angle.pitch) / 100}`);
     if (labels.length === 0) labels.push('face');
     ctx.fillStyle = options.color;
     for (let i = labels.length - 1; i >= 0; i--) {
@@ -342,26 +343,6 @@ export async function hand(inCanvas, result) {
   }
 }
 
-export async function angles(inCanvas, result) {
-  // todo
-  if (!result || !inCanvas) return;
-  if (!(inCanvas instanceof HTMLCanvasElement)) return;
-  const ctx = inCanvas.getContext('2d');
-  if (!ctx) return;
-  ctx.font = options.font;
-  ctx.strokeStyle = options.color;
-  ctx.fillStyle = options.color;
-  ctx.lineWidth = options.lineWidth;
-  /*
-  const r = 200;
-  for (const res of result) {
-    ctx.moveTo(inCanvas.width - r, inCanvas.height - r);
-    ctx.lineTo(inCanvas.width - r + (r * Math.cos(res.angle.roll)), inCanvas.height - r + (r * Math.sin(res.angle.roll)));
-    ctx.stroke();
-  }
-  */
-}
-
 export async function canvas(inCanvas, outCanvas) {
   if (!inCanvas || !outCanvas) return;
   if (!(inCanvas instanceof HTMLCanvasElement) || !(outCanvas instanceof HTMLCanvasElement)) return;
@@ -376,5 +357,4 @@ export async function all(inCanvas, result) {
   body(inCanvas, result.body);
   hand(inCanvas, result.hand);
   gesture(inCanvas, result.gesture);
-  angles(inCanvas, result.face);
 }

src/human.ts

@@ -249,20 +249,19 @@ class Human {
   }
 
   calculateFaceAngle = (mesh) => {
-    if (!mesh || mesh.length < 152) return {};
+    if (!mesh || mesh.length < 300) return {};
     const radians = (a1, a2, b1, b2) => Math.atan2(b2 - a2, b1 - a1);
     // eslint-disable-next-line no-unused-vars, @typescript-eslint/no-unused-vars
     const degrees = (theta) => Math.abs(((theta * 180) / Math.PI) % 360);
     const angle = {
+      // values are in radians in range of -pi/2 to pi/2 which is -90 to +90 degrees
+      // value of 0 means center
       // roll is face lean left/right
-      // looking at x,y of outside corners of leftEye and rightEye
+      roll: radians(mesh[33][0], mesh[33][1], mesh[263][0], mesh[263][1]), // looking at x,y of outside corners of leftEye and rightEye
-      roll: radians(mesh[33][0], mesh[33][1], mesh[263][0], mesh[263][1]),
       // yaw is face turn left/right
-      // looking at x,z of outside corners of leftEye and rightEye
+      yaw: radians(mesh[33][0], mesh[33][2], mesh[263][0], mesh[263][2]), // looking at x,z of outside corners of leftEye and rightEye
-      yaw: radians(mesh[33][0], mesh[33][2], mesh[263][0], mesh[263][2]),
       // pitch is face move up/down
-      // looking at y,x of top and bottom points of the face
+      pitch: radians(mesh[10][1], mesh[10][2], mesh[152][1], mesh[152][2]), // looking at y,z of top and bottom points of the face
-      pitch: radians(mesh[10][1], mesh[10][2], mesh[152][1], mesh[152][2]),
     };
     return angle;
   }

types/draw.d.ts

@@ -20,6 +20,5 @@ export declare function gesture(inCanvas: any, result: any): Promise<void>;
 export declare function face(inCanvas: any, result: any): Promise<void>;
 export declare function body(inCanvas: any, result: any): Promise<void>;
 export declare function hand(inCanvas: any, result: any): Promise<void>;
-export declare function angles(inCanvas: any, result: any): Promise<void>;
 export declare function canvas(inCanvas: any, outCanvas: any): Promise<void>;
 export declare function all(inCanvas: any, result: any): Promise<void>;

wiki

@@ -1 +1 @@
-Subproject commit f9a7144a87877d8e7b6da1f545fb4d49b313be22
+Subproject commit 0b8afcd5149686d64d6f00bebe33937cd175d949