diff --git a/CHANGELOG.md b/CHANGELOG.md index aca487fb..fc60eb01 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,7 +9,7 @@ Repository: **** ## Changelog -### **HEAD -> main** 2021/04/25 mandic00@live.com +### **HEAD -> main** 2021/04/26 mandic00@live.com - convert blazeface to module - version 1.8 release candidate diff --git a/src/draw/draw.ts b/src/draw/draw.ts index a016c19e..e989e405 100644 --- a/src/draw/draw.ts +++ b/src/draw/draw.ts @@ -410,11 +410,23 @@ export async function hand(inCanvas: HTMLCanvasElement, result: Array, draw } } } + if (localOptions.drawLabels) { + const addHandLabel = (part, title) => { + ctx.fillStyle = localOptions.useDepth ? `rgba(${127.5 + (2 * part[part.length - 1][2])}, ${127.5 - (2 * part[part.length - 1][2])}, 255, 0.5)` : localOptions.color; + ctx.fillText(title, part[part.length - 1][0] + 4, part[part.length - 1][1] + 4); + }; + ctx.font = localOptions.font; + addHandLabel(h.annotations.indexFinger, 'index'); + addHandLabel(h.annotations.middleFinger, 'middle'); + addHandLabel(h.annotations.ringFinger, 'ring'); + addHandLabel(h.annotations.pinky, 'pinky'); + addHandLabel(h.annotations.thumb, 'thumb'); + addHandLabel(h.annotations.palmBase, 'palm'); + } if (localOptions.drawPolygons) { - const addPart = (part) => { + const addHandLine = (part) => { if (!part) return; for (let i = 0; i < part.length; i++) { - ctx.lineWidth = localOptions.lineWidth; ctx.beginPath(); ctx.strokeStyle = localOptions.useDepth ? `rgba(${127.5 + (2 * part[i][2])}, ${127.5 - (2 * part[i][2])}, 255, 0.5)` : localOptions.color; ctx.moveTo(part[i > 0 ? i - 1 : 0][0], part[i > 0 ? i - 1 : 0][1]); @@ -422,12 +434,13 @@ export async function hand(inCanvas: HTMLCanvasElement, result: Array, draw ctx.stroke(); } }; - addPart(h.annotations.indexFinger); - addPart(h.annotations.middleFinger); - addPart(h.annotations.ringFinger); - addPart(h.annotations.pinky); - addPart(h.annotations.thumb); - // addPart(hand.annotations.palmBase); + ctx.lineWidth = localOptions.lineWidth; + addHandLine(h.annotations.indexFinger); + addHandLine(h.annotations.middleFinger); + addHandLine(h.annotations.ringFinger); + addHandLine(h.annotations.pinky); + addHandLine(h.annotations.thumb); + // addPart(h.annotations.palmBase); } } }