@eyepop.ai/eyepop-render-2d 0.18.6 → 0.18.7

package/dist/eyepop.render2d.index.d.mts

@@ -39,6 +39,7 @@ declare namespace Render2d {
     function renderMask(target?: string): RenderRule;
     function renderContour(target?: string): RenderRule;
     function renderFace(target?: string): RenderRule;
+    function renderKeypoints(target?: string): RenderRule;
     function renderHand(target?: string): RenderRule;
     function renderPose(target?: string): RenderRule;
     function renderTrail(durationSeconds?: number, traceDetails?: string | undefined, target?: string): RenderRule;

package/dist/eyepop.render2d.index.d.ts

@@ -39,6 +39,7 @@ declare namespace Render2d {
     function renderMask(target?: string): RenderRule;
     function renderContour(target?: string): RenderRule;
     function renderFace(target?: string): RenderRule;
+    function renderKeypoints(target?: string): RenderRule;
     function renderHand(target?: string): RenderRule;
     function renderPose(target?: string): RenderRule;
     function renderTrail(durationSeconds?: number, traceDetails?: string | undefined, target?: string): RenderRule;

package/dist/eyepop.render2d.index.js

@@ -394,8 +394,8 @@ var RenderHand = class {
   }
   renderKeyPoints(keyPoints, fillColor, width, xOffset, yOffset, xScale, yScale) {
     const labelsToPoints = /* @__PURE__ */ new Map();
-    let maxZ = 0;
-    let minZ = 0;
+    let maxZ = 1;
+    let minZ = -1;
     for (let i2 = 0; i2 < keyPoints.points.length; i2++) {
       const keyPoint = keyPoints.points[i2];
       labelsToPoints.set(keyPoint.classLabel, keyPoint);
@@ -838,6 +838,76 @@ var RenderContour = class {
   }
 };
 
+// render-keypoints.ts
+var RenderKeyPoints = class {
+  start(context, style) {
+    this.context = context;
+    this.style = style;
+  }
+  draw(element, xOffset, yOffset, xScale, yScale, streamTime) {
+    if (element.keyPoints) {
+      const style = this.style;
+      if (!style) {
+        throw new Error("render() called before start()");
+      }
+      let fillColor = style.colors.primary_color;
+      for (let i = 0; i < element.keyPoints.length; i++) {
+        const keyPoints = element.keyPoints[i];
+        this.renderKeyPoints(keyPoints, fillColor, Math.max(element.width, element.height), xOffset, yOffset, xScale, yScale);
+      }
+    }
+  }
+  renderKeyPoints(keyPoints, fillColor, width, xOffset, yOffset, xScale, yScale) {
+    let maxZ = 1;
+    let minZ = -1;
+    for (let i2 = 0; i2 < keyPoints.points.length; i2++) {
+      const keyPoint = keyPoints.points[i2];
+      if (keyPoint.z) {
+        if (keyPoint.z > maxZ) {
+          maxZ = keyPoint.z;
+        }
+        if (keyPoint.z < minZ) {
+          minZ = keyPoint.z;
+        }
+      }
+    }
+    const context = this.context;
+    const style = this.style;
+    if (!context || !style) {
+      throw new Error("render() called before start()");
+    }
+    const MIN_RADIUS = 2;
+    const MAX_RADIUS = width / 40;
+    for (var i = 0; i < keyPoints.points.length; i++) {
+      const p = keyPoints.points[i];
+      const x = xOffset + p.x * xScale;
+      const y = yOffset + p.y * yScale;
+      const z = p.z ?? 0 * Math.max(xScale, yScale);
+      const radius = MAX_RADIUS - (z - minZ) * (MAX_RADIUS - MIN_RADIUS) / (maxZ - minZ);
+      context.beginPath();
+      context.arc(x, y, radius, 0, Math.PI * 2, false);
+      context.fillStyle = fillColor;
+      context.fill();
+      context.strokeStyle = style.colors.secondary_color;
+      context.stroke();
+      let label;
+      if (typeof p.visible == "undefined") {
+        label = p.classLabel;
+      } else {
+        label = `${p.classLabel} (${p.visible ? "visible" : "invisible"})`;
+      }
+      context.font = style.font;
+      context.fillStyle = "#ffffff";
+      context.textAlign = "left";
+      context.textBaseline = "top";
+      const tw = context.measureText(label);
+      let xPos = p.x * xScale + xOffset + radius;
+      let yPos = p.y * yScale + yOffset - (radius + tw.actualBoundingBoxAscent + tw.actualBoundingBoxDescent);
+      context.fillText(label, xPos, yPos);
+    }
+  }
+};
+
 // index.ts
 var Render2d;
 ((Render2d2) => {
@@ -849,7 +919,7 @@ var Render2d;
     return { render: new RenderBlur(), target };
   }
   Render2d2.renderBlur = renderBlur;
-  function renderBox(includeSecondaryLabels = false, target = "$.objects.*") {
+  function renderBox(includeSecondaryLabels = false, target = "$..objects.*") {
     return { render: new RenderBox(includeSecondaryLabels), target };
   }
   Render2d2.renderBox = renderBox;
@@ -865,6 +935,10 @@ var Render2d;
     return { render: new RenderFace(), target };
   }
   Render2d2.renderFace = renderFace;
+  function renderKeypoints(target = "$..objects[?(@.keyPoints)]") {
+    return { render: new RenderKeyPoints(), target };
+  }
+  Render2d2.renderKeypoints = renderKeypoints;
   function renderHand(target = '$..objects[?(@.classLabel=="hand circumference")]') {
     return { render: new RenderHand(), target };
   }